/*
    FIDDET Custom Access Portals
    Shared authentication-page styles that are actually used by the current site.
    Portal-specific colors are injected by /login/includes/portal-meta.cfm.
*/

:root {
    --portal-primary: #244DA7;
    --portal-primary-hover: #1D3F8A;
    --portal-primary-rgb: 36,77,167;
    --portal-heading: #1D3B73;
    --portal-accent: #FFD701;
    --portal-page-background: #F8FAFD;
    --portal-panel-background: #FFFFFF;
    --portal-border: #E2E6EF;
}

body {
    background-color: var(--portal-page-background);
}

.color-fiddet-blue,
.color-portal-primary {
    color: var(--portal-primary) !important;
}

.color-fiddet-dark-blue,
.color-portal-heading {
    color: var(--portal-heading) !important;
}

.login-logo img,
.environment-logo img,
.portal-logo img {
    max-width: 240px;
    width: auto;
    height: auto;
}

.portal-powered-by {
    margin-top: 0.65rem;
    font-size: 0.72rem;
    line-height: 1.4;
    color: #6C7788;
    text-align: center;
}

.portal-powered-by strong {
    color: var(--portal-primary);
}

@media (max-width: 576px) {
    .custom-hide-small {
        display: none !important;
    }
}

@media (max-width: 767.98px) {
    .login-logo img,
    .environment-logo img,
    .portal-logo img {
        max-width: 210px;
    }
}


/* Internationalization Phase 2: public language selector. */
.public-language-control { position: fixed; top: 18px; right: 20px; z-index: 1100; font-family: 'DM Sans', sans-serif; }
.public-language-trigger { width: 48px; height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; border: 1px solid rgb(199,225,255); border-radius: 7px; background: rgb(233,243,255); color: #0F63C2; font-size: 12px; font-weight: 700; cursor: pointer; }
.public-language-trigger svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.public-language-trigger:hover,.public-language-trigger:active { border-color: rgb(27,132,255); background: rgb(27,132,255); color: #FFF; }
.public-language-trigger:focus { outline: 1px solid rgb(27,132,255); outline-offset: 1px; box-shadow: none; }
.public-language-menu { position: absolute; top: 50px; right: 0; width: 330px; overflow: hidden; border: 1px solid #D8E0EC; border-radius: 8px; background: #FFF; box-shadow: 0 10px 28px rgba(31,36,48,.12); text-align: left; }
.public-language-menu-head { padding: 16px 18px 14px; border-bottom: 1px solid #E7ECF3; }
.public-language-menu-head strong { display: block; color: #172033; font-size: 14px; }
.public-language-menu-head span { display: block; margin-top: 4px; color: #596780; font-size: 12px; line-height: 1.45; }
.public-language-form { margin: 0; }
.public-language-option { width: 100%; min-height: 62px; display: flex; align-items: center; gap: 11px; padding: 10px 14px; border: 0; border-bottom: 1px solid #EEF1F6; background: #FFF; color: #344054; text-align: left; cursor: pointer; }
.public-language-option:hover:not(:disabled) { background: #F6FAFF; }
.public-language-option:disabled { cursor: default; opacity: 1; }
.public-language-code { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: #1B84FF; color: #FFF; font-size: 13px; font-weight: 700; }
.public-language-copy { min-width: 0; flex: 1; }
.public-language-copy strong,.public-language-copy small { display: block; }
.public-language-copy strong { color: #344054; font-size: 13px; font-weight: 600; }
.public-language-copy small { margin-top: 2px; color: #667085; font-size: 11px; }
.public-language-current { padding: 3px 8px; border: 1px solid #9CC7F5; border-radius: 5px; color: #0B5CAD; font-size: 10px; font-weight: 700; }
.public-language-arrow { color: #667085; font-size: 16px; }
@media (max-width: 575.98px) { .public-language-control { top: 10px; right: 10px; } .public-language-menu { width: min(320px,calc(100vw - 20px)); } }