////
/// @group labels
/// @author Scott Casey
////
// Basic layout for our input-label construction.
@mixin input-label{
  .input-label{
    display: inline-flex;
    gap: var(--input-label-gap);
    align-items:center;
    &:not(.stacked){
      > input[type='text']{
        flex:1 1 0;
      }
      >:not([name]){
        flex:0 0 auto;
      }
      &.large > [name]{
        @extend h2;
      }
    }
    > :is(span,button){
      text-transform:var(--input-label-text-transform);
    }
  }
  .input-label--dual{
    grid-template-columns: 1fr auto 1fr;
    grid-template-areas: 'over 	over 	over' 'under 	under 	under';
    >span:last-of-type{
      grid-column: 1 / -1;
    }
    >input:not([type="number"]):not([type="checkbox"]):not([type="radio"]){
      width: 100%;
    }
    >.slash{
      line-height: 0rem;
      font-weight: normal;
    }
  }
}