:root {
  --fd-theme-color: #90bb70;
  --fd-theme-text: #fff;

  --fd-theme-content-back: #fafafa;
  --fd-theme-accent-color: #40b080;
  --fd-theme-accent-hover-color: #60d0a0;

  --fd-theme-border-color: #c0cdd9;
  --fd-theme-icon-button-color: #ddd;
}

html {
  --avatar-border-radius: 50%;
}

html[data-color-scheme='light']:root {
  --color-text-brand: var(--fd-theme-accent-color);
  --color-border-brand: var(--fd-theme-accent-color);

  --color-bg-brand-base: var(--fd-theme-accent-color);
  --color-bg-brand-base-hover: var(--fd-theme-accent-hover-color);
  --color-text-on-brand-base: #fff;
}

/* ---------------------------------------------------------
 * OGP Card
 * --------------------------------------------------------- */

html a.status-card {
  align-items: stretch !important;
}

html .status-card__description {
  display: -webkit-box !important;

  -webkit-box-orient: vertical;
  -webkit-line-clamp: 7;

  overflow: hidden;

  white-space: normal !important;
}

/* ---------------------------------------------------------
 * Background
 * --------------------------------------------------------- */

html[data-color-scheme='light'] body {
  background-color: #fafafa;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAMAAADVRocKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDM2MCwgMjAyMC8wMi8xMy0wMTowNzoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjEgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkY1OUYyMEM5NkFFQzExRUJBMTQyRjU2RDhGM0JFQkY4IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkY1OUYyMENBNkFFQzExRUJBMTQyRjU2RDhGM0JFQkY4Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RjU5RjIwQzc2QUVDMTFFQkExNDJGNTZEOEYzQkVCRjgiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RjU5RjIwQzg2QUVDMTFFQkExNDJGNTZEOEYzQkVCRjgiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4Py13vAAAACVBMVEX6+vr39/f29vZgXVhTAAAAZElEQVR42uzasQ3AMAgEQPL7D50FQoFkS4lzXwPXv6gsSj0n1S1cTd4GFAAAAAAAgL8AXTpgOB8AAAAAAACArwAZHgIAAAAAAAA4FVhVVI0LKQAAAAAAAIcB2QtkDEy/c24BBgDKcRuFK4DRiwAAAABJRU5ErkJggg==);
  background-attachment: fixed;
}

/* ---------------------------------------------------------
 * Column header
 * --------------------------------------------------------- */

html[data-color-scheme='light'] .column-header,
html[data-color-scheme='light'] .column-header__back-button,
html[data-color-scheme='light'] .column-header__button,
html[data-color-scheme='light'] .column-header__button.active,
html[data-color-scheme='light'] .column-back-button {
  background: var(--fd-theme-color) !important;
  color: var(--fd-theme-text) !important;
}

/*
 * SVG / icon が currentColor を使用している場合も白にする
 */
html[data-color-scheme='light']
  :is(
    .column-header,
    .column-header__back-button,
    .column-header__button,
    .column-back-button
  )
  svg {
  color: var(--fd-theme-text);
}