/* Great America Bank — brand & shared component overrides on top of the finbank-demo template */

.gab-logo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.gab-logo__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 50%;
    background: #0a58ca;
    color: #ffffff;
}

.gab-logo__mark .gab-bank-mark {
    width: 24px;
    height: 24px;
}

/* Bank façade mark — used in the logo and the preloader */
.gab-bank-mark {
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
}

.gab-logo__text {
    display: flex;
    flex-direction: column;
    line-height: 1.05;
}

.gab-logo__text .gab-logo__main {
    font-family: "DM Sans", sans-serif;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: 0.2px;
    color: var(--thm-black);
}

.gab-logo__text .gab-logo__sub {
    font-family: "Manrope", sans-serif;
    font-weight: 600;
    font-size: 11px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #0a58ca;
    margin-top: 2px;
}

/* Light variant: for use on dark/navy backgrounds (sidebar, footer) */
.gab-logo--light .gab-logo__text .gab-logo__main {
    color: var(--thm-white);
}

.gab-logo--light .gab-logo__mark {
    background: transparent;
    border: 2px solid #0a58ca;
    color: #0a58ca;
}

.gab-logo--compact .gab-logo__mark {
    width: 36px;
    height: 36px;
    min-width: 36px;
}

.gab-logo--compact .gab-logo__mark .gab-bank-mark {
    width: 19px;
    height: 19px;
}

.gab-logo--compact .gab-logo__text .gab-logo__main {
    font-size: 15px;
}

.gab-logo--compact .gab-logo__text .gab-logo__sub {
    font-size: 9px;
    letter-spacing: 2px;
}

/* Flash messages (views/messages.ejs) */
.gab-alert {
    position: relative;
    padding: 14px 42px 14px 18px;
    border-radius: 6px;
    margin-bottom: 16px;
    font-family: "Manrope", sans-serif;
    font-size: 14px;
}

.gab-alert__close {
    position: absolute;
    top: 10px;
    right: 12px;
    background: transparent;
    border: 0;
    color: inherit;
    opacity: 0.6;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
}

.gab-alert__close:hover {
    opacity: 1;
}

/* Preloader — animated bank-façade draw-in (replaces the old letter loader) */
.gab-preloader-mark {
    width: 92px;
    height: 92px;
    color: var(--thm-primary, #ffb400);
}

.gab-preloader-mark path,
.gab-preloader-mark line {
    stroke-dasharray: 70;
    stroke-dashoffset: 70;
    animation: gabDrawIn 2.4s ease-in-out infinite;
}

.gab-preloader-mark line:nth-child(2) { animation-delay: .12s; }
.gab-preloader-mark line:nth-child(3) { animation-delay: .3s; }
.gab-preloader-mark line:nth-child(4) { animation-delay: .38s; }
.gab-preloader-mark line:nth-child(5) { animation-delay: .46s; }
.gab-preloader-mark line:nth-child(6) { animation-delay: .54s; }
.gab-preloader-mark line:nth-child(7) { animation-delay: .62s; }
.gab-preloader-mark line:nth-child(8) { animation-delay: .78s; }

@keyframes gabDrawIn {
    0% { stroke-dashoffset: 70; opacity: .25; }
    45% { stroke-dashoffset: 0; opacity: 1; }
    75% { stroke-dashoffset: 0; opacity: 1; }
    100% { stroke-dashoffset: -70; opacity: .25; }
}