/* 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/. */

/* 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/. */

@import url("chrome://chat/skin/status.css");

.im-placeholder-screen {
  background-color: -moz-Dialog;
  overflow: auto;
}
.im-placeholder-box {
  background-color: -moz-Field;
  color: -moz-FieldText;
  border: 1px solid ThreeDShadow;
  border-radius: 10px;
  padding: 1.1em;
  -moz-padding-start: 20px;
  margin-left: 1em;
  margin-right: 1em;
}
.im-placeholder-image {
  list-style-image: url("chrome://global/skin/icons/information-64.png");
  -moz-margin-end: 1.2em;
}
.im-placeholder-innerbox {
  max-width: 25em;
}
.im-placeholder-title {
  margin: 0 1em 0.6em 0;
  font-size: 160%;
  border-bottom: 1px solid ThreeDLightShadow
}
.im-placeholder-desc {
  font-size: 110%;
}

#contactlistbox {
  margin: 0 0;
}

imgroup {
  -moz-padding-start: 4px;
}

imgroup > label {
  -moz-margin-start: 4px;
}

imcontact, imconv {
  -moz-padding-start: 23px;
}

imgroup,
imconv[unread] {
  font-weight: bold;
}

imconv[attention] {
  color: blue;
}

.conv-hbox {
  -moz-box-align: center;
}

/* From instantbird/themes/blist.css */
.contactStatusText,
.convStatusText {
  color: GrayText;
}

.contactDisplayName,
.convDisplayName {
  -moz-margin-end: 0;
}

imcontact[aliasing] .contactDisplayName {
  -moz-binding: url("chrome://global/content/bindings/textbox.xml#textbox");
}

.contactStatusText,
.convStatusText {
  -moz-margin-start: 0;
}

/* Avoid a strange jumping bug when hovering and the startChatBubble appears */
.contact-vbox {
  min-height: 40px;
}

.startChatBubble,
.closeConversationButton {
  margin: 0 3px;
  padding: 0;
  border: none;
  background: transparent;
  -moz-binding: url('chrome://global/content/bindings/button.xml#button-image');
  -moz-appearance: none;
  width: 16px;
  height: 16px;
  min-height: 16px;
  min-width: 16px;
}

.startChatBubble {
  list-style-image: url('chrome://chat/skin/prpl-generic/icon.png');
}

.closeConversationButton {
  -moz-margin-end: 0;
  -moz-stack-sizing: ignore;
  list-style-image: url("chrome://global/skin/icons/close.png");
  -moz-image-region: rect(0, 16px, 16px, 0);
}
.closeConversationButton:hover {
  -moz-image-region: rect(0, 32px, 16px, 16px);
}
.closeConversationButton:hover:active {
  -moz-image-region: rect(0, 48px, 16px, 32px);
}


/* From im/themes/conversation.css */
.browser {
  margin: 0 0;
}

.conv-bottom, .conv-nicklist {
  margin: 0 0;
}

.convBox {
  min-height: 135px;
}

.conv-top {
  min-height: 60px;
}

.conv-top-info {
  margin: 0 0;
  padding: 0 0;
  border-style: none;
  -moz-appearance: none;
  /* Copy of .main-header-area from osx/mail/messageHeader.css */
  color: #2E3436; /* Aluminium 6 */
  border-bottom:1px solid #BFBFBF !important;
  padding: 0.6ex;
}

.userIconHolder {
  border: 2px solid rgba(0,0,0,0.15);
  border-radius: 5px;
  overflow: hidden;
}

.userIcon,
.userIconHolder {
  max-width: 48px;
  max-height: 48px;
  width: 48px;
  height: 48px;
}

.userIcon:not([src]),
.userIconHolder:not([userIcon]) {
  display: none;
}

.userIcon[src=""] {
  background-image: url("chrome://messenger/skin/userIcon.png");
  background-size: contain;
  background-repeat: no-repeat;
}

.statusTypeIcon {
  margin: 0 0;
  width: 16px;
  height: 16px;
  min-height: 16px;
  min-width: 16px;
  -moz-appearance: none;
  background-color: transparent;
  border: none;
}


.statusTypeIcon[typing] {
  list-style-image: url('chrome://chat/skin/typing-16.png');
}

.statusTypeIcon[typed] {
  list-style-image: url('chrome://chat/skin/typed-16.png');
}


.statusMessage {
  margin: 0 0 !important;
  min-height: 16px;
}

.statusMessage[noTopic]:not([editing]),
.statusMessageWithDash[noTopic] {
  font-style: italic;
}

.status-overlay-icon[status="away"],
.status-overlay-icon[status="unavailable"] {
  list-style-image: url('chrome://chat/skin/away.png');
}

.status-overlay-icon[status="idle"] {
  list-style-image: url('chrome://chat/skin/idle.png');
}

.status-overlay-icon[status="mobile"] {
  list-style-image: url('chrome://chat/skin/mobile.png');
}

.status-overlay-icon[status="offline"] {
  list-style-image: url('chrome://chat/skin/offline.png');
}

.status-overlay-icon[status="unknown"] {
  list-style-image: url('chrome://chat/skin/unknown.png');
}

/* corresponds to im/themes/conversation.css @media all and (min-height: 251px) */
.statusImageStack,
.displayNameAndstatusMessageStack {
  margin: 2px 2px;
}

.statusMessage {
  margin-top: 32px !important;
}

.statusMessage[editing] {
  margin: 29px 0 -1px -4px !important;
}

.displayName {
  font-size: 16px;
  border-bottom: 1px solid rgba(0,0,0,0.25);
  margin: 0 0 16px !important;
  padding-right: 20px;
}

.prplIcon {
  margin: 0 1px 16px -16px !important;
}

.statusTypeIcon {
  margin: 32px 0 0;
}

.userIconHolder[userIcon] + .statusTypeIcon {
  margin-left: 32px;
}

.conv-messages {
  min-width: 150px;
}



/* Animation copied from the find bar in Firefox - http://dxr.mozilla.org/mozilla-central/source/toolkit/themes/linux/global/findBar.css#7 */
.conv-status-container {
  display: block;
  height: 20px;
  padding: 3px;
  border-bottom: 1px solid ThreeDShadow;
  transition-property: margin-top, opacity, visibility;
  transition-duration: 150ms, 150ms, 0s;
  transition-timing-function: ease-in-out, ease-in-out, linear;
}

.conv-status-container[hidden] {
  /* Override display:none to make the transition work. */
  display: -moz-box;
  visibility: collapse;
  margin-top: -1em;
  opacity: 0;
  transition-delay: 0s, 0s, 150ms;
}

.conv-textbox {
  -moz-appearance: none;
  margin: 0;
  padding: 3px;
  border: none;
  box-shadow: inset 0 1px 3px 0px rgba(0, 0, 0, 0.6);
}

.conv-textbox[focused="true"] {
  box-shadow: inset 0 0 2px 1px rgba(40, 120, 212, 0.9),
                    0 0 2px 0px rgba(40, 120, 212, 0.6),
              inset 0 1px 2px 0px rgba(0, 0, 0, 0.5);
}

.conv-textbox[invalidInput="true"] {
  box-shadow: inset 0 0 2px 1px rgba(255, 0, 0, 0.9),
                    0 0 2px 0px rgba(255, 0, 0, 0.6),
              inset 0 1px 2px 0px rgba(0, 0, 0, 0.4);
}


.conv-counter {
  color: #000;
  background-color: rgba(246, 246, 246, 0.7);
  -moz-border-start: 1px solid rgb(200, 200, 200);
  border-top: 1px solid rgb(200, 200, 200);
  /* Padding that gets flipped to margins in .conv-counter[value^="0"] to avoid the red border. */
  font-size: 130%;
  padding-top: 0;
  padding-bottom: 1px;
  -moz-padding-start: 5px;
  -moz-padding-end: 6px;
  margin: 0;
}

.conv-counter:-moz-locale-dir(ltr) {
  border-top-left-radius: 3px;
}

.conv-counter:-moz-locale-dir(rtl) {
  border-top-right-radius: 3px;
}

.conv-counter[value=""] {
  display: none;
}

/* Negative counter values (user went over the character limit). */
.conv-counter[value^="-"] {
  color: red;
}

.conv-counter {
  padding-bottom: 0;
  -moz-padding-end: 5px;
  -moz-margin-end: 2px;
  margin-bottom: 2px !important; /* override 4px from description */
}

grippy {
  display: none;
}

.splitter {
  margin: 0;
  border-style: none;
  min-height: 2px;
  background: linear-gradient(rgba(0,0,0,0.35), transparent);
}

#conv-toolbar {
  border-style: none;
}

#logTree {
  margin: 0 0;
}

.conv-nicklist > .listitem-iconic > .listcell-iconic > .listcell-label {
  font-weight: bold;
  -moz-padding-start: 1px;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
}

.conv-nicklist > .listitem-iconic > .listcell-iconic > .listcell-icon {
  min-width: 16px;
  margin: 0 2px;
}

.conv-logs-header-label {
  -moz-appearance: treeheadercell;
  margin: 0 -1px 0 0;
  padding-left: 3px;
}

.conv-nicklist-header {
  -moz-appearance: treeheadercell;
  margin-right: -1px;
}

.conv-nicklist-header-label {
  -moz-margin-start: 3px !important;
  margin-top: 1px !important;
  margin-bottom: 0 !important;
  -moz-margin-end: 2px !important;
}

.conv-nicklist, #logTree {
  -moz-appearance: none;
  width: 250px;
  border: 0px;
}

.listitem-iconic[inactive] > .listcell-iconic > .listcell-icon {
  opacity: 0.45;
}

.listitem-iconic[inactive][selected] > .listcell-iconic > .listcell-icon {
  opacity: 0.7;
}

.listitem-iconic[inactive] > .listcell-iconic > .listcell-label {
  color: GrayText !important;
  font-weight: normal;
}

.listitem-iconic[inactive][selected] > .listcell-iconic > .listcell-label {
  color: -moz-cellhighlighttext !important;
}

.conv-nicklist:focus > .listitem-iconic[inactive][selected] > .listcell-iconic > .listcell-label {
  color: HighlightText !important;
}


/* from instantbird/themes/blist.css */
imgroup .twisty {
  width: 9px;
  height: 9px;
  -moz-margin-end: 3px;
  -moz-margin-start: 3px;
  background: url("chrome://global/skin/arrow/arrow-dn-sharp.gif") no-repeat center;
}

imgroup[closed] .twisty {
  background: url("chrome://global/skin/arrow/arrow-rit-sharp.gif") no-repeat center;
}

#searchResultConv > .prplBuddyIcon > .protoIcon {
  list-style-image: url("chrome://global/skin/icons/search-textbox.png");
}

#statusTypeIcon {
  min-width: 40px;
}

/* show the status icon also in text mode */
toolbar[mode="text"] #statusTypeIcon > .toolbarbutton-icon {
  display: -moz-box;
}

.statusMessageToolbarItem {
  margin: 2px 4px;
  -moz-margin-start: -1px;
  padding: 3px 5px 4px;
  border: 1px solid transparent;
}

#chat-status-selector:hover > .statusMessageToolbarItem,
.statusMessageToolbarItem:focus {
  border-color: ThreeDShadow;
}

.statusMessageToolbarItem[statusType="offline"],
.statusMessageToolbarItem[disabled] {
  border: none;
}

#chat-status-selector > .statusMessageToolbarItem[editing] {
  -moz-appearance: none;
  -moz-padding-start: 4px;
  -moz-padding-end: 4px;
  border-color: ThreeDShadow;
  background-color: -moz-field;
}

#statusTypeIcon:-moz-locale-dir(ltr) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

#statusTypeIcon:-moz-locale-dir(rtl) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

#statusTypeIcon > .toolbarbutton-text {
  display: none;
}

.statusMessageToolbarItem {
  height: 22px;
  -moz-margin-start: -3px;
  margin-bottom: 2px;
  padding-bottom: 3px;
}

#chat-status-selector:hover > .statusMessageToolbarItem,
#chat-status-selector > .statusMessageToolbarItem[editing],
.statusMessageToolbarItem:focus {
  border-color: #AAAAAA;
  box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5),
              0px 1px 0px rgba(255, 255, 255, 0.5) inset;
}

#chat-status-selector > .statusMessageToolbarItem[editing] {
  border-color: #888888;
}

/* Adaptation of #folderpane_splitter */
#listSplitter {
  background-image: none;
  width: 1px;
  min-width: 1px;
  -moz-border-start: solid 1px #8B8B8B;
}

#contextSplitter {
  border: none;
  -moz-border-end: 1px solid #8B8B8B;
  background: none;
  min-width: 0;
  /* splitter grip area */
  width: 5px;
  /* make only the splitter border visible */
  -moz-margin-start: -4px;
  /* because of the negative margin needed to make the splitter visible */
  position: relative;
  z-index: 10;
}

.conv-status-container {
  border-bottom-color: #8B8B8B;
}

/* Adaptation of #folderPaneBox/#folderPaneTree from osx/mail/mailWindow1.css */
#listPaneBox {
  -moz-appearance: -moz-mac-vibrancy-light;
  background-color: #DEE4EA !important;
}

#listPaneBox:-moz-window-inactive {
  background-color: #E8E8E8 !important;
}

#listPaneBox > * {
  background: transparent !important;
  -moz-appearance: none !important;
}

/* Set a background color to avoid lightweight theme backgrounds */
#contextPane {
  background-color: #FFFFFF;
}

/* Adaptation of #searchInput from osx/mail/searchBox.css */
/* it looks like appearance: searchfield gets us our search icon... */
#IMSearchInput {
  margin: 3px 4px 4px !important;
  -moz-appearance: searchfield;
  font: icon;
  height: 22px !important;
}

#IMSearchInput > .textbox-input-box {
  border: none;
  padding-top: 1px;
  height: 21px !important;
  margin: 0 !important;
}

#IMSearchInput:-moz-lwtheme:not([focused="true"]) {
  opacity: .9;
}

#button-add-buddy {
  list-style-image: url("chrome://messenger/skin/icons/chat-toolbar.png");
  -moz-image-region: rect(0px 18px 18px 0px);
}

#button-add-buddy:not([disabled="true"]):active {
  -moz-image-region: rect(18px 18px 36px 0px);
}

@media (min-resolution: 2dppx) {
  #button-add-buddy {
    list-style-image: url("chrome://messenger/skin/icons/chat-toolbar@2x.png");
    -moz-image-region: rect(0px 36px 36px 0px);
  }

  #button-add-buddy:not([disabled="true"]):active {
    -moz-image-region: rect(36px 36px 72px 0px);
  }
}

#button-join-chat {
  list-style-image: url("chrome://messenger/skin/icons/chat-toolbar.png");
  -moz-image-region: rect(0px 36px 18px 18px);
}

#button-join-chat:not([disabled="true"]):active {
  -moz-image-region: rect(18px 36px 36px 18px);
}

@media (min-resolution: 2dppx) {
  #button-join-chat {
    list-style-image: url("chrome://messenger/skin/icons/chat-toolbar@2x.png");
    -moz-image-region: rect(0px 72px 36px 36px);
  }

  #button-join-chat:not([disabled="true"]):active {
    -moz-image-region: rect(36px 72px 72px 36px);
  }
}

#button-chat-accounts {
  list-style-image: url("chrome://messenger/skin/icons/chat-toolbar.png");
  -moz-image-region: rect(0px 54px 18px 36px);
}

#button-chat-accounts:not([disabled="true"]):active {
  -moz-image-region: rect(18px 54px 36px 36px);
}

@media (min-resolution: 2dppx) {
  #button-chat-accounts {
    list-style-image: url("chrome://messenger/skin/icons/chat-toolbar@2x.png");
    -moz-image-region: rect(0px 108px 36px 72px);
  }

  #button-chat-accounts:not([disabled="true"]):active {
    -moz-image-region: rect(36px 108px 72px 72px);
  }
}

#statusTypeIcon[status="available"],
#statusTypeAvailable,
.statusTypeIcon[status="available"],
#imStatusAvailable,
#appmenu_imStatusAvailable,
richlistitem[state="connected"] .accountStateIcon {
  list-style-image: url("chrome://messenger/skin/icons/status.png");
  -moz-image-region: rect(0px 16px 16px 0px);
}

#statusTypeIcon[status="idle"],
.statusTypeIcon[status="idle"] {
  list-style-image: url("chrome://messenger/skin/icons/status.png");
  -moz-image-region: rect(0px 32px 16px 16px);
}

#statusTypeIcon[status="offline"],
#statusTypeIcon[status="invisible"],
#statusTypeOffline,
.statusTypeIcon[status="offline"],
.statusTypeIcon[status="invisible"],
#imStatusOffline,
#appmenu_imStatusOffline,
richlistitem[state="disconnected"] .accountStateIcon {
  list-style-image: url("chrome://messenger/skin/icons/status.png");
  -moz-image-region: rect(0px 48px 16px 32px);
}

#statusTypeIcon[status="unavailable"],
#statusTypeIcon[status="away"],
#statusTypeUnavailable,
.statusTypeIcon[status="unavailable"],
.statusTypeIcon[status="away"],
#imStatusUnavailable,
#appmenu_imStatusUnavailable {
  list-style-image: url("chrome://messenger/skin/icons/status.png");
  -moz-image-region: rect(0px 64px 16px 48px);
}

@media (min-resolution: 2dppx) {
  #statusTypeIcon[status="available"],
  #statusTypeAvailable,
  .statusTypeIcon[status="available"],
  #imStatusAvailable,
  #appmenu_imStatusAvailable,
  richlistitem[state="connected"] .accountStateIcon {
    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
    -moz-image-region: rect(0px 32px 32px 0px);
  }

  #statusTypeIcon[status="idle"],
  .statusTypeIcon[status="idle"] {
    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
    -moz-image-region: rect(0px 64px 32px 32px);
  }

  #statusTypeIcon[status="offline"],
  #statusTypeIcon[status="invisible"],
  #statusTypeOffline,
  .statusTypeIcon[status="offline"],
  .statusTypeIcon[status="invisible"],
  #imStatusOffline,
  #appmenu_imStatusOffline,
  richlistitem[state="disconnected"] .accountStateIcon {
    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
    -moz-image-region: rect(0px 96px 32px 64px);
  }

  #statusTypeIcon[status="unavailable"],
  #statusTypeIcon[status="away"],
  #statusTypeUnavailable,
  .statusTypeIcon[status="unavailable"],
  .statusTypeIcon[status="away"],
  #imStatusUnavailable,
  #appmenu_imStatusUnavailable {
    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
    -moz-image-region: rect(0px 128px 32px 96px);
  }

  .prplIcon,
  #statusTypeIcon .button-icon {
    width: 16px;
    height: 16px;
  }
}

:-moz-any(imconv, imcontact, imgroup)[selected] {
  background: linear-gradient(#5ea3df 6%, #73b8ea 6%, #6cafe5 7%,
                              #3984d2 95%, #3577c2 100%);
  color: HighlightText;
}

:-moz-any(imconv, imcontact, imgroup)[selected]:-moz-system-metric(mac-graphite-theme) {
  background: linear-gradient(#7b8b9e 6%, #93a3b4 6%, #8fa0b1 7%,
                              #587088 95%, #536b84 100%);
}

:-moz-any(imconv, imcontact, imgroup)[selected]:-moz-window-inactive {
  background: linear-gradient(#bbc5d7 6%, #c3cbe0 6%, #bdc6dd 7%,
                              #9ca9c6 95%, #939fba 100%);
}

@media (-moz-mac-yosemite-theme) {
  :-moz-any(imconv, imcontact, imgroup) treechildren::-moz-tree-cell-text {
    font-family: 'Helvetica Neue';
  }

  :-moz-any(imconv, imcontact, imgroup) treechildren::-moz-tree-cell-text(selected, focus),
  :-moz-any(imconv, imcontact, imgroup) treechildren::-moz-tree-cell-text(selected),
  :-moz-any(imconv, imcontact, imgroup)[selected] {
    color: black;
  }

  :-moz-any(imconv, imcontact, imgroup)[selected],
  :-moz-any(imconv, imcontact, imgroup)[selected]:-moz-system-metric(mac-graphite-theme),
  :-moz-any(imconv, imcontact, imgroup)[selected]:-moz-window-inactive {
    background: rgba(0, 0, 0, .1);
  }
}

#displayNameAndstatusMessageStack #statusMessage {
  margin: 32px 0 0;
  min-height: 16px;
}

#displayNameAndstatusMessageStack #statusMessage[editing] {
  margin: 29px 2px 0 -4px;
}

#displayNameAndstatusMessageStack #displayName[editing] {
  margin-left: -4px;
  margin-right: -2px;
  margin-bottom: 18px;
}

@media (min-resolution: 2dppx) {
  .closeConversationButton {
    list-style-image: url("chrome://global/skin/icons/close@2x.png");
    -moz-image-region: rect(0, 32px, 32px, 0);
  }

  .closeConversationButton:hover {
    -moz-image-region: rect(0, 64px, 32px, 32px);
  }

  .closeConversationButton:hover:active {
    -moz-image-region: rect(0, 96px, 32px, 64px);
  }

  .closeConversationButton > .button-image-icon {
    width: 16px;
    height: 16px;
  }
}

.tabmail-tab[type="chat"],
.alltabs-item[type="chat"] {
  list-style-image: url("chrome://messenger/skin/icons/mail-toolbar.png");
  -moz-image-region: rect(1px, 395px, 17px, 379px);
}

@media (min-resolution: 2dppx) {
  .tabmail-tab[type="chat"],
  .alltabs-item[type="chat"] {
    list-style-image: url("chrome://messenger/skin/icons/mail-toolbar@2x.png");
    -moz-image-region: rect(0px 792px 36px 756px);
  }
}
