/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

/* ===== sidebarPanel.css ===============================================
  == Styles for the Address Book sidebar panel.
  ======================================================================= */

@import url("chrome://messenger/skin/");
@import url("chrome://messenger/skin/addressbook/addressbook.css");

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#abContactsPanel {
  -moz-appearance: toolbox;
  background-color: -moz-Dialog;
}

#results_box {
  background-color: transparent;
}

@media not all and (-moz-os-version: windows-xp) {
  #abResultsTree {
    -moz-border-end: none;
    border-bottom: 1px solid #A9B1B8;
  }

  @media (-moz-windows-default-theme) {
    button,
    #addressbookList {
      -moz-appearance: none;
      margin: 1px 4px;
      padding: 1px 5px !important;
      border: 1px solid;
    }
  }
}

@media (-moz-windows-compositor) {
  #abContactsPanel {
    background-image: linear-gradient(rgba(255, 255, 255, 0.5) 10px,
                      rgba(255, 255, 255, 0));
  }
}

@media (-moz-windows-default-theme) and (-moz-os-version: windows-vista),
       (-moz-windows-default-theme) and (-moz-os-version: windows-win7) {
  #abContactsPanel {
    -moz-appearance: none;
    background-color: hsl(210, 75%, 92%);
  }

  button,
  #addressbookList {
    border-radius: 2px;
    background-image: linear-gradient(hsla(0, 0%, 100%, .6),
                      hsla(0, 0%, 100%, .1));
    background-color: hsla(210, 32%, 93%, .2);
    border-color: hsla(210, 54%, 20%, .15) hsla(210, 54%, 20%, .2)
                  hsla(210, 54%, 20%, .25);
    box-shadow: 0 1px hsla(0, 0%, 100%, .3) inset,
                0 1px hsla(210, 54%, 20%, .03),
                0 0 2px hsla(210, 54%, 20%, .1);
    transition-property: background-color, border-color, box-shadow;
    transition-duration: 150ms;
  }

  button:hover,
  #addressbookList:not([open="true"]):hover {
    border-color: hsla(210, 54%, 20%, .3) hsla(210, 54%, 20%, .35)
                  hsla(210, 54%, 20%, .4);
    background-color: hsla(210, 48%, 96%, .75);
    box-shadow: 0 0 1px hsla(210, 54%, 20%, .03),
                0 0 2px hsla(210, 54%, 20%, .1);
  }

  button:hover:active,
  #addressbookList[open="true"] {
    background-image: linear-gradient(hsla(0, 0%, 100%, .6),
                      hsla(0, 0%, 100%, .1));
    background-color: hsla(210, 54%, 20%, .15);
    border-color: hsla(210, 54%, 20%, .3) hsla(210, 54%, 20%, .35)
                  hsla(210, 54%, 20%, .4);
    box-shadow: 0 1px 1px hsla(210, 54%, 20%, .1) inset,
                0 0 1px hsla(210, 54%, 20%, .2) inset,
                0 1px 0 hsla(210, 54%, 20%, 0),
                0 0 2px hsla(210, 54%, 20%, 0);
    transition: none;
  }
}

@media (-moz-windows-default-theme) and (-moz-os-version: windows-win8),
       (-moz-windows-default-theme) and (-moz-os-version: windows-win10) {
  button,
  #addressbookList {
    background-color: hsla(210, 4%, 10%, .08);
    border-color: hsla(210, 4%, 10%, .1);
    transition-property: background-color, border-color;
    transition-duration: 150ms;
  }

  button:hover,
  #addressbookList:not([open="true"]):hover {
    background-color: hsla(210, 4%, 10%, .1);
    border-color: hsla(210, 4%, 10%, .2);
  }

  button:hover:active,
  #addressbookList[open="true"] {
    background-color: hsla(210, 4%, 10%, .12);
    border-color: hsla(210, 4%, 10%, .2);
    box-shadow: 0 1px 1px hsla(210, 4%, 10%, .1) inset,
                0 0 1px hsla(210, 4%, 10%, .2) inset,
                0 1px 0 hsla(210, 4%, 10%, 0),
                0 0 2px hsla(210, 4%, 10%, 0);
    transition: none;
  }
}
