configuration {
  show-icons: true;
}

* {
  bg:               #0f1115ee;
  bg-alt:           #171a21ff;
  fg:               #e6eaf2ff;
  fg-muted:         #aab4c3ff;
  accent:           #89b4faff;
  border:           #2a2f3aff;
  selected:         #1e2530ff;

  background-color: transparent;
  text-color: @fg;
}

window {
  location: center;
  anchor: center;
  width: 28%;
  border: 2px;
  border-radius: 14px;
  border-color: @border;
  background-color: @bg;
  padding: 12px;
}

mainbox {
  children: [ inputbar, listview ];
  spacing: 10px;
}

inputbar {
  children: [ prompt, entry ];
  spacing: 8px;
  padding: 10px 12px;
  border-radius: 10px;
  background-color: @bg-alt;
}

prompt {
  text-color: @accent;
}

entry {
  text-color: @fg;
  placeholder: "search...";
  placeholder-color: @fg-muted;
}

listview {
  columns: 3;
  lines: 1;
  dynamic: false;
  cycle: false;
  scrollbar: true;
  spacing: 10px;
  layout: vertical;
}

element {
  orientation: vertical;
  padding: 8px;
  border-radius: 10px;
  background-color: transparent;
}

element normal.normal {
  background-color: transparent;
  text-color: @fg-muted;
}

element selected.normal {
  background-color: @selected;
  text-color: @fg;
}

element-icon {
  size: 120px;
  border-radius: 8px;
}

element-text {
  horizontal-align: 0.5;
  vertical-align: 0.5;
}