/* front/src/main.css */
:root {
  --summary-border-radius: 1.5rem;
  font-family: sans-serif;
}
.km-summary-container {
  display: flex;
  justify-content: center;
  padding: 3rem 2rem;
  & > div {
    display: flex;
    align-items: center;
    border-top: solid 1px black;
    border-bottom: solid 1px black;
    border-left: solid 1px lightgrey;
    padding: 1rem 2rem;
    &:first-child {
      border-left: solid 1px black;
      border-top-left-radius: var(--summary-border-radius);
      border-bottom-left-radius: var(--summary-border-radius);
    }
    &:last-child {
      border-right: solid 1px black;
      border-top-right-radius: var(--summary-border-radius);
      border-bottom-right-radius: var(--summary-border-radius);
    }
  }
  .bid-value {
    --cell-width: 5rem;
    --border-style: 1px solid black;
    --padding-size: 1rem;
    position: relative;
    width: var(--cell-width);
    box-sizing: border-box;
    &::before,
    &::after {
      content: "";
      display: none;
      position: absolute;
      border-bottom: 2px solid black;
      top: calc(50% - 1px);
      width: 0.5rem;
    }
    &::before {
      left: 0;
    }
    &::after {
      right: 0;
    }
  }
  .bid-value-ga {
    margin-right: var(--cell-width);
    border-right: var(--border-style);
    padding-right: var(--padding-size);
    box-shadow: 1px 0px 0px 0px black;
    text-align: right;
    &::after {
      display: block;
    }
  }
  .bid-value-ba {
    margin-left: var(--cell-width);
    border-left: var(--border-style);
    padding-left: var(--padding-size);
    box-shadow: -1px 0px 0px 0px black;
    &::before {
      display: block;
    }
  }
}
#debug-output {
  & table {
    border-collapse: collapse;
  }
  & th {
    font-size: 0.75rem;
    color: grey;
    text-align: left;
  }
  & tr {
    & th,
    & td {
      padding: 0.2rem 0.5rem;
    }
  }
  & tbody tr:has(input:checked) td {
    background-color: oklch(0.71 0.1646 243.43 / 0.4);
  }
  & tbody tr:hover td {
    background-color: oklch(0.71 0.1646 243.43) !important;
  }
}