/* Modules */

@import 'styles/block.css';

:root {
  --border-width: 1px;
  --border-color: #dee2e6;
}

.card-title:empty {
  margin: 0;
}

.checkbox-readonly {
  pointer-events: none;
}

.action-required {
  &.show:before {
    content: '';
  }
  &:before {
    border-radius: 50%;
    height: 1rem;
    width: 1rem;
    display: inline-block;
    background: RGBA(var(--bs-danger-rgb), var(--bs-bg-opacity, 1));
    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    margin-right: 0.5rem;
    align-self: center;
  }

  &:empty:before {
    margin: 0;
  }
}

.z-4 {
  z-index: 4;
}

/* TODO: `-nobs` stands for "no bootstrap". Remove all `-nobs` occurences one botstrap removed */

.btn-nobs {
}

.flex-basis-0 {
  flex-basis: 0;
}

.vr {
  min-width: 1px;
}

.title {
  font-weight: bold;
  margin-bottom: 5px;
}

input[disabled] ~ label,
input[disabled] ~ span {
  color: gray;
}

.form-control-input {
  --y-padding: 0.1em;

  display: block;
  width: auto;
  border: none;
  padding: var(--y-padding) 0;
}

.form-control-label {
  --color: var(--bs-secondary-color);

  display: block;
  margin-top: 0;
  width: 100%;
  color: var(--color);
  font-size: 0.875em;
  border-top: var(--border-width) solid var(--bs-border-color);
}

.save-score,
.ability-card {
  .save-score,
  .skill-score {
    display: inline-block;
    min-width: 20px;
    text-align: end;
  }
}

.proficiency {
  justify-content: center;
  align-items: center;
  padding-bottom: 15px;

  input {
    height: 55px;
    width: 55px;
  }

  .title {
    --corner-size: 30px;
    --border-size: 1px;

    position: relative;
    overflow: hidden;

    &:before,
    &:after {
      content: '';
      position: absolute;
      height: var(--corner-size);
      width: var(--corner-size);
      /* height: 100%; */
      /* aspect-ratio: 1; */
      border-radius: 50%;
      border: var(--bs-border-width) solid var(--bs-border-color);
      /* box-sizing: border-box; */
      bottom: calc(0px - (var(--corner-size) / 2));
      /* bottom: 0; */
      z-index: -1;
    }

    &:before {
      left: calc(0px - (var(--corner-size) / 2));
      /* left: 0; */
      /* transform: translate(-50%, 50%); */
    }

    &:after {
      right: calc(0px - (var(--corner-size) / 2));
      /* right: 0; */
      /* transform: translate(50%, 50%); */
    }
  }
}

.inspiration {
  justify-content: center;
  align-items: center;
  padding-bottom: 15px;

  input {
    height: 25px;
    width: 25px;
  }
}

.block {
  .trainings-armors {
    label {
      font-size: 0.9em;
    }
  }

  .trainings-weapons,
  .trainings-tools {
    border-top: 2px solid black;
    overflow: hidden;
  }

  .trainings-weapons-list p {
    margin-bottom: 0;
  }
}

.class-features-base {
  table tbody tr {
    &:nth-of-type(even) {
      td,
      th {
        --bs-table-color-type: var(--bs-table-striped-color);
        --bs-table-bg-type: var(--bs-table-striped-bg);
      }
    }
  }
}

.level-block,
.armorclass-block {
  input.form-control {
    &.level,
    &.xp,
    &.armorclass {
      width: 50px;
    }
  }
  .form-text {
    &.level,
    &.xp {
      width: 50px;
    }
  }
}