/*  */


        :root {

            --auth-brand:
                #654320;

            --auth-page:
                #f8f7f5;

            --auth-radius:
                4px;

            --auth-text:
                #161b24;

            --auth-muted:
                #89919c;

            --auth-line:
                #e4e8ed;
        }


        * {
            box-sizing: border-box;
        }


        html,
        body {
            margin: 0;
            min-height: 100%;
        }


        body {
            min-height: 100dvh;

            display: flex;
            align-items: center;
            justify-content: center;

            padding: 32px 18px;

            background:
                var(--auth-page);

            color:
                var(--auth-text);

            font-family:
                Cairo,
                "Segoe UI",
                Tahoma,
                Arial,
                sans-serif;
        }


        a {
            color: inherit;
            text-decoration: none;
        }


        button,
        input {
            font: inherit;
        }



        /* ================================================
           AUTH SHELL
           ================================================ */

        .theme-auth {
            width: min(440px, 100%);
        }


        .theme-auth__identity {
            display: flex;
            flex-direction: column;
            align-items: center;

            margin-bottom: 20px;

            text-align: center;
        }


        .theme-auth__logo {
            min-height: 70px;

            display: flex;
            align-items: center;
            justify-content: center;

            margin-bottom: 9px;
        }


        .theme-auth__logo img {
            display: block;

            width: auto;
            max-width: 185px;
            max-height: 68px;

            object-fit: contain;
        }


        .theme-auth__logo-text {
            color:
                var(--auth-brand);

            font-size: 25px;
            font-weight: 850;
        }


        .theme-auth__identity small {
            color:
                var(--auth-muted);

            font-size: 10px;
            font-weight: 650;
        }



        /* CARD */

        .theme-auth__card {
            padding: 34px 31px 30px;

            border:
                1px solid
                var(--auth-line);

            border-radius:
                var(--auth-radius);

            background:
                #fff;

            box-shadow:
                0 18px 55px
                rgba(15,23,42,.07);
        }


        .theme-auth__heading {
            margin-bottom: 26px;

            text-align: center;
        }


        .theme-auth__heading h1 {
            margin:
                0 0 7px;

            color:
                var(--auth-text);

            font-size: 25px;
            line-height: 1.45;
            font-weight: 850;
        }


        .theme-auth__heading p {
            max-width: 310px;

            margin:
                0 auto;

            color:
                var(--auth-muted);

            font-size: 11px;
            line-height: 1.8;
        }



        /* STATUS */

        .theme-auth__status,
        .theme-auth__errors {
            margin-bottom: 18px;

            padding: 11px 13px;

            border-radius: 8px;

            font-size: 10.5px;
            line-height: 1.7;
        }


        .theme-auth__status {
            border:
                1px solid #ccebd8;

            background:
                #f1fbf5;

            color:
                #237443;
        }


        .theme-auth__errors {
            border:
                1px solid #ffd1d5;

            background:
                #fff4f5;

            color:
                #b92c37;
        }



        /* FIELD */

        .theme-auth__field {
            margin-bottom: 17px;
        }


        .theme-auth__field label {
            display: block;

            margin-bottom: 7px;

            color:
                #39414c;

            font-size: 10.5px;
            font-weight: 800;
        }


        .theme-auth__input {
            position: relative;
        }


        .theme-auth__input input {
            width: 100%;
            height: 51px;

            padding:
                0 42px
                0 13px;

            border:
                1px solid
                #dde2e8;

            border-radius:
                calc(
                    var(--auth-radius) * .52
                );

            background:
                #fff;

            color:
                #313944;

            outline: 0;

            font-size: 11.5px;

            transition:
                border-color .2s ease,
                box-shadow .2s ease;
        }


        html[dir="ltr"]
        .theme-auth__input input {
            padding:
                0 13px
                0 42px;
        }


        .theme-auth__input input:focus {
            border-color:
                var(--auth-brand);

            box-shadow:
                0 0 0 3px
                rgba(40,85,150,.08);
        }


        .theme-auth__input i {
            position: absolute;

            top: 50%;
            right: 14px;

            transform:
                translateY(-50%);

            color:
                #9aa2ad;

            font-size: 18px;

            pointer-events: none;
        }


        html[dir="ltr"]
        .theme-auth__input i {
            right: auto;
            left: 14px;
        }


        .theme-auth__field-error {
            display: block;

            margin-top: 5px;

            color:
                #c52e39;

            font-size: 9px;
        }



        /* OPTIONS */

        .theme-auth__options {
            display: flex;
            align-items: center;
            justify-content: space-between;

            gap: 15px;

            margin:
                -1px 0 21px;

            color:
                #7f8792;

            font-size: 10px;
        }


        .theme-auth__remember {
            display: flex;
            align-items: center;

            gap: 6px;
        }


        .theme-auth__remember input {
            accent-color:
                var(--auth-brand);
        }


        .theme-auth__forgot {
            color:
                var(--auth-brand);

            font-weight: 800;
        }



        /* PRIMARY BUTTON */

        .theme-auth__primary {
            width: 100%;
            min-height: 51px;

            display: flex;
            align-items: center;
            justify-content: center;

            gap: 7px;

            padding:
                10px 15px;

            border: 0;

            border-radius:
                calc(
                    var(--auth-radius) * .52
                );

            background:
                var(--auth-brand);

            color:
                #fff;

            cursor: pointer;

            font-size: 12px;
            font-weight: 850;
        }


        .theme-auth__primary i {
            font-size: 18px;
        }



        /* SWITCH */

        .theme-auth__switch {
            margin-top: 20px;

            text-align: center;

            color:
                #89919c;

            font-size: 10.5px;
        }


        .theme-auth__switch a {
            margin-inline-start: 4px;

            color:
                var(--auth-brand);

            font-weight: 850;
        }



        /* HOME */

        .theme-auth__home {
            display: flex;
            align-items: center;
            justify-content: center;

            gap: 5px;

            margin-top: 19px;

            color:
                #7f8792;

            font-size: 10px;
            font-weight: 650;
        }


        .theme-auth__home i {
            font-size: 15px;
        }



        /* ================================================
           SMALL VISUAL SIGNATURES
           ================================================ */

        body.auth-theme-luxury
        .theme-auth__card {
            box-shadow:
                0 12px 40px
                rgba(0,0,0,.06);
        }


        body.auth-theme-luxury
        .theme-auth__heading h1 {
            letter-spacing:
                .02em;
        }


        body.auth-theme-xton
        .theme-auth__card {
            border-top:
                3px solid
                var(--auth-brand);
        }


        body.auth-theme-zakas
        .theme-auth__card {
            box-shadow:
                0 20px 60px
                rgba(20,20,30,.065);
        }


        body.auth-theme-karam
        .theme-auth__card {
            box-shadow:
                0 18px 45px
                rgba(65,45,25,.065);
        }



        /* MOBILE */

        @media(max-width: 575px) {

            body {
                align-items:
                    flex-start;

                padding:
                    20px 14px 35px;
            }


            .theme-auth__identity {
                margin-bottom:
                    13px;
            }


            .theme-auth__logo {
                min-height:
                    62px;
            }


            .theme-auth__logo img {
                max-width:
                    150px;

                max-height:
                    57px;
            }


            .theme-auth__card {
                padding:
                    27px 19px 24px;
            }


            .theme-auth__heading {
                margin-bottom:
                    22px;
            }


            .theme-auth__heading h1 {
                font-size:
                    22px;
            }

        }

    
/* id="nanas-brand" */
:root{--nanas-header:#654320;--nanas-secondary:#fcd2a0;--nanas-footer:#000000}
::selection{background:#fcd2a0;color:#654320}
/*  */

:root { --bzk-brand: #6b4523; --bzk-ink: #2b2118; }
html { min-height: 100%; }
html body { min-height: 100vh !important; background: radial-gradient(circle at 8% 0%, #ffe2c0 0, transparent 42%), radial-gradient(circle at 100% 22%, #ffe8d3 0, transparent 38%), radial-gradient(circle at 0% 100%, #ffe0c6 0, transparent 40%), #fff8ef !important; }
.bzk-panel, .bzk-panel * { box-sizing: border-box; }

/* desktop: soft side panel */
.bzk-panel { position: fixed; top: 0; bottom: 0; inset-inline-end: 0; width: 44vw; z-index: 1; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; padding: 40px;
    background: radial-gradient(circle at 25% 20%, #fff1df 0, transparent 45%), radial-gradient(circle at 80% 85%, #ffe0ea 0, transparent 40%), linear-gradient(160deg, #ffe0b8 0%, #fbc68c 100%); }
html body { padding-inline-end: 44vw !important; }
.bzk-sky { position: absolute; inset: 0; pointer-events: none; }
.bzk-star { position: absolute; color: #ffc93c; font-size: 30px; text-shadow: 0 4px 10px rgba(255, 170, 0, .35); animation: bzkTwinkle 2.6s ease-in-out infinite; }
.bzk-star--1 { top: 14%; inset-inline-start: 14%; } .bzk-star--2 { top: 22%; inset-inline-end: 12%; font-size: 24px; animation-delay: 1.1s; }
.bzk-heart { position: absolute; bottom: 22%; inset-inline-end: 16%; color: #ff8fb8; font-size: 26px; animation: bzkFloat 3.2s ease-in-out infinite; }
.bzk-blocks { position: relative; display: flex; gap: 8px; direction: ltr; }
.bzk-block { width: 64px; height: 64px; display: inline-flex; align-items: center; justify-content: center; border-radius: 15px; background: var(--c); color: #2b2118;
    font: 900 34px/1 Georgia, serif; transform: rotate(var(--r)); box-shadow: inset 0 -6px 0 rgba(0,0,0,.14), 0 10px 18px rgba(0,0,0,.12); animation: bzkBounce 2.4s ease-in-out infinite; animation-delay: var(--d); }
.bzk-bubble { position: relative; background: #fff; color: var(--bzk-brand); font-weight: 900; font-size: 22px; line-height: 1.4; padding: 12px 26px; border-radius: 999px; box-shadow: 0 12px 28px rgba(107, 69, 35, .14); animation: bzkPop .6s .3s cubic-bezier(.2,1.4,.4,1) both; }
.bzk-bubble::after { content: ""; position: absolute; top: -9px; left: 50%; transform: translateX(-50%) rotate(45deg); width: 18px; height: 18px; background: #fff; border-radius: 3px; }
.bzk-tag { position: relative; font-size: 15px; font-weight: 600; color: #6e5b4b; }

/* the existing page: one calm, centred column */
html body > *:has(form):not(.bzk-panel) { position: relative; z-index: 2; width: calc(100% - 32px) !important; max-width: 420px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; float: none !important; }
html body *:has(> form) { width: 100% !important; max-width: 420px !important; margin-left: auto !important; margin-right: auto !important; border-radius: 26px !important; border: 0 !important; background: #fff !important; box-shadow: 0 18px 44px rgba(107, 69, 35, .10) !important; box-sizing: border-box !important; }
html body form input[type="email"], html body form input[type="text"], html body form input[type="password"], html body form input[type="tel"] {
    border-radius: 16px !important; border: 2px solid #f1e3d1 !important; background: #fffdfa !important; min-height: 54px !important; transition: border-color .2s ease, box-shadow .2s ease !important; }
html body form input::placeholder { color: #b7aa9c !important; }
html body form input:focus { border-color: var(--bzk-brand) !important; box-shadow: 0 0 0 4px rgba(107, 69, 35, .10) !important; outline: 0 !important; }
html body form button[type="submit"] { border-radius: 999px !important; min-height: 56px !important; background: linear-gradient(180deg, #7a4f28, #5f3c1d) !important; box-shadow: 0 12px 24px rgba(107, 69, 35, .28) !important; transition: transform .18s cubic-bezier(.2,1.6,.4,1), box-shadow .2s ease !important; }
html body form button[type="submit"]:hover { transform: translateY(-2px); }
html body form { animation: bzkRiseIn .6s .1s cubic-bezier(.2,1,.3,1) both; }
html body form.bzk-shake { animation: bzkShake .45s ease both; }
.bzk-eye { position: absolute; top: 50%; inset-inline-end: 10px; transform: translateY(-50%); width: 38px; height: 38px; border: 0; border-radius: 50%; background: #f6efe7; color: #6e5b4b; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; z-index: 3; }
.bzk-eye svg { width: 20px; height: 20px; }

@keyframes bzkBounce { 0%, 100% { transform: translateY(0) rotate(var(--r)); } 50% { transform: translateY(-10px) rotate(var(--r)); } }
@keyframes bzkTwinkle { 0%, 100% { opacity: .55; transform: scale(.9); } 50% { opacity: 1; transform: scale(1.12); } }
@keyframes bzkFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes bzkPop { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: none; } }
@keyframes bzkRiseIn { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes bzkShake { 20%, 60% { transform: translateX(-8px); } 40%, 80% { transform: translateX(8px); } }

/* phones & tablets: light hero on the page background, form right below it */
@media (max-width: 991px) {
    html body { padding-inline-end: 0 !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; }
    html body > .bzk-panel { order: -1 !important; position: relative; inset: auto; width: 100% !important; max-width: none !important; height: auto; flex: 0 0 auto !important;
        background: transparent; padding: 26px 16px 6px; gap: 10px; margin: 0 !important; overflow: visible; }
    .bzk-block { width: 50px; height: 50px; font-size: 27px; border-radius: 13px; }
    .bzk-bubble { font-size: 18px; padding: 9px 20px; }
    .bzk-tag { font-size: 13px; }
    .bzk-star { font-size: 20px; } .bzk-star--1 { top: 6px; inset-inline-start: 8%; } .bzk-star--2 { top: 58%; inset-inline-end: 6%; font-size: 18px; }
    .bzk-heart { display: none; }
    html body > *:has(form):not(.bzk-panel) { margin-top: 4px !important; }
    html body > *:has(form):not(.bzk-panel) img:not(form img) { width: 84px !important; height: 84px !important; max-width: 84px !important; }
    html body *:has(> form) { padding: 24px 20px !important; }
}
@media (prefers-reduced-motion: reduce) { .bzk-panel *, html body form { animation: none !important; } }
/* BZ_KIDS_LOGO: exact centring + floating logo */
html { scrollbar-gutter: stable both-edges; background: #fff8ef !important; }
@media (max-width: 991px) { html body { padding-left: 0 !important; padding-right: 0 !important; } }
.bzk-logo-float { display: inline-block; position: relative; padding-bottom: 16px; }
.bzk-logo-float img { position: relative; z-index: 1; border-radius: 50%; box-shadow: 0 10px 22px rgba(107, 69, 35, .18); animation: bzkLogoFly 3.2s ease-in-out infinite; }
.bzk-logo-float::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 62%; height: 10px; border-radius: 50%; background: rgba(107, 69, 35, .28); filter: blur(4px); transform: translateX(-50%); animation: bzkLogoShadow 3.2s ease-in-out infinite; }
@keyframes bzkLogoFly { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes bzkLogoShadow { 0%, 100% { transform: translateX(-50%) scale(1); opacity: .6; } 50% { transform: translateX(-50%) scale(.68); opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .bzk-logo-float img, .bzk-logo-float::after { animation: none !important; } }
/* BZ_KIDS_LOGO_ROUND: keep the logo a perfect circle whatever the theme sets */
html body .bzk-logo-float img { width: 96px !important; height: 96px !important; min-width: 96px !important; max-width: 96px !important; min-height: 96px !important; max-height: 96px !important; aspect-ratio: 1 / 1 !important; object-fit: cover !important; border-radius: 50% !important; padding: 0 !important; }
@media (max-width: 991px) { html body .bzk-logo-float img { width: 84px !important; height: 84px !important; min-width: 84px !important; max-width: 84px !important; min-height: 84px !important; max-height: 84px !important; } }
/* BZ_KIDS_LOGO_BG: no band behind the logo */
.bzk-nobg, .bzk-nobg::before, .bzk-nobg::after { background: transparent !important; background-image: none !important; box-shadow: none !important; border-color: transparent !important; }
.bzk-logo-float img { background: transparent !important; }
/* BZ_KIDS_LOGO_BG2: any box around the logo (outside the form) gets no background */
html body *:has(img):not(:has(form)):not(.bzk-panel):not(.bzk-logo-float):not(form *),
html body *:has(img):not(:has(form)):not(.bzk-panel):not(.bzk-logo-float):not(form *)::before,
html body *:has(img):not(:has(form)):not(.bzk-panel):not(.bzk-logo-float):not(form *)::after {
    background: transparent !important; background-color: transparent !important; background-image: none !important; box-shadow: none !important; border-color: transparent !important; }