/* ==========================================================================
   Blue Ray Theme v3 - staff login, forgot / reset password, two-factor
   --------------------------------------------------------------------------
   Scoped under html.brt-auth, set in <head> before first paint. login.js
   tags Perfex's own markup and adds:

     .brt-auth-bg    full-screen picture: rendered artwork or uploaded image
     .brt-auth-fx    canvas with the ambient motion (embers, rain, stars...)
     .brt-auth-wrap  Perfex's wrapper (logo, title, card)
     .brt-auth-card  the form card, with icons and a show-password toggle
     .brt-auth-hero  headline, tagline and a live clock (split layout)

   Layers: picture 0, motion 1, content 2.
   ========================================================================== */

html.brt-auth {
    --mfp-glass: rgba(var(--mfp-card-bg-rgb), var(--mfp-login-card));
    --mfp-edge-line: rgba(255, 255, 255, .55);
    --mfp-field: rgba(var(--mfp-card-bg-rgb), .9);
    --mfp-field-line: rgba(var(--mfp-text-rgb), .14);
}
html.brt-auth.brt-dark {
    --mfp-edge-line: rgba(255, 255, 255, .09);
    --mfp-field: rgba(255, 255, 255, .045);
    --mfp-field-line: rgba(255, 255, 255, .11);
}

html.brt-auth,
html.brt-auth body {
    min-height: 100%;
    background: var(--mfp-body-bg) !important;
}

html.brt-auth body {
    font-family: var(--mfp-font) !important;
    color: var(--mfp-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    overflow-x: hidden;
    letter-spacing: -.003em;
}

/* ---------- picture ---------- */
html.brt-auth .brt-auth-bg,
html.brt-auth .brt-auth-fx {
    position: fixed;
    inset: 0;
    pointer-events: none;
}

html.brt-auth .brt-auth-bg { z-index: 0; overflow: hidden; background: var(--mfp-body-bg); }

html.brt-auth .brt-auth-bg::before {
    content: '';
    position: absolute;
    inset: calc(var(--mfp-login-blur) * -2);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: var(--mfp-login-pos);
    filter: blur(var(--mfp-login-blur));
    transform-origin: 60% 50%;
}

html.brt-auth.brt-bg-theme .brt-auth-bg::before { background-image: var(--mfp-art-img); background-position: var(--mfp-art-pos); opacity: var(--mfp-login-opacity); }
html.brt-auth.brt-bg-image .brt-auth-bg::before { background-image: var(--mfp-login-img); opacity: var(--mfp-login-opacity); }

@media (max-width: 767px) {
    html.brt-auth.brt-bg-theme .brt-auth-bg::before { background-image: var(--mfp-art-img-m); background-position: center; }
    html.brt-auth.brt-bg-image .brt-auth-bg::before { background-image: var(--mfp-login-img-m); }
}

/* Very slow drift, like a camera breathing - only when motion is on */
html.brt-auth.brt-motion .brt-auth-bg::before { animation: brt-drift 38s ease-in-out infinite alternate; }
@keyframes brt-drift { from { transform: scale(1.06) translate3d(-.6%, -.4%, 0); } to { transform: scale(1.0) translate3d(.6%, .4%, 0); } }

/* Tint: keeps the form readable over any picture */
html.brt-auth .brt-auth-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    opacity: var(--mfp-login-overlay);
    background:
        radial-gradient(1100px 760px at 50% 40%, transparent, rgba(var(--mfp-body-bg-rgb), .65) 100%),
        linear-gradient(180deg, rgba(var(--mfp-body-bg-rgb), .35), rgba(var(--mfp-body-bg-rgb), .75));
}
/* Rendered artwork: tint by how bright the picture is, not by the theme */
html.brt-auth.brt-bg-theme.brt-scene-dark .brt-auth-bg::after {
    background: linear-gradient(90deg, rgba(0, 0, 0, .55), rgba(0, 0, 0, .12) 55%, rgba(0, 0, 0, .05)), linear-gradient(180deg, rgba(0, 0, 0, .05) 60%, rgba(0, 0, 0, .45));
}
html.brt-auth.brt-bg-theme.brt-scene-light .brt-auth-bg::after {
    background: linear-gradient(90deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, .10) 55%, rgba(255, 255, 255, 0)), linear-gradient(180deg, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, .30));
}
html.brt-auth.brt-layout-center.brt-bg-theme.brt-scene-dark .brt-auth-bg::after { background: radial-gradient(900px 700px at 50% 45%, rgba(0, 0, 0, .35), rgba(0, 0, 0, .10) 70%), linear-gradient(180deg, transparent 60%, rgba(0, 0, 0, .4)); }
html.brt-auth.brt-layout-center.brt-bg-theme.brt-scene-light .brt-auth-bg::after { background: radial-gradient(900px 700px at 50% 45%, rgba(255, 255, 255, .45), rgba(255, 255, 255, .05) 70%); }
/* the form sits on the right in Arabic: shade that side instead */
html.brt-auth body.rtl .brt-auth-bg::after { transform: scaleX(-1); }
html.brt-auth.brt-art-off .brt-auth-bg::after { display: none; }
html.brt-auth.brt-bg-plain .brt-auth-bg::before { display: none; }
html.brt-auth.brt-bg-plain .brt-auth-bg {
    background:
        radial-gradient(900px 600px at 15% 0%, rgba(var(--mfp-primary-rgb), .16), transparent 70%),
        radial-gradient(800px 600px at 100% 100%, rgba(var(--mfp-accent-rgb), .10), transparent 70%),
        var(--mfp-body-bg);
}

html.brt-auth .brt-auth-fx { z-index: 1; width: 100%; height: 100%; }

/* ---------- content ---------- */
html.brt-auth .brt-auth-wrap,
html.brt-auth .brt-auth-hero { position: relative; z-index: 2; }

html.brt-auth.brt-layout-center .brt-auth-wrap {
    max-width: 420px !important;
    width: calc(100% - 32px);
    margin: 0 auto !important;
    padding: min(13vh, 120px) 0 48px !important;
}

html.brt-auth .brt-auth-logo { text-align: center; margin-bottom: 26px; }
html.brt-auth .brt-auth-logo img { max-height: 48px; width: auto; display: inline-block; float: none !important; margin: 0 !important; padding: 0 !important; }
html.brt-auth .brt-auth-logo a { display: inline-block; }

/* Perfex uses the dark logo on login pages; give it a light plate wherever
   it sits on something dark: the picture (centred layout) or a dark panel. */
html.brt-auth.brt-logo-plate.brt-layout-center.brt-scene-dark .brt-auth-logo a,
html.brt-auth.brt-logo-plate.brt-layout-center.brt-scene-dark .brt-auth-logo > img,
html.brt-auth.brt-logo-plate.brt-layout-float.brt-scene-dark .brt-auth-logo a,
html.brt-auth.brt-logo-plate.brt-layout-float.brt-scene-dark .brt-auth-logo > img,
html.brt-auth.brt-logo-plate.brt-layout-split.brt-dark .brt-auth-logo a,
html.brt-auth.brt-logo-plate.brt-layout-split.brt-dark .brt-auth-logo > img {
    background: rgba(255, 255, 255, .94);
    padding: 10px 16px;
    border-radius: 12px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .6) inset, 0 10px 30px -12px rgba(0, 0, 0, .6);
}

html.brt-auth .brt-auth-title {
    font-family: var(--mfp-font-head) !important;
    color: var(--mfp-text) !important;
    text-align: start;
    font-size: 24px !important;
    line-height: 1.2;
    font-weight: 650 !important;
    margin: 0 0 18px !important;
    letter-spacing: -.025em;
}

@media (max-width: 991px) {
    html.brt-auth.brt-logo-plate.brt-layout-split.brt-scene-dark .brt-auth-logo a,
    html.brt-auth.brt-logo-plate.brt-layout-split.brt-scene-dark .brt-auth-logo > img { background: rgba(255, 255, 255, .94); padding: 10px 16px; border-radius: 12px; }
}

html.brt-auth .brt-auth-eyebrow {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--mfp-muted);
    margin: 0 0 14px;
    text-align: start;
}
html.brt-auth body.rtl .brt-auth-eyebrow { letter-spacing: 0; font-size: 12.5px; }
html.brt-auth .brt-auth-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 4px 0 18px;
    flex-wrap: wrap;
}
html.brt-auth .brt-auth-row .checkbox { margin: 0 !important; }
html.brt-auth .brt-auth-row > a { font-size: 13px; font-weight: 600; color: var(--mfp-primary) !important; }
html.brt-auth.brt-dark .brt-auth-row > a { color: var(--mfp-accent) !important; }
html.brt-auth .brt-auth-row + .form-group { margin-top: 0 !important; }

html.brt-auth .brt-auth-sub {
    text-align: start;
    color: var(--mfp-muted);
    font-size: 14px;
    margin: -12px 0 20px;
}

html.brt-auth .brt-auth-card {
    background: var(--mfp-glass) !important;
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    border: 1px solid var(--mfp-edge-line) !important;
    border-radius: var(--mfp-radius-lg) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), 0 1px 2px rgba(0, 0, 0, .12), 0 40px 90px -30px rgba(0, 0, 0, .6) !important;
    padding: 28px 28px 20px !important;
    margin: 0 !important;
    color: var(--mfp-text);
    position: relative;
}
html.brt-auth.brt-light .brt-auth-card { box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(16, 24, 40, .06), 0 30px 70px -30px rgba(16, 24, 40, .35) !important; }

html.brt-auth .brt-auth-card label,
html.brt-auth .brt-auth-card .control-label { color: var(--mfp-text) !important; font-weight: 550; font-size: 13px; margin-bottom: 7px; }

html.brt-auth .brt-auth-card a { color: var(--mfp-muted) !important; text-decoration: none; transition: color .15s ease; }
html.brt-auth .brt-auth-card a:hover { color: var(--mfp-primary) !important; }
html.brt-auth.brt-dark .brt-auth-card a:hover { color: var(--mfp-accent) !important; }
html.brt-auth .brt-auth-card .text-muted { color: var(--mfp-muted) !important; }

/* Fields with a leading icon (added by login.js) */
html.brt-auth .brt-field { position: relative; }
html.brt-auth .brt-field > svg.brt-ico {
    position: absolute;
    top: 50%;
    inset-inline-start: 13px;
    width: 17px;
    height: 17px;
    transform: translateY(-50%);
    color: var(--mfp-muted);
    pointer-events: none;
    transition: color .15s ease;
}
html.brt-auth .brt-field:focus-within > svg.brt-ico { color: var(--mfp-primary); }
html.brt-auth.brt-dark .brt-field:focus-within > svg.brt-ico { color: var(--mfp-accent); }

html.brt-auth .brt-auth-card .form-control {
    height: 44px;
    border-radius: var(--mfp-radius-sm) !important;
    border: 1px solid var(--mfp-field-line) !important;
    background: var(--mfp-field) !important;
    color: var(--mfp-text) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05) !important;
    font-family: var(--mfp-font) !important;
    font-size: 14.5px;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
html.brt-auth .brt-field > .form-control { padding-inline-start: 40px; }
html.brt-auth .brt-field.has-toggle > .form-control { padding-inline-end: 44px; }
html.brt-auth .brt-auth-card .form-control::placeholder { color: rgba(var(--mfp-muted-rgb), .75); }
html.brt-auth .brt-auth-card .form-control:focus {
    border-color: rgba(var(--mfp-primary-rgb), .8) !important;
    box-shadow: 0 0 0 3px rgba(var(--mfp-primary-rgb), .25) !important;
    outline: 0;
}
html.brt-auth .brt-auth-card input:-webkit-autofill {
    -webkit-text-fill-color: var(--mfp-text);
    -webkit-box-shadow: 0 0 0 40px var(--mfp-card-bg) inset !important;
    caret-color: var(--mfp-text);
}

html.brt-auth .brt-eye {
    position: absolute;
    top: 50%;
    inset-inline-end: 6px;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--mfp-muted);
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
html.brt-auth .brt-eye:hover { background: rgba(var(--mfp-text-rgb), .06); color: var(--mfp-text); }
html.brt-auth .brt-eye svg { width: 18px; height: 18px; }

html.brt-auth .brt-auth-card .btn {
    font-family: var(--mfp-font) !important;
    font-weight: 600;
    border-radius: var(--mfp-radius-sm) !important;
    transition: filter .15s ease, box-shadow .15s ease, transform .1s ease;
}

html.brt-auth .brt-auth-card .btn-primary {
    height: 46px;
    font-size: 15px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0)), var(--mfp-primary) !important;
    border: 1px solid rgba(0, 0, 0, .12) !important;
    color: var(--mfp-on-primary) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .2), 0 14px 30px -14px rgba(var(--mfp-primary-rgb), .95) !important;
    letter-spacing: -.005em;
}
html.brt-auth .brt-auth-card .btn-primary:hover { filter: brightness(1.06); }
html.brt-auth .brt-auth-card .btn-primary:focus-visible { box-shadow: 0 0 0 3px rgba(var(--mfp-primary-rgb), .35) !important; }
html.brt-auth.brt-motion .brt-auth-card .btn-primary:active { transform: translateY(1px); }

html.brt-auth .brt-auth-card .checkbox label { font-weight: 500; color: var(--mfp-muted) !important; }
html.brt-auth .brt-auth-card .checkbox input[type="checkbox"]:checked + label::before { background: var(--mfp-primary) !important; border-color: var(--mfp-primary) !important; }
html.brt-auth .brt-auth-card .alert { border-radius: var(--mfp-radius-sm) !important; border: 0; }

html.brt-auth .brt-auth-foot {
    margin-top: 22px;
    text-align: center;
    font-size: 12px;
    color: rgba(var(--mfp-muted-rgb), .85);
    letter-spacing: .01em;
}
html.brt-auth .brt-auth-foot svg { width: 13px; height: 13px; vertical-align: -2px; margin-inline-end: 4px; }

html.brt-auth.brt-motion .brt-auth-wrap { animation: brt-rise .7s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes brt-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* ---------- split layout ----------
   Form on a full-height glass panel at the starting side; the picture,
   headline and clock fill the rest. */
html.brt-auth .brt-auth-hero { display: none; }

@media (min-width: 992px) {
    html.brt-auth.brt-layout-split .brt-auth-wrap {
        position: fixed;
        top: 0;
        bottom: 0;
        inset-inline-start: 0;
        width: 500px;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex;
        flex-direction: column;
        justify-content: center;
        overflow-y: auto;
        background: rgba(var(--mfp-card-bg-rgb), calc(var(--mfp-login-card) * .7 + .1));
        backdrop-filter: blur(30px) saturate(160%);
        -webkit-backdrop-filter: blur(30px) saturate(160%);
        border-inline-end: 1px solid var(--mfp-edge-line);
        box-shadow: 40px 0 120px -40px rgba(0, 0, 0, .55);
    }
    html.brt-auth.brt-layout-split .brt-auth-wrap > * { margin-left: 56px !important; margin-right: 56px !important; }

    /* inside the panel the card is the panel - no box in a box */
    html.brt-auth.brt-layout-split .brt-auth-card {
        background: transparent !important;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
    }
    html.brt-auth.brt-layout-split .brt-auth-logo,
    html.brt-auth.brt-layout-split .brt-auth-title,
    html.brt-auth.brt-layout-split .brt-auth-sub { text-align: start; }
    html.brt-auth.brt-layout-split .brt-auth-title { font-size: 30px !important; }
    html.brt-auth.brt-layout-split .brt-auth-foot { text-align: start; }

    html.brt-auth.brt-layout-split .brt-auth-hero {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        position: fixed;
        z-index: 2;
        top: 0;
        bottom: 0;
        inset-inline-start: 500px;
        inset-inline-end: 0;
        padding: 6vh 6vw 8vh;
        color: #fff;
        pointer-events: none;
    }
    html.brt-auth.brt-layout-split .brt-clock { align-self: flex-end; text-align: end; text-shadow: 0 2px 30px rgba(0, 0, 0, .35); }
    html.brt-auth.brt-layout-split .brt-clock b {
        display: block;
        font-family: var(--mfp-font-head);
        font-size: clamp(44px, 5vw, 76px);
        font-weight: 300;
        letter-spacing: -.04em;
        line-height: 1;
        font-variant-numeric: tabular-nums;
    }
    html.brt-auth.brt-layout-split .brt-clock span { font-size: 15px; opacity: .85; letter-spacing: .02em; }

    html.brt-auth.brt-layout-split .brt-auth-hero h2 {
        font-family: var(--mfp-font-head) !important;
        font-size: clamp(36px, 4.2vw, 64px);
        line-height: 1.04;
        font-weight: 650;
        margin: 0 0 14px;
        color: #fff;
        letter-spacing: -.035em;
        text-shadow: 0 4px 40px rgba(0, 0, 0, .4);
        max-width: 14ch;
    }
    html.brt-auth.brt-layout-split .brt-auth-hero p { font-size: 17px; max-width: 520px; margin: 0; opacity: .88; line-height: 1.5; text-shadow: 0 2px 20px rgba(0, 0, 0, .4); }
    html.brt-auth.brt-layout-split .brt-hero-chip {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 18px;
        padding: 6px 12px 6px 8px;
        border-radius: 999px;
        font-size: 12.5px;
        font-weight: 600;
        background: rgba(255, 255, 255, .12);
        border: 1px solid rgba(255, 255, 255, .22);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
    html.brt-auth.brt-layout-split.brt-scene-light .brt-auth-hero,
    html.brt-auth.brt-layout-split.brt-scene-light .brt-auth-hero h2 { color: #0E1220; text-shadow: 0 0 2px rgba(255, 255, 255, .9), 0 2px 24px rgba(255, 255, 255, .85); }
    html.brt-auth.brt-layout-split.brt-scene-light .brt-auth-hero p,
    html.brt-auth.brt-layout-split.brt-scene-light .brt-clock { text-shadow: none; }
    html.brt-auth.brt-layout-split.brt-scene-light .brt-hero-chip { background: rgba(255, 255, 255, .55); border-color: rgba(14, 18, 32, .10); }
    html.brt-auth.brt-layout-split .brt-hero-chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--mfp-accent); box-shadow: 0 0 10px var(--mfp-accent); }
}

/* ---------- floating layout ----------
   The whole photograph stays visible; a glass card floats at the starting
   side over the darker part of the picture. */
@media (min-width: 992px) {
    html.brt-auth.brt-layout-float .brt-auth-wrap {
        width: 420px;
        max-width: 420px !important;
        min-height: 100vh;
        margin: 0 !important;
        margin-inline-start: clamp(48px, 7vw, 140px) !important;
        padding: 48px 0 !important;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    html.brt-auth.brt-layout-float .brt-auth-logo { text-align: start; }
    html.brt-auth.brt-layout-float .brt-auth-card { padding: 34px 34px 22px !important; }
    html.brt-auth.brt-layout-float .brt-auth-title { font-size: 30px !important; }
    html.brt-auth.brt-layout-float .brt-auth-foot { text-align: start; }
}

/* Small screens: every layout becomes a centred card that fits the phone */
@media (max-width: 991px) {
    html.brt-auth.brt-layout-float .brt-auth-wrap,
    html.brt-auth.brt-layout-split .brt-auth-wrap {
        max-width: 420px !important;
        width: calc(100% - 32px);
        margin: 0 auto !important;
        padding: 10vh 0 32px !important;
    }
}

@media (max-width: 480px) {
    html.brt-auth .brt-auth-wrap { width: calc(100% - 24px) !important; padding-top: 7vh !important; }
    html.brt-auth .brt-auth-card { padding: 22px 18px 16px !important; }
    html.brt-auth .brt-auth-title { font-size: 23px !important; }
}

/* Letter-spacing breaks the joining of Arabic letters */
html.brt-auth body.rtl .brt-auth-title,
html.brt-auth body.rtl .btn { letter-spacing: 0 !important; }

html.brt-auth body.rtl input[type="email"],
html.brt-auth body.rtl input[type="password"] { direction: ltr; text-align: right; }

@media (prefers-reduced-motion: reduce) {
    html.brt-auth * { animation: none !important; transition: none !important; }
    html.brt-auth .brt-auth-fx { display: none; }
}

/* ==========================================================================
   Per-theme details: only what differs from the base above
   ========================================================================== */
/* Blue Ray Gold: gilded hairline, gold button with dark ink, serif title */
html.brt-auth.brt-skin-goldline .brt-auth-card { border-color: rgba(214, 180, 87, .38) !important; box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .8), 0 0 0 1px rgba(214, 180, 87, .12), inset 0 1px 0 rgba(255, 233, 170, .10) !important; }
html.brt-auth.brt-skin-goldline .brt-auth-card::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 24px;
    right: 24px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #FFD667, transparent);
    pointer-events: none;
}
html.brt-auth.brt-skin-goldline .brt-auth-title { font-weight: 600 !important; letter-spacing: .03em; font-size: 28px !important; text-align: center; }
html.brt-auth.brt-skin-goldline .brt-auth-sub { text-align: center; }
html.brt-auth.brt-skin-goldline .brt-auth-card .btn-primary,
html.brt-auth.brt-skin-spark .brt-auth-card .btn-primary {
    background: linear-gradient(180deg, #F2E1A0 0%, #D6B457 40%, #B8902E 100%) !important;
    border-color: #B8902E !important;
    color: #1A1406 !important;
    font-weight: 700;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .35);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 14px 34px -14px rgba(214, 180, 87, .9) !important;
}
html.brt-auth.brt-skin-spark .brt-auth-card .btn-primary { background: linear-gradient(180deg, #FFF3B0 0%, var(--mfp-primary) 45%, #C99A00 100%) !important; }
html.brt-auth.brt-skin-goldline .brt-auth-card .form-control:focus { border-color: #D6B457 !important; box-shadow: 0 0 0 3px rgba(214, 180, 87, .22) !important; }

/* Condensed capitals and square kit */
html.brt-auth.brt-skin-tactical .brt-auth-title,
html.brt-auth.brt-skin-inferno .brt-auth-title,
html.brt-auth.brt-skin-hornet .brt-auth-title,
html.brt-auth.brt-skin-glitch .brt-auth-title,
html.brt-auth.brt-skin-saffron .brt-auth-title,
html.brt-auth.brt-skin-redline .brt-auth-title { text-transform: uppercase; letter-spacing: .03em; font-size: 30px !important; font-weight: 700 !important; }
html.brt-auth.brt-skin-tactical .brt-auth-card { border-top: 3px solid var(--mfp-accent) !important; }
html.brt-auth.brt-skin-tactical .brt-auth-card .btn-primary,
html.brt-auth.brt-skin-hornet .brt-auth-card .btn-primary,
html.brt-auth.brt-skin-saffron .brt-auth-card .btn-primary { background: var(--mfp-accent) !important; border-color: var(--mfp-accent) !important; color: #1A1600 !important; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
html.brt-auth.brt-skin-tactical .brt-auth-card .btn,
html.brt-auth.brt-skin-tactical .brt-auth-card .form-control,
html.brt-auth.brt-skin-hornet .brt-auth-card .btn,
html.brt-auth.brt-skin-hornet .brt-auth-card .form-control,
html.brt-auth.brt-skin-nightops .brt-auth-card .btn,
html.brt-auth.brt-skin-nightops .brt-auth-card .form-control,
html.brt-auth.brt-skin-glitch .brt-auth-card .btn,
html.brt-auth.brt-skin-glitch .brt-auth-card .form-control,
html.brt-auth.brt-skin-redline .brt-auth-card .btn,
html.brt-auth.brt-skin-redline .brt-auth-card .form-control { border-radius: 3px !important; }
html.brt-auth.brt-skin-hornet .brt-auth-card::before {
    content: '';
    position: absolute;
    top: -1px;
    inset-inline-start: 24px;
    width: 90px;
    height: 5px;
    background: repeating-linear-gradient(-45deg, var(--mfp-primary) 0 6px, #0A0A0A 6px 12px);
    pointer-events: none;
}

/* Fire */
html.brt-auth.brt-skin-inferno .brt-auth-card { box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .8), 0 30px 70px -40px rgba(var(--mfp-primary-rgb), .75) !important; }
html.brt-auth.brt-skin-inferno .brt-auth-card .btn-primary { background: linear-gradient(180deg, var(--mfp-accent), var(--mfp-primary) 62%, #9A2E05) !important; }

/* HUD */
html.brt-auth.brt-skin-nightops .brt-auth-title { font-family: var(--mfp-font-head) !important; text-transform: uppercase; letter-spacing: .16em; font-size: 18px !important; font-weight: 600 !important; }
html.brt-auth.brt-skin-nightops .brt-auth-card .btn-primary { background: transparent !important; color: var(--mfp-primary) !important; border: 1px solid var(--mfp-primary) !important; text-transform: uppercase; letter-spacing: .16em; box-shadow: inset 0 0 20px -8px rgba(var(--mfp-primary-rgb), .9) !important; }
html.brt-auth.brt-skin-nightops .brt-auth-card .btn-primary:hover { background: var(--mfp-primary) !important; color: #0A0602 !important; }
html.brt-auth.brt-skin-nightops .brt-auth-card::before {
    content: '';
    position: absolute;
    inset: -1px;
    pointer-events: none;
    background:
        linear-gradient(var(--mfp-primary), var(--mfp-primary)) top left / 18px 2px no-repeat,
        linear-gradient(var(--mfp-primary), var(--mfp-primary)) top left / 2px 18px no-repeat,
        linear-gradient(var(--mfp-primary), var(--mfp-primary)) bottom right / 18px 2px no-repeat,
        linear-gradient(var(--mfp-primary), var(--mfp-primary)) bottom right / 2px 18px no-repeat;
}

/* Chrome / steel */
html.brt-auth.brt-skin-muscle .brt-auth-title,
html.brt-auth.brt-skin-steel .brt-auth-title,
html.brt-auth.brt-skin-circuit .brt-auth-title,
html.brt-auth.brt-skin-violet .brt-auth-title { font-family: var(--mfp-font-head) !important; letter-spacing: .03em; font-size: 28px !important; }
html.brt-auth.brt-skin-muscle .brt-auth-title { text-transform: uppercase; font-weight: 800 !important; }
html.brt-auth.brt-skin-muscle .brt-auth-card .btn-primary,
html.brt-auth.brt-skin-steel .brt-auth-card .btn-primary { background: linear-gradient(180deg, rgba(255, 255, 255, .26), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, .12)), var(--mfp-primary) !important; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }
html.brt-auth.brt-skin-steel .brt-auth-card::after {
    content: '';
    position: absolute;
    top: 0;
    inset-inline-end: 0;
    width: 30px;
    height: 30px;
    background: linear-gradient(225deg, var(--mfp-accent) 0 50%, transparent 50%);
    border-start-end-radius: inherit;
    pointer-events: none;
}
html.brt-auth.brt-skin-circuit .brt-auth-card { border-color: rgba(var(--mfp-primary-rgb), .40) !important; box-shadow: 0 0 60px -26px rgba(var(--mfp-primary-rgb), .8) !important; }
html.brt-auth.brt-skin-circuit .brt-auth-card .btn-primary { background: linear-gradient(180deg, var(--mfp-accent), var(--mfp-primary)) !important; color: #120C00 !important; }
html.brt-auth.brt-skin-violet .brt-auth-card .btn-primary { background: linear-gradient(135deg, var(--mfp-primary), rgba(var(--mfp-primary-rgb), .78)) !important; }

/* Light and signal */
html.brt-auth.brt-skin-amber .brt-auth-title { font-family: var(--mfp-font-head) !important; text-transform: uppercase; letter-spacing: .18em; font-weight: 500 !important; font-size: 22px !important; text-align: center; }
html.brt-auth.brt-skin-amber .brt-auth-sub { text-align: center; }
html.brt-auth.brt-skin-amber .brt-auth-card .btn-primary { background: linear-gradient(110deg, var(--mfp-primary), var(--mfp-accent)) !important; box-shadow: 0 0 34px -10px rgba(var(--mfp-primary-rgb), .95) !important; border-radius: 999px !important; }
html.brt-auth.brt-skin-amber .brt-auth-card .form-control { border-radius: 999px !important; }
html.brt-auth.brt-skin-glitch .brt-auth-title { text-shadow: -2px 0 rgba(var(--mfp-primary-rgb), .9), 2px 0 rgba(61, 139, 255, .7); }
html.brt-auth.brt-skin-glitch .brt-auth-card { box-shadow: 8px 8px 0 rgba(var(--mfp-primary-rgb), .35) !important; }
html.brt-auth.brt-skin-glitch .brt-auth-card .btn-primary { box-shadow: 4px 4px 0 #3D8BFF !important; text-transform: uppercase; letter-spacing: .1em; }
html.brt-auth.brt-skin-saffron .brt-auth-card .btn-primary,
html.brt-auth.brt-skin-saffron .brt-auth-card .form-control { border-radius: 999px !important; }
html.brt-auth.brt-skin-redline .brt-auth-title { font-family: var(--mfp-font-head) !important; letter-spacing: .12em; font-weight: 500 !important; }
html.brt-auth.brt-skin-redline .brt-auth-card .btn-primary { text-transform: uppercase; letter-spacing: .14em; font-size: 13px; font-weight: 700; }
html.brt-auth.brt-skin-spark .brt-auth-title { font-weight: 800 !important; letter-spacing: -.02em; font-size: 30px !important; }
html.brt-auth.brt-layout-split .brt-auth-card::before,
html.brt-auth.brt-layout-split .brt-auth-card::after { display: none; }

/* RTL: e-mail and password are typed left-to-right, but the icon sits on the
   right of the field - pad the physical sides to match. */
html.brt-auth body.rtl .brt-field > input[type="email"],
html.brt-auth body.rtl .brt-field > input[type="password"],
html.brt-auth body.rtl .brt-field > input[type="text"] { padding-right: 42px !important; padding-left: 14px !important; }
html.brt-auth body.rtl .brt-field.has-toggle > input { padding-left: 46px !important; }
html.brt-auth .brt-clock b, html.brt-auth .brt-clock span { unicode-bidi: plaintext; }

/* ==========================================================================
   Logo: emblem (the Blue Ray round badge, drawn for dark backgrounds)
   ========================================================================== */
html.brt-auth.brt-logo-emblem .brt-auth-logo { margin-bottom: 22px; }
html.brt-auth.brt-logo-emblem .brt-auth-logo img {
    max-height: 132px;
    max-width: 260px;
    filter: drop-shadow(0 0 18px rgba(var(--mfp-primary-rgb), .45)) drop-shadow(0 12px 28px rgba(0, 0, 0, .55));
}
html.brt-auth.brt-logo-emblem.brt-light.brt-bg-plain .brt-auth-logo img { filter: drop-shadow(0 10px 22px rgba(0, 0, 0, .18)); }
html.brt-auth.brt-logo-emblem.brt-motion .brt-auth-logo img { animation: brt-emblem 6s ease-in-out infinite; }
@keyframes brt-emblem {
    0%, 100% { filter: drop-shadow(0 0 14px rgba(var(--mfp-primary-rgb), .35)) drop-shadow(0 12px 28px rgba(0, 0, 0, .55)); }
    50% { filter: drop-shadow(0 0 26px rgba(var(--mfp-primary-rgb), .65)) drop-shadow(0 12px 28px rgba(0, 0, 0, .55)); }
}
html.brt-auth.brt-logo-plain .brt-auth-logo img { max-height: 90px; }
@media (max-width: 600px) { html.brt-auth.brt-logo-emblem .brt-auth-logo img { max-height: 104px; } }