/*********
 * Menus *
 *********/


menubar,
.menubar {
  -GtkWidget-window-dragging: true;
  padding: 0px;
  box-shadow: none;
  border-style: none;
  background-color: w_color(normal);
  &:backdrop {
    background-color: backdrop(w_color(normal));
  }
  > menuitem {
    min-height: 16px;
    padding: 4px 6px;
    border-style: solid;
    border-width: 1px 0px;
    border-color: w_color(normal);
    &:hover { //Seems like it :hover even with keyboard focus
      background-color: b_color(active);
      color: b_color(active-text);
    }
    &:disabled {
      color: insensitive(w_color(text));
      box-shadow: none;
      &:backdrop {
        background-color: backdrop(w_color(normal));
        color: backdrop(insensitive(w_color(text)));
      }
    }
    &:backdrop {
      background-color: backdrop(w_color(normal));
      border-color: backdrop(w_color(normal));
      color: backdrop(w_color(text));
    }
  }
}

menu,
.menu {
  padding: 0px;
  background-color: $menu_color;
  border: 0px solid transparent;
  // FIXME workaround for libreoffice gtk3, should be a border
  //border: 1px solid $border_color; // adds borders in a non composited env
  box-shadow: inset 0px 0px 0px 1px $border_color;

  border-radius: $r;
  .csd & {
    //background-color: transparent;
    border: 0px solid;
    border-radius: $r;
    //box-shadow: 0px 0px 0px 1px $border_color, 2px 2px 2px 1px rgba(0, 0, 0, 0.1);
  }  // axes borders in a composited env
  separator {
    color: $border_color;
    margin-top: 3px;
    margin-bottom: 3px;
  }
  menuitem {
	  text-shadow: none;
    min-height: 16px;
    min-width: 40px;
    padding: 4px 4px;
    &:hover {
      color: b_color(active-text);
      background-color: b_color(active);
    }
    &:disabled {
      color: insensitive(w_color(text));
      &:backdrop { color: backdrop(insensitive(w_color(text))); }
    }
    &:backdrop, &:backdrop:hover {
      color: backdrop(w_color(text));
      background-color: backdrop(w_color(normal));
    }
    // submenu indicators
    arrow {
      min-height: 16px;
      min-width: 16px;

      &:dir(ltr) {
        -gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
        margin-left: 10px;
      }

      &:dir(rtl) {
        -gtk-icon-source:-gtk-icontheme('pan-start-symbolic');
        margin-right: 10px;
      }
    }
  }
  // overflow arrows
  > arrow {
    @include button(undecorated);

    min-height: 16px;
    min-width: 16px;
    padding: 4px;
    background-color: transparent;
    border-radius: 0;

    &.top {
      margin-top: -6px;
      border: none;
      -gtk-icon-source: -gtk-icontheme('pan-up-symbolic');
    }

    &.bottom {
      margin-bottom: -6px;
      border: none;
      -gtk-icon-source: -gtk-icontheme('pan-down-symbolic');
    }

    &:hover { color: b_color(hover); }
    &:active { color: b_color(active)}

    &:backdrop { background-color: backdrop($menu_color); }

    &:disabled {
      color: transparent;
      background-color: transparent;
      border-color: transparent ;
    }
  }
}

menuitem {
  accelerator { color: gtkalpha(currentColor,0.55); }
  check,
  radio {
    min-height: 18px;
    min-width: 18px;

    &:dir(ltr) { margin-right: 6px; }
    &:dir(rtl) { margin-left: 6px; }
  }
}
/***************
 * Popovers   *
 ***************/
/* menu buttons */
modelbutton.flat,
.menuitem.button.flat {
 min-height: 16px;
 padding: 4px 8px;

 @extend %undecorated_button;
 color: w_color(text);
 &:hover {
    background-color: b_color(active);
    color: b_color(active-text)
  }
 &:selected {
    background-color: b_color(active);
    color: b_color(active-text)
  }
 &:backdrop, &:backdrop:hover {
    @extend %undecorated_button;
    color: backdrop(w_color(text));
  }
  check:hover {-gtk-icon-source: -gtk-scaled(url("../assets/check-unchecked.png"), url("../assets/check-unchecked@2.png"));}
  radio:hover {-gtk-icon-source: -gtk-scaled(url("../assets/radio-unchecked.png"), url("../assets/radio-unchecked@2.png"));}

  check:checked:hover {-gtk-icon-source: -gtk-scaled(url("../assets/check-checked-active.png"), url("../assets/check-checked-active@2.png"));}
  radio:checked:hover {-gtk-icon-source: -gtk-scaled(url("../assets/radio-checked-active.png"), url("../assets/radio-checked-active@2.png"));}

  check:indeterminate:hover {-gtk-icon-source: -gtk-scaled(url("../assets/check-mixed.png"), url("../assets/check-mixed@2.png"));}
  radio:indeterminate:hover {-gtk-icon-source: -gtk-scaled(url("../assets/radio-mixed.png"), url("../assets/radio-mixed@2.png"));}

  // FIXME: remove the following when the checks/radios rewrite lands
  check:last-child,
  radio:last-child { margin-right: 0px; }

  check:first-child,
  radio:first-child { margin-left: 0px; }
}

modelbutton.flat arrow {
  background: none;

  &:hover { background: none; }

  &.left { -gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }

  &.right { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
}

popover.background {
  padding: 0px;
  border: 1px solid $border_color;
  border-radius: 3px;
  background-color: w_color(normal);

  box-shadow: 0 2px 3px transparentize(black, 0.1);

  &:backdrop {
    box-shadow: none;
  }
  
  > list,
  > .view,
  > toolbar {
    border-style: none;
    background-color: transparent;
  }
  .csd &, & {
    &.touch-selection,
    &.magnifier {
      @extend %osd;

      border: 1px solid $border_color;

      button { @extend %button };
    }

    &.osd { @extend %osd; }
  }

  separator { margin: 3px; }

  list separator { margin: 0px; }

  checkbutton,
  radiobutton { @extend modelbutton.flat; }
}

// .scale-popup .button,
// .scale-popup .button.flat { // +/- buttons on GtkVolumeButton popup
//   @extend %undecorated_button;
//   background-color: transparent;
//   padding: 5px;
//   color: w_color(text);
//   &:hover {
//     @extend %undecorated_button;
//     color: b_color(hover);
//   }
//   &:active {
//     color: b_color(active);
//   }
//   &:insensitive {
//     color: insensitive(w_color(text));
//   }
//   &:backdrop {
//     color: backdrop(w_color(text));
//     &:insensitive {
//       color: backdrop(insensitive(w_color(text)));
//     }
//   }
// }

GtkVolumeButton.button { padding: 5px; }
