/* Display container */

.display-container {
  margin: 12px 12px 0 12px;
  transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.display-container:last-child {
  margin-bottom: 12px;
}

.display-container.programming {
  border-radius: 12px 12px 0 0;
}

clamp > .small .display-container {
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
  border-radius: 0;
}

clamp > .small .display-container:last-child {
  margin-bottom: 0;
}

/* History view */

.history-view {
  background-color: shade(@card_bg_color, .95);
  color: inherit;
}

.history-view list {
  background: none;
  color: inherit;
}

.history-entry {
  border-top: 1px solid @card_shade_color;
  padding: 6px 3px;
  font-size: 1.3em;
  font-feature-settings: "tnum";
}

.history-entry:first-child {
  margin-top: -1px;
}

.history-entry .equation-label {
  /* word-spacing: 2px; Doesn't work (yet) in GTK */
}

.history-entry .equation-symbol {
  padding: 0px 12px;
}

.history-entry .answer-label {
  font-weight: bold;
}

/* Math display */

mathdisplay {
  border-top: 1px solid @card_shade_color;
  min-height: 52px;
}

mathdisplay textview,
mathdisplay textview text {
  background: none;
  color: inherit;
}

.display-scrolled > scrollbar {
  transition: margin-bottom 200ms linear;
}

.display-scrolled > scrollbar.hovering {
  margin-bottom: -8px;
}

.sourceview {
  padding-bottom: 8px;
  font-size: 1.4em;
  font-feature-settings: "tnum";
}

.sourceview > .completion cell.icon {
  padding-right: 0;
}

.sourceview > .completion box.details {
  padding: 0 4px;
}

.sourceview > .completion cell.comment:dir(rtl) {
  margin: 0 24px 8px 0;
}

.sourceview > .completion button.toggle {
  padding: 0;
  min-width: 0;
  min-height: 0;
  font-size: 0;
}

.display-scrolled + button {
  margin: 6px;
}

.info-view {
  padding: 0px;
  padding-bottom: 4px;
  min-height: 18px;
}

/* Math converter */

mathconverter {
  padding: 12px 12px 0 12px;
  background-color: shade(@card_bg_color, .95);
}

mathconverter dropdown > button:not(:hover):not(:active):not(:checked) {
  background: transparent;
}

mathconverter textview {
  min-height: 1.25em;
  margin-bottom: 4px;
  padding: 2px 10px 0 10px;
  font-weight: 800;
  font-size: 181%;
  background: transparent;
}

mathconverter textview:not(:first-child) {
  margin-top: 36px;
}

mathconverter statuspage > scrolledwindow > viewport > box {
  margin: 0 12px;
  border-spacing: 12px;
}

/* Math buttons */

.math-buttons grid.buttons {
  /* 5 44px high buttons and 4px spacing. */
  min-height: calc(44px * 5 + 4px * 4);
  /* 5 64px wide buttons and 4px spacing. */
  /* Update the clamp size in templates accordingly. */
  min-width: calc(64px * 5 + 4px * 4);
  transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

box.math-buttons,
.math-buttons grid.buttons,
.math-buttons grid.buttons > grid {
  border-spacing: 4px;
}

/* Single grid modes */
widget.math-buttons,
/* Expanded multi grid modes */
box.math-buttons {
  margin: 12px;
}

/* Collapsed multi grid modes */
carousel.math-buttons > widget > grid.buttons {
  margin: 12px 12px 0 12px;
}

.math-buttons grid > button,
.math-buttons grid > menubutton > button,
.math-buttons grid > stack > button {
  font-weight: inherit;
  font-size: 1.1em;
  /* Counter the button.text-button style. */
  padding: 2px 4px 2px 4px;
}

.math-buttons .clear-button {
  font-size: 1.2em;
  font-weight: bolder;
}

.math-buttons .number-button {
  font-size: 1.2em;
  font-weight: bolder;
  background-color: alpha(currentColor, .2);
}

.math-buttons .number-button:hover {
  background-color: alpha(currentColor, .25);
}

.math-buttons .number-button:active,
.math-buttons .number-button.keyboard-activating {
  background-color: alpha(currentColor, .35);
}

.math-buttons .operator-button,
.math-buttons .suggested-action {
  font-size: 1.6em;
}

.math-buttons .arrow-button arrow {
  transform: scaleY(-1);
}

/* Bit panel */

.bit-panel {
  padding: 6px;
  transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  border-top: 1px solid @card_shade_color;
}

clamp > :not(.small) .bit-panel {
  margin: 0 12px;
  border-radius: 0 0 12px 12px;
}

clamp  > .small .bit-panel {
  border-radius: 0;
}

.math-buttons .bit-panel {
  padding: 12px 6px 0 6px;
  border-top: none;
}

.bit-toggle-button {
  font-feature-settings: "tnum";
  padding: 1px;
  min-width: 9px;
}

.bit-toggle-separator {
  margin-right: 10px;
}

.bit-marker-label {
  font-feature-settings: "tnum";
  margin: 0 12px;
}

.math-buttons .bit-toggle-button {
  font-size: 1.2em;
  font-weight: bolder;
  padding: 0;
  min-width: 20px;
}

.math-buttons .bit-toggle-separator {
  margin-right: 9px;
}

.math-buttons .bit-marker-label {
  margin: 0;
}

/* Math popover */

.math-popover > contents {
  padding: 0;
}

.math-popover scrollbar slider {
  min-height: 26px;
}

.math-popover list {
  padding: 6px;
  background: @popover_bg_color;
}

.math-popover list > row {
  border-radius: 9px;
  min-height: 28px;
}

.math-popover list > row button {
  padding: 2px 4px;
}

.math-popover list + separator {
  margin: 0 6px;
}

.math-popover list + separator + label {
  margin: 10px 18px 0 18px;
  font-weight: bold;
}

.math-popover .category-list > row > box,
.math-popover list > row > .back-button {
  padding: 0 10px;
  border-spacing: 12px;
}

.math-popover .category-list .forward-arrow:dir(ltr),
.math-popover .back-button .back-arrow:dir(rtl) {
  opacity: 30%;
  margin-right: -2px;
}

.math-popover .category-list .forward-arrow:dir(rtl),
.math-popover .back-button .back-arrow:dir(ltr) {
  opacity: 30%;
  margin-left: -2px;
}

.math-popover > contents > box,
.math-popover > contents > stack > box,
.math-popover scrolledwindow ~ box {
  border-spacing: 6px;
}

.math-popover scrolledwindow + entry,
.math-popover scrolledwindow ~ box {
  margin: 0 6px;
}

.math-popover revealer > label {
  margin: 0 6px 6px 6px;
}

/* Character code dialog */

.action-dialog floating-sheet sheet {
  border-radius: 18px;
}

button.action-button {
  min-height: 24px;
  padding: 10px 20px;
  border-radius: 12px;
}

/* Math preferences dialog */

.currency-search-entry {
  margin: 3px 12px;
}
