/*
 * The agency's sign-in screen (ورود-۰۲ … ۰۶، پس‌زمینه-۰۷ … ۱۳).
 *
 * Everything here is scoped to `body.fi-login-body`, which only the login page
 * carries — the panel behind the sign-in, and the panel's other simple pages,
 * are untouched by every rule in this file.
 *
 * Three things it does:
 *
 *   1. Lays a backdrop over the whole viewport: a photograph covering it in its
 *      own proportions, or a colour with one of six very slow motions on it.
 *   2. Shrinks the sign-in card by about a third and turns it into dark glass,
 *      so the backdrop reads through it and the form stays legible over the
 *      brightest photograph and the darkest colour alike.
 *   3. Leaves the panel's identity alone — the amber is still the amber, the
 *      type is still Vazirmatn, and the form behaves exactly as it did.
 */

/* ------------------------------------------------------------------ */
/* The backdrop                                                        */
/* ------------------------------------------------------------------ */

body.fi-login-body {
    background: #0b1120;
}

.fi-login-backdrop {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    /* The default the page falls back to when nothing is active, a file cannot
     * be reached, or the database will not answer (پس‌زمینه-۱۴). It is the
     * panel's own dark, and it is under every other backdrop as well — so a
     * photograph that fails to load leaves a considered dark screen rather than
     * a white one. */
    background-color: #0b1120;
}

/* ورود-۰۲: the whole viewport, the image's own proportions kept, cropped where
 * it must be, never stretched, and no gap around it.
 *
 * The photograph is a layer inside the backdrop rather than the backdrop itself,
 * because the backdrop is the viewport and clips, and the layer is what moves. */
.fi-login-backdrop-photo-layer {
    position: absolute;
    inset: 0;
    display: block;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    /* تصویر-حرکت-۰۵: the one number the whole set of camera moves is built on.
     * At rest the picture is 8% larger than the viewport, so there is 4% of it
     * hanging off each edge. Every keyframe below stays inside that margin —
     * scale never drops under 1.08 while translating, and no translation is
     * larger than 2% of the layer (2.2% of the viewport once the scale is
     * applied). So no pan, drift or zoom can bring an edge, a background colour
     * or a white gap into view at any instant. */
    transform: scale(1.08);
    transform-origin: center center;
    /* Only `transform` is ever animated, so the compositor can do the whole
     * thing on its own: no layout, no repaint, no work on the main thread the
     * form is typed into (کارایی-۰۱). */
    will-change: transform;
    backface-visibility: hidden;
}

.fi-login-backdrop-tinted {
    background-color: var(--login-backdrop-tone, #0b1120);
}

/*
 * حرکت-اصلاح-۰۱: the move waits for the picture, and for nothing else.
 *
 * A CSS animation starts the instant the element is parsed, which is well
 * before the photograph behind it has arrived. The first seconds of the move
 * were therefore spent on an empty layer, and the picture appeared partway
 * through — which is the «تأخیر» half of the complaint, and the only way the
 * backdrop could ever be seen to jump into place.
 *
 * The browser half sets this attribute the moment the layer is parsed and drops
 * it the moment the file is decoded (or has plainly failed, or has taken too
 * long), so the move begins on the frame the photograph becomes visible.
 * Nothing sets it without JavaScript, so a browser that runs none simply gets
 * the move from parse, as before — the hold can never be what stills the
 * backdrop.
 */
.fi-login-backdrop-photo-layer[data-photo-pending] {
    animation-play-state: paused;
}

/* The soft layers the motions move. They are transparent by default: a motion
 * class decides which of them it uses and what each one looks like. */
.fi-login-backdrop-layer {
    position: absolute;
    display: block;
    inset: -20%;
    pointer-events: none;
    opacity: 0;
}

/* A wash of white and of black, mixed from the chosen colour, so every motion
 * is a variation of that colour rather than a second colour laid over it. */
.fi-login-backdrop-tinted .fi-login-backdrop-layer-a {
    background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0) 60%);
}

.fi-login-backdrop-tinted .fi-login-backdrop-layer-b {
    background: radial-gradient(circle at 70% 65%, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0) 62%);
}

.fi-login-backdrop-tinted .fi-login-backdrop-layer-c {
    background: radial-gradient(circle at 50% 80%, rgba(0, 0, 0, 0.28), rgba(0, 0, 0, 0) 65%);
}

/* ------------------------------------------------------------------ */
/* The six motions (پس‌زمینه-۰۸)                                       */
/*                                                                     */
/* All six are slow enough to be felt rather than watched: the fastest  */
/* is a forty-second cycle and most are over a minute. Each animates    */
/* only `transform` and `opacity`, which the compositor can do without  */
/* laying the page out again — so nothing here slows the form down, and */
/* typing into it is unaffected (پس‌زمینه-۱۲).                          */
/* ------------------------------------------------------------------ */

/* ۱ | موج آرام — a very slow swell across the colour. */
.fi-login-motion-tide .fi-login-backdrop-layer-a {
    opacity: 1;
    animation: fi-login-tide 54s ease-in-out infinite;
}

.fi-login-motion-tide .fi-login-backdrop-layer-c {
    opacity: 0.7;
    animation: fi-login-tide 72s ease-in-out infinite reverse;
}

@keyframes fi-login-tide {
    0% {
        transform: translate3d(-6%, 2%, 0) scale(1.08);
    }

    50% {
        transform: translate3d(6%, -3%, 0) scale(1.14);
    }

    100% {
        transform: translate3d(-6%, 2%, 0) scale(1.08);
    }
}

/* ۲ | پرشدن و خالی‌شدن آرام — the colour enters from one side, fills, and
 * leaves by the other. */
.fi-login-motion-sweep .fi-login-backdrop-layer-a {
    opacity: 1;
    background: linear-gradient(105deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.24) 45%, rgba(255, 255, 255, 0) 100%);
    animation: fi-login-sweep 66s linear infinite;
}

@keyframes fi-login-sweep {
    0% {
        transform: translate3d(-70%, 0, 0);
    }

    100% {
        transform: translate3d(70%, 0, 0);
    }
}

/* ۳ | جریان آرام رنگ — a shade of the same colour drifting through. */
.fi-login-motion-flow .fi-login-backdrop-layer-b {
    opacity: 1;
    animation: fi-login-flow 78s ease-in-out infinite;
}

.fi-login-motion-flow .fi-login-backdrop-layer-c {
    opacity: 0.65;
    animation: fi-login-flow 96s ease-in-out infinite reverse;
}

@keyframes fi-login-flow {
    0% {
        transform: translate3d(-8%, -4%, 0) scale(1.1);
    }

    33% {
        transform: translate3d(5%, 6%, 0) scale(1.16);
    }

    66% {
        transform: translate3d(8%, -6%, 0) scale(1.12);
    }

    100% {
        transform: translate3d(-8%, -4%, 0) scale(1.1);
    }
}

/* ۴ | تنفس رنگ — the brightness of parts of the backdrop rising and falling on
 * a very slow rhythm. Opacity only, and between 0.35 and 0.75, so it is a
 * breath and never a blink (پس‌زمینه-۰۹). */
.fi-login-motion-breathe .fi-login-backdrop-layer-a {
    animation: fi-login-breathe 42s ease-in-out infinite;
}

.fi-login-motion-breathe .fi-login-backdrop-layer-c {
    animation: fi-login-breathe 58s ease-in-out infinite reverse;
}

@keyframes fi-login-breathe {
    0% {
        opacity: 0.35;
        transform: scale(1.04);
    }

    50% {
        opacity: 0.75;
        transform: scale(1.12);
    }

    100% {
        opacity: 0.35;
        transform: scale(1.04);
    }
}

/* ۵ | هاله شناور — one or two big soft haloes moving very slowly. */
.fi-login-motion-halo .fi-login-backdrop-layer-a {
    opacity: 0.9;
    animation: fi-login-halo-one 84s ease-in-out infinite;
}

.fi-login-motion-halo .fi-login-backdrop-layer-b {
    opacity: 0.8;
    animation: fi-login-halo-two 102s ease-in-out infinite;
}

@keyframes fi-login-halo-one {
    0% {
        transform: translate3d(-10%, -6%, 0) scale(1.05);
    }

    50% {
        transform: translate3d(8%, 8%, 0) scale(1.18);
    }

    100% {
        transform: translate3d(-10%, -6%, 0) scale(1.05);
    }
}

@keyframes fi-login-halo-two {
    0% {
        transform: translate3d(9%, 7%, 0) scale(1.12);
    }

    50% {
        transform: translate3d(-7%, -5%, 0) scale(1.02);
    }

    100% {
        transform: translate3d(9%, 7%, 0) scale(1.12);
    }
}

/* ۶ | حرکت لایه‌ای آرام — three very soft layers at different speeds, for a
 * gentle sense of depth. */
.fi-login-motion-layers .fi-login-backdrop-layer-a {
    opacity: 0.9;
    animation: fi-login-layer-slow 76s ease-in-out infinite;
}

.fi-login-motion-layers .fi-login-backdrop-layer-b {
    opacity: 0.75;
    animation: fi-login-layer-slow 108s ease-in-out infinite reverse;
}

.fi-login-motion-layers .fi-login-backdrop-layer-c {
    opacity: 0.6;
    animation: fi-login-layer-drift 132s linear infinite;
}

@keyframes fi-login-layer-slow {
    0% {
        transform: translate3d(-5%, 3%, 0) scale(1.06);
    }

    50% {
        transform: translate3d(5%, -3%, 0) scale(1.14);
    }

    100% {
        transform: translate3d(-5%, 3%, 0) scale(1.06);
    }
}

@keyframes fi-login-layer-drift {
    0% {
        transform: translate3d(-4%, 0, 0) scale(1.1);
    }

    50% {
        transform: translate3d(4%, 2%, 0) scale(1.1);
    }

    100% {
        transform: translate3d(-4%, 0, 0) scale(1.1);
    }
}

/* ------------------------------------------------------------------ */
/* The six camera moves for a photograph (تصویر-حرکت-۰۱ … ۰۵)          */
/*                                                                     */
/* A photograph used to be shown still. It now gets one of these, drawn */
/* fresh on every load, so the same picture is very likely two          */
/* different moves on two visits (تصویر-حرکت-۰۳).                       */
/*                                                                     */
/* Each runs a single `transform`, returns to exactly where it started, */
/* and never leaves the margin the layer's resting `scale(1.08)` buys — */
/* the maximum travel below is 2% of the layer against a 3% overhang at */
/* the tightest zoom, so the picture covers the viewport at every       */
/* instant (تصویر-حرکت-۰۵).                                             */
/*                                                                     */
/* ## Two things they were doing wrong (حرکت-اصلاح-۰۱ … ۰۳)            */
/*                                                                     */
/* They were built as a there-and-back with one `ease-in-out` laid over */
/* the whole cycle, over seventy to a hundred and ten seconds. That has */
/* two consequences nobody wants, and between them they are the three   */
/* complaints this correction exists for:                               */
/*                                                                     */
/*   * `ease-in-out` leaves the picture at a standstill at 0%. So the   */
/*     move opened on several seconds of nothing, and a person signing  */
/*     in was gone before it became visible — «حرکت با تأخیر زیادی      */
/*     شروع می‌شود».                                                     */
/*   * The same easing brings it back to a standstill at the halfway    */
/*     turn, forty-odd seconds in, which is read as the motion having   */
/*     stopped for good — «پس از مدت کوتاهی متوقف می‌شود».               */
/*                                                                     */
/* So each move now begins in the middle of its travel, at the point of */
/* its greatest speed, and the easing is per-segment rather than over   */
/* the whole cycle:                                                     */
/*                                                                     */
/*      0% ─ 25%   from mid-travel out to one end        `ease-out`     */
/*     25% ─ 75%   the full sweep across to the other    `ease-in-out`  */
/*     75% ─ 100%  back to mid-travel, gathering speed   `ease-in`      */
/*                                                                     */
/* `ease-in` and `ease-out` are each other's mirror, so the speed at    */
/* 100% is exactly the speed at 0% and the loop point cannot be seen —  */
/* the picture passes through it rather than landing on it (الزام ۵).   */
/* The two turns keep their easing, which is what stops the reversal    */
/* being a jolt (الزام ۴).                                              */
/*                                                                     */
/* Every duration is a quarter of what it was: the fastest cycle is     */
/* under twenty seconds and the slowest under thirty, where they were   */
/* seventy-eight and a hundred and ten (الزام ۳). The travel itself is  */
/* unchanged, so the move is the same move, four times as alive.        */
/* ------------------------------------------------------------------ */

/* ۱ | حرکت افقی آرام — the frame walks across the picture and back. */
.fi-login-photo-motion-pan-x .fi-login-backdrop-photo-layer {
    animation: fi-login-photo-pan-x 19.5s linear infinite;
}

@keyframes fi-login-photo-pan-x {
    0% {
        transform: scale(1.1) translate3d(0%, 0%, 0);
        animation-timing-function: ease-out;
    }

    25% {
        transform: scale(1.1) translate3d(2%, 0%, 0);
        animation-timing-function: ease-in-out;
    }

    75% {
        transform: scale(1.1) translate3d(-2%, 0%, 0);
        animation-timing-function: ease-in;
    }

    100% {
        transform: scale(1.1) translate3d(0%, 0%, 0);
    }
}

/* ۲ | حرکت عمودی آرام — the same, up and down. */
.fi-login-photo-motion-pan-y .fi-login-backdrop-photo-layer {
    animation: fi-login-photo-pan-y 21.5s linear infinite;
}

@keyframes fi-login-photo-pan-y {
    0% {
        transform: scale(1.1) translate3d(0%, 0%, 0);
        animation-timing-function: ease-out;
    }

    25% {
        transform: scale(1.1) translate3d(0%, 2%, 0);
        animation-timing-function: ease-in-out;
    }

    75% {
        transform: scale(1.1) translate3d(0%, -2%, 0);
        animation-timing-function: ease-in;
    }

    100% {
        transform: scale(1.1) translate3d(0%, 0%, 0);
    }
}

/* ۳ | بزرگ‌نمایی آرام — the picture grows very slightly and settles back. It
 * opens halfway through the push, already growing. */
.fi-login-photo-motion-zoom-in .fi-login-backdrop-photo-layer {
    animation: fi-login-photo-zoom-in 23s linear infinite;
}

@keyframes fi-login-photo-zoom-in {
    0% {
        transform: scale(1.11);
        animation-timing-function: ease-out;
    }

    25% {
        transform: scale(1.16);
        animation-timing-function: ease-in-out;
    }

    75% {
        transform: scale(1.06);
        animation-timing-function: ease-in;
    }

    100% {
        transform: scale(1.11);
    }
}

/* ۴ | کوچک‌نمایی آرام — the same move begun from the other end, so a load that
 * draws it opens already easing out rather than already pushing in. */
.fi-login-photo-motion-zoom-out .fi-login-backdrop-photo-layer {
    animation: fi-login-photo-zoom-out 23s linear infinite;
}

@keyframes fi-login-photo-zoom-out {
    0% {
        transform: scale(1.11);
        animation-timing-function: ease-out;
    }

    25% {
        transform: scale(1.06);
        animation-timing-function: ease-in-out;
    }

    75% {
        transform: scale(1.16);
        animation-timing-function: ease-in;
    }

    100% {
        transform: scale(1.11);
    }
}

/* ۵ | حرکت مورب آرام — across and down together, which reads differently from
 * either of them alone. */
.fi-login-photo-motion-drift .fi-login-backdrop-photo-layer {
    animation: fi-login-photo-drift 26s linear infinite;
}

@keyframes fi-login-photo-drift {
    0% {
        transform: scale(1.1) translate3d(0%, 0%, 0);
        animation-timing-function: ease-out;
    }

    25% {
        transform: scale(1.1) translate3d(1.8%, 1.4%, 0);
        animation-timing-function: ease-in-out;
    }

    75% {
        transform: scale(1.1) translate3d(-1.8%, -1.4%, 0);
        animation-timing-function: ease-in;
    }

    100% {
        transform: scale(1.1) translate3d(0%, 0%, 0);
    }
}

/* ۶ | حرکت سینمایی ترکیبی — a slow push in with a drift across it, which is the
 * one that reads as a camera rather than as an effect. */
.fi-login-photo-motion-cinematic .fi-login-backdrop-photo-layer {
    animation: fi-login-photo-cinematic 27.5s linear infinite;
}

@keyframes fi-login-photo-cinematic {
    0% {
        transform: scale(1.11) translate3d(0%, 0%, 0);
        animation-timing-function: ease-out;
    }

    25% {
        transform: scale(1.16) translate3d(-1.4%, 0.9%, 0);
        animation-timing-function: ease-in-out;
    }

    75% {
        transform: scale(1.06) translate3d(1.4%, -0.9%, 0);
        animation-timing-function: ease-in;
    }

    100% {
        transform: scale(1.11) translate3d(0%, 0%, 0);
    }
}

/*
 * پس‌زمینه-۱۳ و حرکت-مشترک-۰۲: a device asking for less motion gets none, of
 * either kind. The chosen colour is still the chosen colour and the chosen
 * photograph is still the chosen photograph — both are simply shown still,
 * which is what the task asks for rather than a different backdrop.
 */
@media (prefers-reduced-motion: reduce) {
    .fi-login-backdrop-layer {
        animation: none !important;
        transform: none !important;
        opacity: 0.35;
    }

    /* Held at the resting scale rather than at 1: the photograph still covers
     * the viewport, it simply stops moving across it. */
    .fi-login-backdrop-photo-layer {
        animation: none !important;
        transform: scale(1.08) !important;
    }
}

/* ------------------------------------------------------------------ */
/* The sign-in card                                                    */
/* ------------------------------------------------------------------ */

body.fi-login-body .fi-simple-layout {
    position: relative;
    z-index: 1;
    background: transparent;
}

body.fi-login-body .fi-simple-main-ctn {
    background: transparent;
}

/*
 * ورود-۰۳: about a third smaller than it was, and still centred. Filament's
 * simple page is `fi-width-lg`; this brings the card in from that to a width a
 * short form does not have to be stretched across, and every measurement inside
 * it comes down with it.
 */
body.fi-login-body .fi-simple-main {
    max-width: 21rem;
    width: 100%;
    /* ورود-اصلاح-۰۱: shorter again now that «ورود به حساب کاربری» is gone. The
     * top padding comes down with the heading rather than staying behind as
     * blank glass, which is the whole point of removing it. */
    padding: 0.95rem 1.1rem 1.15rem;
    border-radius: 1rem;
    /* ورود-۰۴: dark, glassy, half see-through, with a fine border and a shadow
     * that lifts it off whatever is behind it. */
    background: rgba(15, 23, 42, 0.55);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    backdrop-filter: blur(18px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow: 0 24px 60px -20px rgba(0, 0, 0, 0.65), 0 2px 10px rgba(0, 0, 0, 0.3);
}

/* The gap between the brand and the form. It used to have a heading between
 * them; with that gone the two are close enough that the old spacing read as a
 * hole (ورود-اصلاح-۰۱). */
body.fi-login-body .fi-simple-page-content {
    gap: 0.7rem;
}

/* The brand line above the form, scaled with the card. */
body.fi-login-body .fi-simple-header {
    gap: 0.3rem;
}

body.fi-login-body .fi-simple-header-heading {
    font-size: 1.05rem;
    line-height: 1.6;
    color: #f8fafc;
}

body.fi-login-body .fi-simple-header-subheading {
    font-size: 0.8rem;
    line-height: 1.7;
    color: rgba(226, 232, 240, 0.85);
}

body.fi-login-body .fi-logo {
    font-size: 1.1rem;
    color: #f8fafc;
}

/* The form itself: tighter gaps, smaller labels, smaller inputs — and every one
 * of them still large enough to read and to hit with a thumb (ورود-۰۳، last
 * line). */
body.fi-login-body .fi-form {
    gap: 0.6rem;
}

/* The space between a label and its input, which is most of what a short form's
 * height is made of. */
body.fi-login-body .fi-fo-field-wrp,
body.fi-login-body .fi-fo-field-wrp-label-col,
body.fi-login-body .fi-fo-field-wrp-content-col {
    gap: 0.25rem;
}

body.fi-login-body .fi-fo-field-wrp-label,
body.fi-login-body .fi-fo-field-wrp-label > *,
body.fi-login-body label {
    font-size: 0.8rem;
    color: #e2e8f0;
}

body.fi-login-body .fi-fo-field-wrp-hint,
body.fi-login-body .fi-fo-field-wrp-hint * {
    font-size: 0.75rem;
    color: rgba(226, 232, 240, 0.8);
}

body.fi-login-body .fi-input-wrp {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.22);
    box-shadow: none;
}

body.fi-login-body .fi-input-wrp:focus-within {
    border-color: rgba(245, 158, 11, 0.85);
    box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.35);
}

body.fi-login-body .fi-input,
body.fi-login-body input {
    font-size: 0.85rem;
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
    color: #f8fafc;
}

body.fi-login-body input::placeholder {
    color: rgba(226, 232, 240, 0.55);
}

/* The eye that shows and hides the password — kept, and kept legible on glass
 * (ورود-۰۵). */
body.fi-login-body .fi-input-wrp-suffix .fi-icon-btn,
body.fi-login-body .fi-input-wrp-prefix .fi-icon-btn {
    color: rgba(226, 232, 240, 0.85);
}

body.fi-login-body .fi-input-wrp-suffix .fi-icon-btn:hover {
    color: #f8fafc;
}

/* «مرا به خاطر بسپار» */
body.fi-login-body .fi-fo-checkbox,
body.fi-login-body .fi-checkbox-input {
    width: 0.95rem;
    height: 0.95rem;
}

body.fi-login-body .fi-fo-field-wrp-hint-actions a,
body.fi-login-body a {
    color: #fcd34d;
}

/* The sign-in button: smaller, and the panel's own amber (ورود-۰۵). */
body.fi-login-body .fi-btn {
    font-size: 0.85rem;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

/* Validation and the failed-sign-in message read on glass without changing a
 * word of what they say. */
body.fi-login-body .fi-fo-field-wrp-error-message {
    color: #fca5a5;
    font-size: 0.75rem;
}

body.fi-login-body .fi-sc-text,
body.fi-login-body .fi-sc-text * {
    color: #e2e8f0;
}

/* نشست-۱۱: why the operator is back at this screen. */
.fi-login-notice {
    margin-bottom: 0.85rem;
    padding: 0.6rem 0.75rem;
    border-radius: 0.6rem;
    border: 1px solid rgba(251, 191, 36, 0.45);
    background: rgba(251, 191, 36, 0.14);
    color: #fde68a;
    font-size: 0.8rem;
    line-height: 1.8;
    text-align: center;
}

/* ------------------------------------------------------------------ */
/* «مدیریت پس‌زمینه صفحه ورود» — the swatch and the thumbnail           */
/*                                                                     */
/* پس‌زمینه-۰۵: every colour row carries a sample, so the list can be   */
/* read without opening anything.                                      */
/* ------------------------------------------------------------------ */

.fi-login-bg-swatch {
    display: inline-block;
    width: 2.75rem;
    height: 1.5rem;
    border-radius: 0.375rem;
    border: 1px solid rgba(148, 163, 184, 0.55);
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.15);
    vertical-align: middle;
}

.fi-login-bg-swatch-lg {
    width: 6rem;
    height: 2.25rem;
}

.fi-login-bg-preview {
    border-radius: 0.375rem;
    object-fit: cover;
    border: 1px solid rgba(148, 163, 184, 0.45);
}

/* ------------------------------------------------------------------ */
/* ورود-۰۶: tablet and phone                                           */
/*                                                                     */
/* The backdrop is fixed to the viewport and the motions only ever      */
/* translate inside an element that hides its own overflow, so nothing  */
/* here can push the page sideways.                                     */
/* ------------------------------------------------------------------ */

body.fi-login-body {
    overflow-x: hidden;
}

@media (max-width: 640px) {
    body.fi-login-body .fi-simple-main {
        max-width: 100%;
        margin: 0 0.9rem;
        padding: 1rem 1.1rem 1.25rem;
    }

    body.fi-login-body .fi-simple-header-heading {
        font-size: 1rem;
    }
}