jcbantuelle/dominion-meteor

$card_height: 46px;
$event_height: 29px;
$debt_color: #a94442;

body {
  overflow-y: scroll;
}

.popover {
  max-width: none;
}

.token {
  font-size: 7pt;
}

.red {
  color: red;
}

.blue {
  color: blue;
}

.yellow {
  color: yellow;
}

.green {
  color: green;
}

#game-over {
  margin-top: 20px;
}

.card-container {
  clear: both;
  height: $card_height;
  padding-bottom: $card_height + 5px;
}

.card-container.empty-pile .card-name span.stack-name {
  text-decoration: line-through;
}

.card-container.empty-pile .remaining {
  color: red;
}

.card-container.empty-pile img.card-image {
  opacity: 0.4;
}

.card-thumbnail,
.card-details,
.event-thumbnail,
.event-details,
.landmark-thumbnail,
.landmark-details,
.project-thumbnail,
.project-details,
.way-thumbnail,
.way-details,
.boon-thumbnail,
.boon-details {
  float: right;
}

.card-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
  height: $card_height;
}

.card-name span {
  line-height: $card_height;
  padding: 1px;
}

.card-details {
  text-align: center;
  padding-left: 8px;
  padding-right: 5px;
  line-height: 15px;
  padding-top: 5px;
}

.event-container, .landmark-container, .project-container, .boon-container, .way-container {
  height: $event_height;
  padding-bottom: $event_height + 5px;
}

.landmark-name,
.event-name,
.project-name,
.way-name,
.boon-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
  height: $event_height;
}

.way-name, .way-of-the-mouse {
  padding-right: 4px;
}

.landmark-name span,
.event-name span,
.project-name span,
.way-name span,
.boon-name span {
  line-height: $event_height;
}

.landmark-details,
.event-details,
.project-details,
.way-details,
.boon-details {
  text-align: center;
  padding-left: 8px;
  padding-right: 8px;
  line-height: 15px;
  padding-top: 7px;
}

.card-tooltip {
  display: none;
  z-index: 10000;
}

.remaining {
  color: lightblue;
}

#game-log {
  height: 250px;
  margin-bottom: 20px;
  overflow: auto;
}

#hand {
  padding-top: 5px;
  margin-bottom: 100px;
}

#hand ul {
  float: left;
  list-style-type: none;
  margin: 0px;
  padding: 0px;
  padding-left: 10px;
}

#hand .hand-card li {
  position: relative;
  height: 20px;
}

#game-info {
  font-size: 10pt;
}

#draw-pile img {
  margin-right: -3px;
}

#discard-pile {
  margin-right: 1px;
  img {
    margin-right: -4px;
  }
}

#action-area div {
  float: left;
}

#turn-status {
  padding-right: 10px;
}

#turn-actions {
  margin-left: 10px;
}

#sortable-cards>div {
  float: left;
}

.ordered {
  margin: 5px;
}

.bane {
  background-color: plum;
}

.trade-token {
  background-color: gold;
}

.embargo-token {
  background-color: crimson;
}

.modal-body {
  height: 600px;
}

.pagination span {
  cursor: pointer;
}

.pagination span {
  cursor: pointer;
}

.debt {
  color: $debt_color;
}

.face-down {
  text-decoration: line-through;
}

#game {
  font-size: .9rem;

  #game-log {
    font-size: .83rem;
  }

  #turn-event-button {
    margin: 10px 0px;
  }

  #game-chat {
    height: 175px;
    overflow: auto;
  }

  #game-chat, #message {
    margin-left: auto;
    margin-right: auto;
  }

  .btn-debt {
    background-color: $debt_color;
    border-color: $debt_color;
  }

  #play-coffer, #play-debt-token, #play-villager {
    line-height: 1;
    padding: 1px;
  }
}

#game-info-modal {
  font-size: .9rem;
}