:root {
    --blue: #3183c8;
    --indigo: #6610f2;
    --purple: #926dde;
    --pink: #e83e8c;
    --red: #ff4954;
    --orange: #ffbe00;
    --yellow: #ffba00;
    --green: #3cd458;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #fff;
    --gray: #868e96;
    --gray-dark: #343a40;
    --primary: #3183c8;
    --secondary: #e9ecf0;
    --success: #3cd458;
    --info: #926dde;
    --warning: #ffba00;
    --danger: #ff4954;
    --light: #f8f9fa;
    --dark: #191919;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

    /* Updated to match v2.css brand colors */
    --brand-primary: #132435;        /* Sophisticated navy - premium main brand */
    --brand-dark: #0e1f2f;           /* Deeper navy for emphasis/backgrounds */
    --brand-secondary: #12617b;      /* Dark teal - professional accent */
    --brand-accent: #2994a4;         /* Light teal - energy and highlights */
    --brand-background: #f7f4f0;     /* Cream background from logo */
    --brand-hover: #0f4d5e;          /* Darker teal for hover states */
    --brand-tint-dark: #7cc4d1;      /* Tinted version of accent */
    --brand-tint: #c4e8ed;           /* Light teal tint for backgrounds */
    --brand-tint-light: #e8f5f7;     /* Very light teal for subtle backgrounds */
    --brand-shadow: rgba(19,36,53,0.12); /* Primary navy-based shadow */
    --brand-primary-light: #4a5b73;  /* Lighter navy for hover states */
    --brand-primary-light-alt: #566179;  /* Dark version of primary tint */
  
    /* Text and Status Colors */
    --text-light: #f9fafb;
    --gray-border: #dbe2e8;
    --gray-muted: #6c7a89;
    --error-red: #ef4444;                  /* Errors, urgent issues */
    --error-red-dark: #b91c1c;             /* Darker red for better contrast */
    --success-green: #22c55e;              /* Success states */
    --warning-orange: #f59e0b;             /* Warnings */
}

/* Premium error banner animation */
@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-100%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.auth-error-banner {
    animation: slideDown 0.3s ease-out;
}

/* latin-ext */
@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh7USSwaPGR_p.woff2) format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh7USSwiPGQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6uyw4BMUTPHjxAwXjeu.woff2) format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6uyw4BMUTPHjx4wXg.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh6UVSwaPGR_p.woff2) format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh6UVSwiPGQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  

html {
    font-family: sans-serif;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
    margin: 0;
    font-size: 1rem;
    text-align: left;
    background: var(--brand-tint-light);
    font-family: "Lato", Arial, sans-serif;
    line-height: 1.8;
    font-weight: normal;
    color: var(--brand-dark);
}


.wrap {
    width: 100%;
    overflow: hidden;
    background: var(--white);
    border-radius: 5px;
    -webkit-box-shadow: 0 8px 32px 0 rgba(14, 31, 47, 0.18);
    -moz-box-shadow: 0 8px 32px 0 rgba(14, 31, 47, 0.18);
    box-shadow: 0 8px 32px 0 rgba(14, 31, 47, 0.18);
}

.wrap .img {
    padding-top: 32px;
    padding-bottom: 32px;
    min-height: 200px;
    background-color: rgb(4, 22, 53);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
}

.img img {
    display: block;
    max-height: 56px;
    width: auto;
    margin: 0 auto;
    opacity: 0;
    transform: translateY(24px);
    animation: fadeInUp 2s cubic-bezier(0.23, 1, 0.32, 1) 0.3s forwards;
}
@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: none;
    }
}

h1,
h2,
h3,
h4,
h5,
.h1,
.h2,
.h3,
.h4,
.h5 {
    line-height: 1.2;
    font-weight: 600;
    margin-bottom: 0.5rem;
    font-family: "Lato", Arial, sans-serif;
    color: var(--brand-dark);
    letter-spacing: -0.01em;
}

.login-wrap {
    position: relative;
}

.login-wrap h3 {
    font-weight: 300;
}

h1,
.h1 {
    font-size: 2.5rem;
}

h2,
.h2 {
    font-size: 2rem;
}

h3,
.h3 {
    font-size: 1.75rem;
}

h4,
.h4 {
    font-size: 1.5rem;
}

h5,
.h5 {
    font-size: 1.25rem;
}

h6,
.h6 {
    font-size: 1rem;
}


.social-media {
    position: relative;
    width: 100%;
}

.social-media .social-icon {
    display: block;
    width: 40px;
    height: 40px;
    background: transparent;
    border: 1px solid rgba(0, 0, 0, 0.05);
    font-size: 16px;
    margin-right: 5px;
    border-radius: 50%;
}

.social-media .social-icon span {
    color: #999999;
}

.social-media .social-icon:hover,
.social-media .social-icon:focus {
    background: #1494ff;
}

.social-media .social-icon:hover span,
.social-media .social-icon:focus span {
    color: #fff;
}

.checkbox-wrap {
    display: block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.checkbox-wrap input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "\f0c8";
    font-family: "Font Awesome\ 5 Free";
    position: absolute;
    color: rgba(0, 0, 0, 0.1);
    font-size: 20px;
    margin-top: -4px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

@media (prefers-reduced-motion: reduce) {
    .checkmark:after {
        -webkit-transition: none;
        -o-transition: none;
        transition: none;
    }
}

/* Show the checkmark when checked */
.checkbox-wrap input:checked~.checkmark:after {
    display: block;
    content: "\f14a";
    font-family: "Font Awesome\ 5 Free";
    color: rgba(0, 0, 0, 0.2);
}

/* Style the checkmark/indicator */
.checkbox-primary {
    color: var(--brand-primary);
}

.checkbox-primary input:checked~.checkmark:after {
    color: var(--brand-primary);
}


.form-group {
    position: relative;
    z-index: 0;
    margin-bottom: 20px !important;
}

.form-group a {
    color: gray;
}

.form-control {
    height: 48px;
    background: var(--white);
    color: var(--brand-primary);
    font-size: 16px;
    border-radius: 8px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid var(--gray-border);
    transition: all 0.2s ease;
}

.form-control::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: var(--brand-primary-light-alt) !important;
}

.form-control::-moz-placeholder {
    /* Firefox 19+ */
    color: var(--brand-primary-light-alt) !important;
}

.form-control:-ms-input-placeholder {
    /* IE 10+ */
    color: var(--brand-primary-light-alt) !important;
}

.form-control:-moz-placeholder {
    /* Firefox 18- */
    color: var(--brand-primary-light-alt) !important;
}

.form-control:focus,
.form-control:active {
    outline: none !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid var(--brand-accent);
    background: var(--brand-tint-light);
}

.field-icon {
    position: absolute;
    top: 50%;
    right: 15px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: var(--brand-primary-light-alt);
}

.form-control-placeholder {
    position: absolute;
    top: 2px;
    padding: 7px 0 0 15px;
    -webkit-transition: all 400ms;
    -o-transition: all 400ms;
    transition: all 400ms;
    opacity: .6;
    color: var(--brand-primary-light-alt);
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.01em;
}

.form-control:focus+.form-control-placeholder,
.form-control:valid+.form-control-placeholder {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    padding: 7px 0 0 0;
    opacity: 1;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 1px;
    color: var(--brand-primary);
    font-weight: 700;
}


.btn {
    cursor: pointer;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    font-size: 15px;
    padding: 10px 20px;
}

.btn:hover,
.btn:active,
.btn:focus {
    outline: none;
}

.btn.btn-primary {
    background: var(--brand-primary);
    border: 1px solid var(--brand-primary);
    color: var(--white);
    font-weight: 600;
    border-radius: 8px;
    box-shadow: var(--brand-shadow);
    transition: background 0.2s, border 0.2s, box-shadow 0.2s;
    font-size: 1.1rem;
}

.btn.btn-primary:hover,
.btn.btn-primary:focus {
    background: var(--brand-hover);
    border: 1px solid var(--brand-hover);
    color: var(--white);
    box-shadow: 0 4px 12px var(--brand-shadow);
}

.btn.btn-primary.btn-outline-primary {
    border: 1px solid #01d28e;
    background: transparent;
    color: #01d28e;
}

.btn.btn-primary.btn-outline-primary:hover {
    border: 1px solid transparent;
    background: #01d28e;
    color: #fff;
}



.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-center {
    text-align: center !important;
}

@media (min-width: 576px) {
    .text-sm-left {
        text-align: left !important;
    }

    .text-sm-right {
        text-align: right !important;
    }

    .text-sm-center {
        text-align: center !important;
    }
}

@media (min-width: 768px) {
    .text-md-left {
        text-align: left !important;
    }

    .text-md-right {
        text-align: right !important;
    }

    .text-md-center {
        text-align: center !important;
    }
}

@media (min-width: 992px) {
    .text-lg-left {
        text-align: left !important;
    }

    .text-lg-right {
        text-align: right !important;
    }

    .text-lg-center {
        text-align: center !important;
    }
}

@media (min-width: 1200px) {
    .text-xl-left {
        text-align: left !important;
    }

    .text-xl-right {
        text-align: right !important;
    }

    .text-xl-center {
        text-align: center !important;
    }
}


a {
    text-decoration: none;
    background-color: transparent;
    color: var(--brand-accent);
}


a:not([href]):not([tabindex]) {
    color: inherit;
    text-decoration: none;
}

a:not([href]):not([tabindex]):hover,
a:not([href]):not([tabindex]):focus {
    color: inherit;
    text-decoration: none;
}

a:not([href]):not([tabindex]):focus {
    outline: 0;
}

a {
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
}

a:hover,
a:focus {
    text-decoration: none !important;
    outline: none !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: var(--brand-hover);
}

.trust-cue {
    font-size: 0.8rem;
    color: var(--gray-muted);
    margin-top: 0.5rem;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 0.4em;
    justify-content: center;
}