// ============================================================
// BASE — Fonts, :root CSS vars, global form elements
// ============================================================

@font-face {
  font-family: "Sherwood";
  src: url("../assets/fonts/Sherwood.otf") format("opentype"),
       url("../assets/fonts/SHERWOOD.TTF") format("truetype"),
       url("../assets/fonts/Sherwood.woff") format("woff");
}
@font-face {
  font-family: "BlueDragon";
  src: url("../assets/fonts/Blue Dragon.ttf") format("truetype");
}

:root {
  --oh-font-primary:    @font-primary;
  --oh-font-secondary:  @font-secondary;
  --oh-font-body:       @font-body;
  --oh-font-size:       @font-size-base;
  --oh-color-blue:      @color-blue;
  --oh-color-olive:     @color-olive;
  --oh-color-gold:      @color-gold;
  --oh-color-dark:      @color-dark;
  --oh-color-paper:     @color-paper;
  --oh-background-image: url("../assets/ui/oath_hammer_paper.webp");
  --oh-logo:            url("../assets/logos/official_logo_01.webp");
}

// Global dialog styling
.application.dialog.oathhammer {
  font-family: @font-primary;
  font-size: @font-size-base;
  .sheet-background();
}

// Shared actor content base
.oathhammer .character-content,
.oathhammer .npc-content {
  font-family: @font-primary;
  font-size: @font-size-base;
  color: var(--color-dark-1);
  .sheet-background();
  overflow: auto;

  nav.tabs [data-tab] {
    color: @color-olive;
    &.active { color: @color-blue; }
  }

  input:disabled,
  select:disabled {
    background-color: @color-disabled-bg;
    border-color: transparent;
    color: var(--color-dark-3);
  }

  input,
  select {
    height: 1.5rem;
    background-color: @color-input-bg;
    border-color: @color-blue;
    color: @color-dark;
  }

  input[name="name"] {
    height: 2.5rem;
    font-family: @font-secondary;
    font-size: @font-size-xl;
    font-weight: bold;
    border: none;
    border-bottom: 2px solid @color-blue;
    background: transparent;
  }

  fieldset {
    margin-bottom: 4px;
    border-radius: 4px;
    border-color: @color-olive;
  }

  legend {
    font-family: @font-secondary;
    font-size: @font-size-lg;
    font-weight: bold;
    letter-spacing: 1px;
    color: @color-blue;
  }

  label {
    font-family: @font-secondary;
    font-size: @font-size-base;
    color: @color-dark;
  }
}

// Shared tab padding
.oathhammer .tab {
  padding: 4px;
}