/* 
    #3179b9
    rgba(49, 121, 185, 1)

    10% darker:
    Hex: #2C6CA6
    RGB: rgb(44, 108, 166)
    RGBA: rgba(44, 108, 166, 1)

    Colors:
        primary blue: #0066CC, rgba(0, 102, 204, 1)
        Darker primary blue: #0059B3, rgba(0, 89, 179, 1)
*/
:root {
    /* safe area insets for iOS devices with notches */
    --safe-area-inset-top: env(safe-area-inset-top);
    --safe-area-inset-left: env(safe-area-inset-left);
    --safe-area-inset-right: env(safe-area-inset-right);  
    --safe-area-inset-bottom: env(safe-area-inset-bottom);
    /* adjust the primary color to match the design */
    --bs-primary: #3179b9;
    --bs-primary-rgb: 49, 121, 185;
}

body {
    /* Prevent iOS tap highlight and callout */
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-overflow-scrolling: auto;
}

/* Override Bootstrap's primary button colors */
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #3179b9;
  --bs-btn-border-color: #3179b9;

  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #0059B3;
  --bs-btn-hover-border-color: #0059B3;

  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #004a9c;
  --bs-btn-active-border-color: #004a9c;

  --bs-btn-focus-shadow-rgb: 0, 102, 204;
}

/* Make links slightly darker on hover */
.link-primary:hover,
.link-primary:focus {
  color: #0059B3 !important;
}

.app-modal {margin-top: max(15px, var(--safe-area-inset-top))}
.app-fixed-center {
    align-items: center;
    display: flex;    
    height: 100vh;
    width: 100%;
    justify-content: center;
    top: 0;
    left: 0;
    position: fixed;
    z-index: 9999;
}
.app-container{opacity: .5;}

.app-fixed-center {
    align-items: center;
    display: flex;    
    height: 100vh;
    width: 100%;
    justify-content: center;
    top: 0;
    left: 0;
    position: fixed;
    z-index: 9999;
}

.nav-link {font-weight: 500;}