
/* Font Imports */

@font-face {
    font-family: AGC;
    src: url('https://d2xfs11ae9fgkb.cloudfront.net/static/interface-css/fonts/AkzidenzGrotesk-Cond.ttf')
}

@font-face {
    font-family: AGBC;
    src: url('https://d2xfs11ae9fgkb.cloudfront.net/static/interface-css/fonts/AkzidenzGrotesk-BoldCond.ttf')
}

@font-face {
    font-family: AGXBC;
    src: url('https://d2xfs11ae9fgkb.cloudfront.net/static/interface-css/fonts/AkzidenzGrotesk-ExtraBoldCond.ttf')
}

/* Background image */

body { 
    background: url(https://643charts.com/wp-content/uploads/2017/03/643-field-header-web.png) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    overflow-x: hidden;
}

.login-container {
    max-width: 25vw;
    margin: 25vh auto;
    background: #f5f5f580;
    padding: 2rem;
    border-radius: 1rem;
}

.login-container label,
button:not(.mantine-Button-root) {
    font-family: AGBC;
}

.login-container input {
    font-family: AGC;
}

.login-button {
    background: #ABD375;
    color: #424242;
    border: .5mm solid grey;
    box-shadow: 0 0 4px black;
    text-transform: uppercase;
    width: 200px;
}

/* General settings */

hr {
    margin: 2rem 0rem 2rem 0rem;
}

input:invalid {
    outline: none !important;
}

.hidden,
.offscreenCanvas {
    display: none !important;
}

rect.selection {
    shape-rendering: optimizeSpeed;
}

.dash-dot-spinner div {
    width: 11px !important;
    height: 11px !important;
    margin: 0px 3px !important;
    border: 1px solid #424242;
}

.svg-axes-overlay {
    position: absolute;
}

/* Document creation layouts */

.mantine-HoverCard-dropdown {
    box-shadow: 0 0 10px black;
}

.option-headers {
    font-family: AGBC;
    border-radius: .5rem;
    text-transform: uppercase;
    color: white;
    background-color: #09562c;
    padding: .25rem .7rem;
    margin-bottom: 0;
    margin-right: -.75rem;
    box-shadow: 0 0 5px black;
}

/* Tab styling */

.park-factor-component {
    aspect-ratio: 1;
    width: -webkit-fill-available;
}

/* Pitch tracking */

.modal-log {
    max-width: 90%;
}

.modal-log .mantine-Col-root {
    min-height: 70vh;
}

.bullpen-input-area {
    background-color: whitesmoke;
    padding: 2rem 2rem 0rem 2rem;
    border-radius: 2rem;
    border: 1px solid grey;
}

.pt-user-inputs {
    background-color: whitesmoke;
    padding: 1.5rem .5rem;
    border-radius: 1rem;
    border: 1px solid grey;
    box-shadow: 0 0 5px black;
}

.form-check-label {
    font-family: AGC;
    text-transform: uppercase;
}

.highlight-row {
    box-shadow: 0px 0px 10px 3px #abd375;
}

/* Spray chart containers */

iframe {
    outline: none;
    border: none;
}

.all-spray-container {
    padding-top: 1rem;
}

.pvp-spray-container {
    width: 25vw;
    margin: auto;
    padding: 1rem 0rem;
}

.custom-spray-container {
    width: 100%;
    height: 100%;
    padding-top: 2rem;
}

/* All sprays tab buttons */

.spray-label {
    font-family: AGBC;
    font-size: .85rem;
    background-color: #424242;
    color: whitesmoke;
    padding: .3rem 1rem;
    border-radius: .3rem;
    line-height: 21px;
    text-transform: uppercase;
    pointer-events: none;
    user-select: none;
}

.spray-label:empty {
    visibility: hidden;
}

.ncaa-logo {
    min-height: 45px;
    max-height: 45px;
    box-shadow: 0 0 10px black;
    border-radius: 0.5rem;
    padding: 0.25rem;
    background-color: white;
}

/* Modal styling */

.modal-title,
.mantine-Modal-title {
    font-family: AGBC;
    font-size: .85rem;
    color: #424242;
    text-transform: uppercase;
}

.modal-header,
.mantine-Modal-header {
    background: #ABD375;
    padding: 0rem 1rem;
    min-height: 3rem;
}

.modal-body,
.mantine-Modal-body {
    padding: 2rem;
}

.modal-button-row {
    padding-top: 20px;
}

.modal-editor-footer {
    padding: 3% 30% 3% 30%;
    justify-content: space-around;
}

.modal-footer {
    margin: 0;
}

.modal-footer>* {
    margin: auto;
}
