@font-face {
  font-family: proximaNovaCondensedRegular;
  src: url(./assets/fonts/147);
}

@font-face {
  font-family: proximaNovaSemibold;
  src: url(./assets/fonts/173);
}

/*
:root {
    --css vars go here
}
*/

body {
    
    color:white;
}

a {
    color:var(--flpro-gold);
    text-decoration:none;
}

.info-panel {
    background: #9c9c9c;
    background: linear-gradient(90deg, rgba(156, 156, 156, 1) 0%, rgba(199, 199, 199, 1) 50%, rgba(232, 232, 232, 1) 100%);
}

#locker h1 {
    color:#333;
}

.loading-element {
    display:none;
}
.pro-text-link {
    cursor:pointer;
    color:goldenrod;
    text-decoration:none;
    font-size:large;
}


.legalese {
    font-family: proximaNovaCondensedRegular, sans-serif;
    font-size: 0.8em;
    color:lightgray;
    margin-top:20px;
}

#bgVideo {
  object-fit: cover;
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}

textarea {
    height:300px;
}

.met {
    color:lightgreen !important;
}

#password-conditions > ul {
    list-style-type: none;
    padding-left: 0;
}
#homeLogo {
    max-width:80%;
    margin-top:30px;
    margin-left:auto;
    margin-right:auto;
    position:relative;
    display: block;
}

.btn {
    min-width:40%;
    width:40%
}

.app-panel {
    display:none;
    overflow:auto;
}

.videoPlayer {
    display:none;
}

.branding .brand-logo {
    height:30px;
}

#dashboard {
    background-color:white;
    color:grey;
    
    padding-top:50px;
}

#dashTopNav {
    background-color:var(--flpro-purple);
    color:white;
}
#dashBottomNav {
    height:80px;
    align-items:center;
    text-align:center;

    & > div > i {
        line-height:normal;
    }
    & > div > span {
        font-size:11px;
    }
}

.dash-nav {
    background-color:var(--flpro-purple);
    color:lightgray;
}

#dashBottomNav .selected-nav-item {
    color:var(--flpro-gold);
}

#dashBottomNav .menu-item:hover:not(.selected-nav-item) {
    color:white;
    cursor:pointer; 
    transition: color 0.3s ease;
}
.dash {
    display:none;
    padding:20px;
}
.square-box {
      width: 100%; /* Ensures the box takes the full width of its column */
      padding-bottom: 100%; /* Creates the square aspect ratio */
      position: relative; /* Essential for positioning content inside */
      background-color: #f0f0f0; /* Example background */
      margin-bottom: 15px; /* Add some spacing between squares */
    }

.square-content {
      position: absolute; /* Allows content to be positioned within the square-box */
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      display: flex; /* For centering content */
      align-items: center;
      justify-content: center;
      text-align: center;
}

.unselectable-text {
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none;    /* Firefox */
  -ms-user-select: none;     /* IE 10+ */
  user-select: none;          /* Standard */
}

.skintone-fair {
    color: #f7e9df;
}
.skintone-light {
    color: #f1d3bd;
}

.skintone-latte {
    color: #cca799;
}

.skintone-medium {
    color: #b6784f;
}

.skintone-mocha {
    color: #906b56;
}

.skintone-dark {
    color: #271F1b;
}

#fleshToneMenu .fleshtone-option:hover {
    cursor:pointer;
}
#fleshToneMenu .fleshtone-option p {
    font-size:10px;
}
.icon-signature-upload {
    color:grey
}
.icon-signature-upload:hover {
    cursor:pointer;
}

.icon-btn {
    user-select: none;
    /* For cross-browser compatibility, include vendor prefixes */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none;    /* Firefox */
    -ms-user-select: none;     /* IE 10+ and Edge */
}
#cameraSignatureCapture {
    display:none;
    width:100%;
    max-width:500px;
    height:auto;
    border:4px solid var(--flpro-purple);
    border-radius:10px;
}
#btnAddFirstProduct {
    display:none;
}
#dash_products .square-box:hover {
    outline: 4px solid var(--flpro-gold);
    cursor:pointer;
}
.anatomy-option:hover {
    cursor:pointer;
    color:var(--flpro-purple)
}
.anatomy-option.selected i {
    color:var(--flpro-gold);
}
#videoAnatomyScan {
    display:none;
}
#canvasSignatureCapture {
    width:100%;
    max-width:500px;
    height:auto;
    border-radius: 10px;
    border:4px solid var(--flpro-gold);
}
#signatureCaptureArea {
    display:none;
}
#signatureCaptureReviewArea {
    display:none;
    margin-bottom:20px;
    text-align:center;
}
.signature-pad {
    position:relative;
    display:inline-block;
    border:1px solid var(--flpro-purple); 
    background:var(--flpro-purple-translucent); 
    width:100%; 
    height:200px;
    text-align: center;
    padding-top:10px;
}

.signature-pad canvas {
   
    background:lightyellow; 
}

.signature-pad-button {
    margin-left:10px;
    color:grey;

}
.signature-pad-button:hover {
    cursor:pointer;
    color:var(--flpro-gold);
}
.signature-pad-toolbar {
    position:absolute;
    display:block;
    bottom:5px;
    right:5px;
}
#dash_earnings .legalese {
    color:grey;
}

#dash_earnings h1 {
    font-size:calc(2rem + .9vw);
    font-family: proximaNovaSemibold, sans-serif;
    color:var(--flpro-purple)
}

#tableEarningsOverview td[dataType="currency"] {
    text-align:right;
}

td[dataType="currency"] {
    text-align:right;
}

#overview-tab-pane .alert {
    background-color:var(--flpro-purple-transparent) !important;
}

#signatureCaptureReviewArea,
#signatureCaptureArea {
    position:relative;
    display: none;
    width:100%;
    height:auto;
    justify-content: center;
    align-items: center;
    
}
#signatureCaptureReviewCopy,
.camera-aperature-overlay {
    position: absolute;
    
    text-align: center;;
    color: rgba(255,255,255,.5);
}
#signatureCaptureReviewCopy
{
    
    width:100%;
}
@media screen and (max-width: 768px) {
    body {
        padding-top:0px;
    }
    .navbar {
        display:none;
    }
    .btn {
        min-width:80%;
    }
    
}