@import "./variables.scss";

/* ----------------------------------------- */
/*  Basic Structure                          */
/* ----------------------------------------- */
.ose.sheet.actor.character {
  min-width: 450px;
  min-height: 550px;

  /* ----------------------------------------- */
  /*  Sheet Header                             */
  /* ----------------------------------------- */

  .sheet-header {
    .xp-bonus {
      top: -15px;
      right: 3px;
      color: $colorTan;
      font-size: 10px;
      position: absolute;
    }
  }

  /* ----------------------------------------- */
  /*  Sheet Body                               */
  /* ----------------------------------------- */
  .sheet-body {
    .health {
      &.armor-class {
        background: url('/systems/ose/assets/shield.png') no-repeat center;
        background-size: 70px;
      }
        margin: 10px 0;
        height: 70px;
        position: relative;
        input {
          font-size: 16px;
          font-weight: bolder;
          text-shadow: 0 0 2px white, 0 1px 2px white, 1px 0 2px white, 1px 1px 2px white; 
        }
        .health-top {
          border-bottom: none;
          position: absolute;
          font-size: 24px;
          top: 10px;
          width: 70px;
          left: calc(50% - 35px);
        }
        .health-bottom {
          border-bottom: none;
          position: absolute;
          bottom: 8px;
          width: 40px;
          right: calc(50% + -20px);
        }
        .health-empty {
          background: url('/systems/ose/assets/heart_empty.png') no-repeat center;
          background-size: 70px;
          background-position: top;
        }
        .health-full {
          background: url('/systems/ose/assets/heart_full.png') no-repeat center;
          background-size: 70px;
          background-position: bottom;
        }
    }
  }
  /* ----------------------------------------- */
  /*  Item Controls                            */
  /* ----------------------------------------- */
}