@import 'definitions';

// HdyActionRow

row {
  label.subtitle {
    font-size: smaller;
    opacity: 0.55;
    text-shadow: none;
  }

  > box.header {
    margin-left: 12px;
    margin-right: 12px;
    min-height: 50px;

    > box.title {
      margin-top: 8px;
      margin-bottom: 8px;
    }
  }
}

// HdyExpanderRow

row.expander {
  // Drop transparent background on expander rows to let nested rows handle it,
  // avoiding double highlights.
  background-color: transparent;

  list.nested > row {
    background-color: hdyalpha($bg_color, 0.5);
    border-color: hdyalpha($borders_color, 0.7);
    border-style: solid;
    border-width: 1px 0px 0px 0px;
  }

  // HdyExpanderRow arrow rotation

  image.expander-row-arrow {
    transition: 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }

  &:checked image.expander-row-arrow {
    -gtk-icon-transform: rotate(0turn);
  }

  &:not(:checked) image.expander-row-arrow {
    opacity: 0.55;
    text-shadow: none;

    &:dir(ltr) {
      -gtk-icon-transform: rotate(-0.25turn);
    }

    &:dir(rtl) {
      -gtk-icon-transform: rotate(0.25turn);
    }
  }

  &:checked image.expander-row-arrow:not(:disabled) {
    color: $selected_bg_color;
  }

  & image.expander-row-arrow:disabled {
    color: $insensitive_fg_color;
  }
}

// Shadows

deck,
leaflet {
  > dimming {
    background: $leaflet_dimming;
  }

  > border {
    min-width: 1px;
    min-height: 1px;
    background: $leaflet_border;
  }

  > shadow {
    min-width: 56px;
    min-height: 56px;

    &.left  { @include background-shadow(to right); }
    &.right { @include background-shadow(to left); }
    &.up    { @include background-shadow(to bottom); }
    &.down  { @include background-shadow(to top); }
  }
}

// Avatar

avatar {
  border-radius: 9999px;
  -gtk-outline-radius: 9999px;
  font-weight: bold;

  // The list of colors to generate avatars.
  // Each avatar color is rapresented by a font color, a gradient start color and a gradient stop color.
  // There are 8 differnt colors for avtars in the list if you change the number of them you
  // need to update the NUMBER_OF_COLORS in src/hdy-avatar.c.
  // The 2D list has this form: ((font-color, gradient-top-color, gradient-bottom-color)).
  $avatarcolorlist: (
   (#ffe5c5, #ffbe6f, #ed6f00), // orange
   (#f9f4e1, #f8e45c, #e5a50a), // gold
   (#e7c2e8, #dc8add, #8a3ea3), // purple
   (#cfe1f5, #99c1f1, #337fdc), // blue
   (#d8d7d3, #c0bfbc, #6e6d71), // gray
   (#cbf7d5, #8de6ae, #29ae71), // green
   (#f6c8c4, #f67365, #d91a23), // red
   (#e5d6ca, #cdab8f, #865d3c), // brown
  );

  @for $i from 1 through length($avatarcolorlist) {
    &.color#{$i} {
      $avatarcolor: nth($avatarcolorlist, $i);
      background-image: linear-gradient(nth($avatarcolor, 2), nth($avatarcolor, 3));
      color: nth($avatarcolor, 1);
    }
  }

  &.contrasted { color: #fff; }
}
