/* /Components/Layout/CustomerLayout.razor.rz.scp.css */
.page[b-ydg4ni0tze] {
    height: 100%;
    font-family: var(--bs-font-sans-serif, var(--DS-font-family-sans-serif));
}

.logo[b-ydg4ni0tze] {
    text-align: center;
}

[b-ydg4ni0tze] .icon-back {
    --icon-mask-image: var(--icon-back-mask-image);
}

[b-ydg4ni0tze] .icon-close {
    --icon-mask-image: var(--icon-close-mask-image);
}

[b-ydg4ni0tze] .icon-menu {
    --icon-mask-image: var(--icon-menu-mask-image);
}


[b-ydg4ni0tze] .docs-icon {
    --icon-mask-image: var(--icon-docs-mask-image);
}

[b-ydg4ni0tze] .demos-icon {
    --icon-mask-image: var(--icon-demos-mask-image);
}

[b-ydg4ni0tze] .footer-button:hover .demos-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-ydg4ni0tze] .footer-button:hover .docs-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-ydg4ni0tze] .menu-button:hover .icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-ydg4ni0tze] .menu-button-nav:hover .icon {
    background-color: var(--dxbl-btn-hover-color);
}

.panel-open .menu-button[b-ydg4ni0tze] {
    display: inline-flex;
}

.nav-buttons-container[b-ydg4ni0tze] {
    display: flex;
    gap: 10px;
    padding: 2rem 1rem;
}

.nav-buttons-container[b-ydg4ni0tze]  .menubutton-float-end {
    margin-left: auto;
}

.fa[b-ydg4ni0tze] {
    font-size: 14px;
}

/* Page background with floating paws */
.page[b-ydg4ni0tze] {
    position: relative;
    overflow: hidden;
}

    .page[b-ydg4ni0tze]::before, .page[b-ydg4ni0tze]::after {
        content: '';
        position: fixed;
        width: 24px;
        height: 24px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(102,126,234,0.1)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        pointer-events: none;
        z-index: -1;
    }

    .page[b-ydg4ni0tze]::before {
        top: 20%;
        left: 10%;
        animation: floatPaw1-b-ydg4ni0tze 6s ease-in-out infinite;
    }

    .page[b-ydg4ni0tze]::after {
        top: 60%;
        right: 15%;
        width: 20px;
        height: 20px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(155,89,182,0.08)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
        animation: floatPaw2-b-ydg4ni0tze 8s ease-in-out infinite 2s;
    }

    /* Additional floating paws */
    .page .floating-paw-1[b-ydg4ni0tze], .page .floating-paw-2[b-ydg4ni0tze], .page .floating-paw-3[b-ydg4ni0tze] {
        content: '';
        position: fixed;
        width: 18px;
        height: 18px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(22,160,133,0.06)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        pointer-events: none;
        z-index: -1;
        opacity: 0.8;
    }

        .page .floating-paw-1[b-ydg4ni0tze]::before {
            content: '';
            position: fixed;
            top: 35%;
            left: 75%;
            width: 16px;
            height: 16px;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(142,68,173,0.07)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
            background-size: contain;
            background-repeat: no-repeat;
            pointer-events: none;
            z-index: -1;
            animation: floatPaw3-b-ydg4ni0tze 10s ease-in-out infinite 4s;
        }

        .page .floating-paw-2[b-ydg4ni0tze]::before {
            content: '';
            position: fixed;
            top: 80%;
            left: 25%;
            width: 14px;
            height: 14px;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(52,152,219,0.05)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
            background-size: contain;
            background-repeat: no-repeat;
            pointer-events: none;
            z-index: -1;
            animation: floatPaw4-b-ydg4ni0tze 7s ease-in-out infinite 1s;
        }

/* CSS Animations */
@keyframes floatPaw1-b-ydg4ni0tze {
    0%, 100% {
        transform: rotate(15deg) translateY(0px) scale(1);
        opacity: 0.1;
    }

    25% {
        transform: rotate(25deg) translateY(-10px) scale(1.1);
        opacity: 0.15;
    }

    50% {
        transform: rotate(5deg) translateY(-15px) scale(0.9);
        opacity: 0.2;
    }

    75% {
        transform: rotate(20deg) translateY(-5px) scale(1.05);
        opacity: 0.12;
    }
}

@keyframes floatPaw2-b-ydg4ni0tze {
    0%, 100% {
        transform: rotate(-20deg) translateX(0px) scale(1);
        opacity: 0.08;
    }

    33% {
        transform: rotate(-35deg) translateX(15px) scale(1.2);
        opacity: 0.12;
    }

    66% {
        transform: rotate(-10deg) translateX(-10px) scale(0.8);
        opacity: 0.15;
    }
}

@keyframes floatPaw3-b-ydg4ni0tze {
    0%, 100% {
        transform: rotate(30deg) translateX(0px) translateY(0px) scale(1);
        opacity: 0.07;
    }

    20% {
        transform: rotate(45deg) translateX(-20px) translateY(10px) scale(1.15);
        opacity: 0.1;
    }

    40% {
        transform: rotate(15deg) translateX(25px) translateY(-12px) scale(0.85);
        opacity: 0.12;
    }

    60% {
        transform: rotate(35deg) translateX(-15px) translateY(-8px) scale(1.1);
        opacity: 0.08;
    }

    80% {
        transform: rotate(20deg) translateX(18px) translateY(15px) scale(0.95);
        opacity: 0.09;
    }
}

@keyframes floatPaw4-b-ydg4ni0tze {
    0%, 100% {
        transform: rotate(-45deg) scale(1);
        opacity: 0.05;
    }

    30% {
        transform: rotate(-60deg) translateY(-20px) scale(1.3);
        opacity: 0.08;
    }

    70% {
        transform: rotate(-30deg) translateY(25px) scale(0.7);
        opacity: 0.1;
    }
}

/* Hover effects for floating paws */
.page:hover[b-ydg4ni0tze]::before {
    transform: rotate(45deg) translateX(20px) translateY(-15px) scale(1.2);
    opacity: 0.6;
}

.page:hover[b-ydg4ni0tze]::after {
    transform: rotate(-50deg) translateX(-25px) translateY(20px) scale(0.8);
    opacity: 0.4;
}

/* Top bar - Logo inspired professional gradient */
.dxbl-menu.text-bg-primary[b-ydg4ni0tze] {
    background: linear-gradient(135deg, #2c3e50 0%, #3498db 25%, #16a085 50%, #8e44ad 75%, #9b59b6 100%) !important;
    box-shadow: 0 4px 15px rgba(44, 62, 80, 0.3) !important;
    transition: all 0.3s ease !important;
}

/* Sidebar - Matching logo-inspired gradient */
.dxbl-drawer-body[b-ydg4ni0tze] {
    background: linear-gradient(180deg, #2c3e50 0%, #3498db 25%, #16a085 50%, #8e44ad 75%, #9b59b6 100%) !important;
    box-shadow: 2px 0 15px rgba(52, 152, 219, 0.2) !important;
}
.sidebar-paws[b-ydg4ni0tze] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 26px;
}

    .sidebar-paws .paw[b-ydg4ni0tze] {
        width: 28px;
        height: 28px;
        opacity: 0;
        transform: translate(var(--dx,0), 18px) scale(.92) rotate(-8deg);
        filter: drop-shadow(0 2px 3px rgba(0,0,0,.18));
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E") no-repeat center/contain;
        animation: paw-pop-b-ydg4ni0tze 4.2s infinite var(--delay,0s);
    }

        .sidebar-paws .paw:nth-child(2n)[b-ydg4ni0tze] {
            transform: translate(var(--dx,0), 18px) scale(.88) rotate(10deg);
        }

        .sidebar-paws .paw:nth-child(3n)[b-ydg4ni0tze] {
            transform: translate(var(--dx,0), 18px) scale(.95) rotate(-14deg);
        }

@keyframes paw-pop-b-ydg4ni0tze {
    0% {
        opacity: 0;
        transform: translate(var(--dx,0), 18px) scale(.92) rotate(-8deg);
    }

    12% {
        opacity: .55;
        transform: translate(var(--dx,0), 0px) scale(1.00) rotate(0deg);
    }

    28% {
        opacity: .35;
        transform: translate(calc(var(--dx,0) + 6px), -14px) scale(.96) rotate(6deg);
    }

    40% {
        opacity: 0;
        transform: translate(calc(var(--dx,0) + 10px), -22px) scale(.92) rotate(10deg);
    }

    100% {
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sidebar-paws .paw[b-ydg4ni0tze] {
        animation: none;
        opacity: .35;
    }
}

/* === TOPBAR YÜRÜYEN PATİLER — ADIM ADIM === */
.dxbl-menu.text-bg-primary[b-ydg4ni0tze] {
    position: relative;
    overflow: hidden;
}

.topbar-paws[b-ydg4ni0tze] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
}

    /* Ayarlanabilir değişkenler:
   --dur   : toplam tur süresi (yürüyüş yavaşlığı)
   --steps : adım sayısı (ne kadar “tırtıklı” ilerleyecek) */
    .topbar-paws .paw[b-ydg4ni0tze] {
        position: absolute;
        top: var(--y,50%); /* hat yüksekliği */
        left: -10vw; /* ekran dışından başlat */
        width: 22px;
        height: 22px;
        transform: translateY(-50%) rotate(var(--rot,0deg));
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E") no-repeat center/contain;
        filter: drop-shadow(0 1px 2px rgba(0,0,0,.25));
        opacity: 0;
        /* iki ayrı animasyon:
     1) yatay adım adım yürüyüş (steps)
     2) her adımda görünür olup iz gibi solma (steps) */
        --dur: 24s;
        --steps: 28; /* ne kadar adım? */
        animation: paw-walk-b-ydg4ni0tze var(--dur) steps(var(--steps)) infinite var(--delay,0s), paw-stamp-b-ydg4ni0tze var(--dur) steps(var(--steps)) infinite var(--delay,0s);
    }

        /* Ufak çeşitlilik */
        .topbar-paws .paw:nth-child(2n)[b-ydg4ni0tze] {
            transform: translateY(calc(-50% + 1px)) scale(.92) rotate(var(--rot,6deg));
        }

        .topbar-paws .paw:nth-child(3n)[b-ydg4ni0tze] {
            transform: translateY(calc(-50% - 1px)) scale(1.06) rotate(var(--rot,-8deg));
        }

/* Soldan sağa adım adım “snap” yürüyüş */
@keyframes paw-walk-b-ydg4ni0tze {
    from {
        transform: translateX(0) translateY(-50%) rotate(var(--rot,0deg));
    }

    to {
        transform: translateX(120vw) translateY(-50%) rotate(var(--rot,0deg));
    }
}

/* Her adımda kısa parlayıp iz bırakır gibi sönsün */
@keyframes paw-stamp-b-ydg4ni0tze {
    0% {
        opacity: 0;
    }

    2% {
        opacity: .95;
    }
    /* ayağı bastı */
    25% {
        opacity: .75;
    }
    /* iz kalır */
    50% {
        opacity: .45;
    }

    75% {
        opacity: .2;
    }

    100% {
        opacity: 0;
    }
    /* bir sonraki adıma geç */
}

/* 3 paralel hat — daha “yan yan” yürüyüş */
.topbar-paws .paw.track-1[b-ydg4ni0tze] {
    --y: 32%;
    --rot: -6deg;
}

.topbar-paws .paw.track-2[b-ydg4ni0tze] {
    --y: 52%;
    --rot: 4deg;
}

.topbar-paws .paw.track-3[b-ydg4ni0tze] {
    --y: 72%;
    --rot: -3deg;
}

/* Hareket azaltma tercihine saygı */
@media (prefers-reduced-motion: reduce) {
    .topbar-paws .paw[b-ydg4ni0tze] {
        animation: none;
        opacity: .35;
        left: 10%;
    }
}

/* === TOPBAR YAN PROFİL HAYVANLAR === */
.dxbl-menu.text-bg-primary[b-ydg4ni0tze] {
    position: relative; /* overlay bu elemana göre hizalansın */
    overflow: hidden; /* taşan ikonlar görünmesin */
}

/* overlay katman */
.topbar-animals[b-ydg4ni0tze] {
    position: absolute;
    inset: 0;
    pointer-events: none; /* tıklamayı engelleme */
    z-index: 5;
}

    /* ortak hayvan ayarları */
    .topbar-animals .animal[b-ydg4ni0tze] {
        position: absolute;
        bottom: 4px; /* topbar alt çizgisine otur */
        height: 28px; /* ikon yüksekliği */
        width: 42px; /* genişlik (SVG ölçekler) */
        opacity: 0;
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: contain;
        animation: walkAcross-b-ydg4ni0tze 18s linear infinite;
        filter: drop-shadow(0 1px 2px rgba(0,0,0,.22));
    }

        /* sırayla gelsinler */
        .topbar-animals .animal.cat[b-ydg4ni0tze] {
            left: -15%;
            animation-delay: 0s;
        }

        .topbar-animals .animal.dog[b-ydg4ni0tze] {
            left: -15%;
            animation-delay: 6s;
        }

        .topbar-animals .animal.bird[b-ydg4ni0tze] {
            left: -15%;
            animation-delay: 12s;
        }

/* soldan sağa yürüyüş */
@keyframes walkAcross-b-ydg4ni0tze {
    0% {
        transform: translateX(0);
        opacity: 0;
    }

    8% {
        opacity: 1;
    }

    92% {
        transform: translateX(140vw);
        opacity: 1;
    }

    100% {
        transform: translateX(140vw);
        opacity: 0;
    }
}

/* yan profil SVG’ler (GIF’ler) */
.animal.cat[b-ydg4ni0tze] {
    background-image: url('images/gif (4).gif');
}

.animal.dog[b-ydg4ni0tze] {
    background-image: url('images/gif (4).gif');
}

.animal.bird[b-ydg4ni0tze] {
    background-image: url('images/gif (4).gif');
}


.topbar-animals .animal[b-ydg4ni0tze] {
    position: absolute;
    bottom: 8px;
    left: -150px;
    width: 200px;
    height: 140px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.35));
    opacity: .95;
    animation: walkAcross-b-ydg4ni0tze 16s linear infinite;
}

    /* Her hayvan sırayla başlasın */
    .topbar-animals .animal.cat[b-ydg4ni0tze] {
        animation-delay: 0s;
    }

    .topbar-animals .animal.dog[b-ydg4ni0tze] {
        animation-delay: 16s;
    }

    .topbar-animals .animal.bird[b-ydg4ni0tze] {
        animation-delay: 32s;
    }

/* soldan sağa yürüyüş */
@keyframes walkAcross-b-ydg4ni0tze {
    0% {
        transform: translateX(0);
        opacity: 1;
    }

    80% {
        opacity: 1;
    }

    100% {
        transform: translateX(120vw);
        opacity: 0;
    }
}


/* hareket azaltma tercihi */
@media (prefers-reduced-motion: reduce) {
    .topbar-animals .animal[b-ydg4ni0tze] {
        animation: none;
        opacity: .45;
        left: 10%;
    }
}

/* /Components/Layout/Drawer.razor.rz.scp.css */
::deep .navigation-drawer[b-fcboubvjup] {
    height: 100vh;
    max-height: 100%;
}

[b-fcboubvjup] .panel-open:not(.mobile) .menu-button {
    display: none;
}

[b-fcboubvjup] .navigation-drawer > .dxbl-drawer-panel {
    background-image: linear-gradient(180deg, var(--bs-primary, var(--DS-primary-90)) 0%, var(--bs-black, #000) 150%);
}

[b-fcboubvjup] .navigation-drawer > .dxbl-drawer-content {
    height: 100vh;
    overflow: auto;
}

[b-fcboubvjup] .navigation-drawer > .dxbl-drawer-panel > .dxbl-drawer-header {
    border-bottom: none;
    padding: 2rem 1rem;
    background: none;
}

[b-fcboubvjup] .navigation-drawer > .dxbl-drawer-panel > .dxbl-drawer-header > .navigation-drawer-header {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

[b-fcboubvjup] .navigation-drawer > .dxbl-drawer-panel > .dxbl-drawer-body {
    --dxbl-drawer-panel-body-padding-x: 0;
    --dxbl-drawer-panel-body-padding-y: 1rem;
}

[b-fcboubvjup] .navigation-drawer > .dxbl-drawer-panel > .dxbl-drawer-footer {
    --dxbl-drawer-panel-footer-justify-content: center;
    border-top: none;
    padding-bottom: 1.5rem;
    width: 240px;
    background: none;
}

[b-fcboubvjup] .navigation-drawer > .dxbl-drawer-panel {
    display: flex;
}

[b-fcboubvjup] .navigation-drawer.mobile > .dxbl-drawer-panel {
    display: none;
}

[b-fcboubvjup] .navigation-drawer > .dxbl-drawer-content > .navigation-drawer-shading {
    display: none;
}

@media (max-width: 768px) {
    [b-fcboubvjup] .panel-open:not(.mobile) .menu-button {
        display: inline-flex;
    }

    [b-fcboubvjup] .navigation-drawer > .dxbl-drawer-panel {
        display: none;
    }

    [b-fcboubvjup] .navigation-drawer.mobile > .dxbl-drawer-panel {
        display: flex;
    }

    [b-fcboubvjup] .navigation-drawer > .dxbl-drawer-content > .navigation-drawer-shading {
        background-color: var(--dxbl-drawer-content-shading-bg);
        display: block;
        height: 100%;
        position: absolute;
        transition: ease var(--dxbl-drawer-animation-duration);
        transition-property: opacity, visibility;
        visibility: visible;
        width: 100%;
        z-index: 99;
        opacity: var(--dxbl-drawer-content-shading-opacity);
    }

    [b-fcboubvjup] .navigation-drawer.mobile.panel-closed .navigation-drawer-shading {
        opacity: 0;
        visibility: hidden;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-o0j8o22jyz] {
    height: 100%;
    font-family: var(--bs-font-sans-serif, var(--DS-font-family-sans-serif));
}

.logo[b-o0j8o22jyz] {
    text-align: center;
}

[b-o0j8o22jyz] .icon-back {
    --icon-mask-image: var(--icon-back-mask-image);
}

[b-o0j8o22jyz] .icon-close {
    --icon-mask-image: var(--icon-close-mask-image);
}

[b-o0j8o22jyz] .icon-menu {
    --icon-mask-image: var(--icon-menu-mask-image);
}


[b-o0j8o22jyz] .docs-icon {
    --icon-mask-image: var(--icon-docs-mask-image);
}

[b-o0j8o22jyz] .demos-icon {
    --icon-mask-image: var(--icon-demos-mask-image);
}

[b-o0j8o22jyz] .footer-button:hover .demos-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-o0j8o22jyz] .footer-button:hover .docs-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-o0j8o22jyz] .menu-button:hover .icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-o0j8o22jyz] .menu-button-nav:hover .icon {
    background-color: var(--dxbl-btn-hover-color);
}

.panel-open .menu-button[b-o0j8o22jyz] {
    display: inline-flex;
}

.nav-buttons-container[b-o0j8o22jyz] {
    display: flex;
    gap: 10px;
    padding: 2rem 1rem;
}

.nav-buttons-container[b-o0j8o22jyz]  .menubutton-float-end {
    margin-left: auto;
}

.fa[b-o0j8o22jyz] {
    font-size: 14px;
}

/* Page background with floating paws */
.page[b-o0j8o22jyz] {
    position: relative;
    overflow: hidden;
}

    .page[b-o0j8o22jyz]::before, .page[b-o0j8o22jyz]::after {
        content: '';
        position: fixed;
        width: 24px;
        height: 24px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(102,126,234,0.1)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        pointer-events: none;
        z-index: -1;
    }

    .page[b-o0j8o22jyz]::before {
        top: 20%;
        left: 10%;
        animation: floatPaw1-b-o0j8o22jyz 6s ease-in-out infinite;
    }

    .page[b-o0j8o22jyz]::after {
        top: 60%;
        right: 15%;
        width: 20px;
        height: 20px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(155,89,182,0.08)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
        animation: floatPaw2-b-o0j8o22jyz 8s ease-in-out infinite 2s;
    }

    /* Additional floating paws */
    .page .floating-paw-1[b-o0j8o22jyz], .page .floating-paw-2[b-o0j8o22jyz], .page .floating-paw-3[b-o0j8o22jyz] {
        content: '';
        position: fixed;
        width: 18px;
        height: 18px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(22,160,133,0.06)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        pointer-events: none;
        z-index: -1;
        opacity: 0.8;
    }

        .page .floating-paw-1[b-o0j8o22jyz]::before {
            content: '';
            position: fixed;
            top: 35%;
            left: 75%;
            width: 16px;
            height: 16px;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(142,68,173,0.07)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
            background-size: contain;
            background-repeat: no-repeat;
            pointer-events: none;
            z-index: -1;
            animation: floatPaw3-b-o0j8o22jyz 10s ease-in-out infinite 4s;
        }

        .page .floating-paw-2[b-o0j8o22jyz]::before {
            content: '';
            position: fixed;
            top: 80%;
            left: 25%;
            width: 14px;
            height: 14px;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(52,152,219,0.05)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
            background-size: contain;
            background-repeat: no-repeat;
            pointer-events: none;
            z-index: -1;
            animation: floatPaw4-b-o0j8o22jyz 7s ease-in-out infinite 1s;
        }

/* CSS Animations */
@keyframes floatPaw1-b-o0j8o22jyz {
    0%, 100% {
        transform: rotate(15deg) translateY(0px) scale(1);
        opacity: 0.1;
    }

    25% {
        transform: rotate(25deg) translateY(-10px) scale(1.1);
        opacity: 0.15;
    }

    50% {
        transform: rotate(5deg) translateY(-15px) scale(0.9);
        opacity: 0.2;
    }

    75% {
        transform: rotate(20deg) translateY(-5px) scale(1.05);
        opacity: 0.12;
    }
}

@keyframes floatPaw2-b-o0j8o22jyz {
    0%, 100% {
        transform: rotate(-20deg) translateX(0px) scale(1);
        opacity: 0.08;
    }

    33% {
        transform: rotate(-35deg) translateX(15px) scale(1.2);
        opacity: 0.12;
    }

    66% {
        transform: rotate(-10deg) translateX(-10px) scale(0.8);
        opacity: 0.15;
    }
}

@keyframes floatPaw3-b-o0j8o22jyz {
    0%, 100% {
        transform: rotate(30deg) translateX(0px) translateY(0px) scale(1);
        opacity: 0.07;
    }

    20% {
        transform: rotate(45deg) translateX(-20px) translateY(10px) scale(1.15);
        opacity: 0.1;
    }

    40% {
        transform: rotate(15deg) translateX(25px) translateY(-12px) scale(0.85);
        opacity: 0.12;
    }

    60% {
        transform: rotate(35deg) translateX(-15px) translateY(-8px) scale(1.1);
        opacity: 0.08;
    }

    80% {
        transform: rotate(20deg) translateX(18px) translateY(15px) scale(0.95);
        opacity: 0.09;
    }
}

@keyframes floatPaw4-b-o0j8o22jyz {
    0%, 100% {
        transform: rotate(-45deg) scale(1);
        opacity: 0.05;
    }

    30% {
        transform: rotate(-60deg) translateY(-20px) scale(1.3);
        opacity: 0.08;
    }

    70% {
        transform: rotate(-30deg) translateY(25px) scale(0.7);
        opacity: 0.1;
    }
}

/* Hover effects for floating paws */
.page:hover[b-o0j8o22jyz]::before {
    transform: rotate(45deg) translateX(20px) translateY(-15px) scale(1.2);
    opacity: 0.6;
}

.page:hover[b-o0j8o22jyz]::after {
    transform: rotate(-50deg) translateX(-25px) translateY(20px) scale(0.8);
    opacity: 0.4;
}

/* Top bar - Logo inspired professional gradient */
.dxbl-menu.text-bg-primary[b-o0j8o22jyz] {
    background: linear-gradient(135deg, #2c3e50 0%, #3498db 25%, #16a085 50%, #8e44ad 75%, #9b59b6 100%) !important;
    box-shadow: 0 4px 15px rgba(44, 62, 80, 0.3) !important;
    transition: all 0.3s ease !important;
}

/* Sidebar - Matching logo-inspired gradient */
.dxbl-drawer-body[b-o0j8o22jyz] {
    background: linear-gradient(180deg, #2c3e50 0%, #3498db 25%, #16a085 50%, #8e44ad 75%, #9b59b6 100%) !important;
    box-shadow: 2px 0 15px rgba(52, 152, 219, 0.2) !important;
}
.sidebar-paws[b-o0j8o22jyz] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 26px;
}

    .sidebar-paws .paw[b-o0j8o22jyz] {
        width: 28px;
        height: 28px;
        opacity: 0;
        transform: translate(var(--dx,0), 18px) scale(.92) rotate(-8deg);
        filter: drop-shadow(0 2px 3px rgba(0,0,0,.18));
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E") no-repeat center/contain;
        animation: paw-pop-b-o0j8o22jyz 4.2s infinite var(--delay,0s);
    }

        .sidebar-paws .paw:nth-child(2n)[b-o0j8o22jyz] {
            transform: translate(var(--dx,0), 18px) scale(.88) rotate(10deg);
        }

        .sidebar-paws .paw:nth-child(3n)[b-o0j8o22jyz] {
            transform: translate(var(--dx,0), 18px) scale(.95) rotate(-14deg);
        }

@keyframes paw-pop-b-o0j8o22jyz {
    0% {
        opacity: 0;
        transform: translate(var(--dx,0), 18px) scale(.92) rotate(-8deg);
    }

    12% {
        opacity: .55;
        transform: translate(var(--dx,0), 0px) scale(1.00) rotate(0deg);
    }

    28% {
        opacity: .35;
        transform: translate(calc(var(--dx,0) + 6px), -14px) scale(.96) rotate(6deg);
    }

    40% {
        opacity: 0;
        transform: translate(calc(var(--dx,0) + 10px), -22px) scale(.92) rotate(10deg);
    }

    100% {
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sidebar-paws .paw[b-o0j8o22jyz] {
        animation: none;
        opacity: .35;
    }
}

/* === TOPBAR YÜRÜYEN PATİLER — ADIM ADIM === */
.dxbl-menu.text-bg-primary[b-o0j8o22jyz] {
    position: relative;
    overflow: hidden;
}

.topbar-paws[b-o0j8o22jyz] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
}

    /* Ayarlanabilir değişkenler:
   --dur   : toplam tur süresi (yürüyüş yavaşlığı)
   --steps : adım sayısı (ne kadar “tırtıklı” ilerleyecek) */
    .topbar-paws .paw[b-o0j8o22jyz] {
        position: absolute;
        top: var(--y,50%); /* hat yüksekliği */
        left: -10vw; /* ekran dışından başlat */
        width: 22px;
        height: 22px;
        transform: translateY(-50%) rotate(var(--rot,0deg));
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E") no-repeat center/contain;
        filter: drop-shadow(0 1px 2px rgba(0,0,0,.25));
        opacity: 0;
        /* iki ayrı animasyon:
     1) yatay adım adım yürüyüş (steps)
     2) her adımda görünür olup iz gibi solma (steps) */
        --dur: 24s;
        --steps: 28; /* ne kadar adım? */
        animation: paw-walk-b-o0j8o22jyz var(--dur) steps(var(--steps)) infinite var(--delay,0s), paw-stamp-b-o0j8o22jyz var(--dur) steps(var(--steps)) infinite var(--delay,0s);
    }

        /* Ufak çeşitlilik */
        .topbar-paws .paw:nth-child(2n)[b-o0j8o22jyz] {
            transform: translateY(calc(-50% + 1px)) scale(.92) rotate(var(--rot,6deg));
        }

        .topbar-paws .paw:nth-child(3n)[b-o0j8o22jyz] {
            transform: translateY(calc(-50% - 1px)) scale(1.06) rotate(var(--rot,-8deg));
        }

/* Soldan sağa adım adım “snap” yürüyüş */
@keyframes paw-walk-b-o0j8o22jyz {
    from {
        transform: translateX(0) translateY(-50%) rotate(var(--rot,0deg));
    }

    to {
        transform: translateX(120vw) translateY(-50%) rotate(var(--rot,0deg));
    }
}

/* Her adımda kısa parlayıp iz bırakır gibi sönsün */
@keyframes paw-stamp-b-o0j8o22jyz {
    0% {
        opacity: 0;
    }

    2% {
        opacity: .95;
    }
    /* ayağı bastı */
    25% {
        opacity: .75;
    }
    /* iz kalır */
    50% {
        opacity: .45;
    }

    75% {
        opacity: .2;
    }

    100% {
        opacity: 0;
    }
    /* bir sonraki adıma geç */
}

/* 3 paralel hat — daha “yan yan” yürüyüş */
.topbar-paws .paw.track-1[b-o0j8o22jyz] {
    --y: 32%;
    --rot: -6deg;
}

.topbar-paws .paw.track-2[b-o0j8o22jyz] {
    --y: 52%;
    --rot: 4deg;
}

.topbar-paws .paw.track-3[b-o0j8o22jyz] {
    --y: 72%;
    --rot: -3deg;
}

/* Hareket azaltma tercihine saygı */
@media (prefers-reduced-motion: reduce) {
    .topbar-paws .paw[b-o0j8o22jyz] {
        animation: none;
        opacity: .35;
        left: 10%;
    }
}

/* === TOPBAR YAN PROFİL HAYVANLAR === */
.dxbl-menu.text-bg-primary[b-o0j8o22jyz] {
    position: relative; /* overlay bu elemana göre hizalansın */
    overflow: hidden; /* taşan ikonlar görünmesin */
}

/* overlay katman */
.topbar-animals[b-o0j8o22jyz] {
    position: absolute;
    inset: 0;
    pointer-events: none; /* tıklamayı engelleme */
    z-index: 5;
}

    /* ortak hayvan ayarları */
    .topbar-animals .animal[b-o0j8o22jyz] {
        position: absolute;
        bottom: 4px; /* topbar alt çizgisine otur */
        height: 28px; /* ikon yüksekliği */
        width: 42px; /* genişlik (SVG ölçekler) */
        opacity: 0;
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: contain;
        animation: walkAcross-b-o0j8o22jyz 18s linear infinite;
        filter: drop-shadow(0 1px 2px rgba(0,0,0,.22));
    }

        /* sırayla gelsinler */
        .topbar-animals .animal.cat[b-o0j8o22jyz] {
            left: -15%;
            animation-delay: 0s;
        }

        .topbar-animals .animal.dog[b-o0j8o22jyz] {
            left: -15%;
            animation-delay: 6s;
        }

        .topbar-animals .animal.bird[b-o0j8o22jyz] {
            left: -15%;
            animation-delay: 12s;
        }

/* soldan sağa yürüyüş */
@keyframes walkAcross-b-o0j8o22jyz {
    0% {
        transform: translateX(0);
        opacity: 0;
    }

    8% {
        opacity: 1;
    }

    92% {
        transform: translateX(140vw);
        opacity: 1;
    }

    100% {
        transform: translateX(140vw);
        opacity: 0;
    }
}

/* yan profil SVG’ler (GIF’ler) */
.animal.cat[b-o0j8o22jyz] {
    background-image: url('images/gif (4).gif');
}

.animal.dog[b-o0j8o22jyz] {
    background-image: url('images/gif (4).gif');
}

.animal.bird[b-o0j8o22jyz] {
    background-image: url('images/gif (4).gif');
}


.topbar-animals .animal[b-o0j8o22jyz] {
    position: absolute;
    bottom: 8px;
    left: -150px;
    width: 200px;
    height: 140px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.35));
    opacity: .95;
    animation: walkAcross-b-o0j8o22jyz 16s linear infinite;
}

    /* Her hayvan sırayla başlasın */
    .topbar-animals .animal.cat[b-o0j8o22jyz] {
        animation-delay: 0s;
    }

    .topbar-animals .animal.dog[b-o0j8o22jyz] {
        animation-delay: 16s;
    }

    .topbar-animals .animal.bird[b-o0j8o22jyz] {
        animation-delay: 32s;
    }

/* soldan sağa yürüyüş */
@keyframes walkAcross-b-o0j8o22jyz {
    0% {
        transform: translateX(0);
        opacity: 1;
    }

    80% {
        opacity: 1;
    }

    100% {
        transform: translateX(120vw);
        opacity: 0;
    }
}


/* hareket azaltma tercihi */
@media (prefers-reduced-motion: reduce) {
    .topbar-animals .animal[b-o0j8o22jyz] {
        animation: none;
        opacity: .45;
        left: 10%;
    }
}

/* /Components/Layout/NavMenu.razor.rz.scp.css */
[b-jx4g3ckt1g] .menu.display-mobile {
    margin-bottom: 2rem;
}

[b-jx4g3ckt1g] .menu {
    --dxbl-menu-bottom-left-border-radius: 0;
    --dxbl-menu-bottom-right-border-radius: 0;
    --dxbl-menu-top-left-border-radius: 0;
    --dxbl-menu-top-right-border-radius: 0;

    background-color: inherit;
}

[b-jx4g3ckt1g] .menu .dxbl-menu-item-list {
    gap: 0.5rem;
}

[b-jx4g3ckt1g] .menu-item {
    color: var(--bs-white, #fff);
}

[b-jx4g3ckt1g] .icon {
    margin-left: 0.5rem;
}

[b-jx4g3ckt1g] .home-icon {
    --icon-mask-image: var(--icon-home-mask-image);
}

[b-jx4g3ckt1g] .weather-icon {
    --icon-mask-image: var(--icon-weather-mask-image);
}

[b-jx4g3ckt1g] .counter-icon {
    --icon-mask-image: var(--icon-counter-mask-image);
}


@media (max-width: 768px) {
    #sidebar[b-jx4g3ckt1g] {
        min-width: inherit;
        max-width: inherit;
        display: block;
    }

    .logo[b-jx4g3ckt1g] {
        text-align: inherit;
    }
}
/* /Components/Pages/Index.razor.rz.scp.css */
[b-1n645ynr0s] .welcome-gridlayout {
    margin: auto;
    width: auto;
    height: auto;
}

    [b-1n645ynr0s] .welcome-gridlayout .dxbl-gridlayout-root {
        align-content: center;
        justify-content: center;
    }

[b-1n645ynr0s] .title {
    text-align: center;
}

[b-1n645ynr0s] .welcome-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    justify-content: center;
}

[b-1n645ynr0s] .welcome-card {
    width: 26.25rem;
    height: 15rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.2s;
    border-radius: 1rem;
    color: var(--bs-link-color, var(--DS-primary-90));
    gap: 1.5rem;
    text-decoration: none;
    position: relative;
}

    [b-1n645ynr0s] .welcome-card:hover {
        box-shadow: 0px 20px 25px -5px rgba(0, 0, 0, 0.1), 0px 8px 10px -6px rgba(0, 0, 0, 0.1);
    }

    [b-1n645ynr0s] .welcome-card .welcome-card-img {
        width: 6.5rem;
        height: 6.5rem;
    }

    [b-1n645ynr0s] .welcome-card .welcome-card-text {
        font-size: 1.75rem;
        font-weight: 600;
        letter-spacing: 0em;
        text-align: center;
        text-decoration: unset;
    }

    [b-1n645ynr0s] .welcome-card .welcome-card-back {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--bs-body-color, var(--DS-color-content-neutral-default-rest));
        opacity: 0.05;
        border-radius: 1rem;
        z-index: -2;
    }

.page-title[b-1n645ynr0s] {
    background: white;
    padding: 1rem 2rem;
    border-bottom: 1px solid #e9ecef;
    text-align: left;
    position: relative;
    z-index: 10;
}

    .page-title h1[b-1n645ynr0s] {
        font-size: 1.5rem;
        font-weight: 600;
        color: #2c3e50;
        margin: 0;
    }

/* Floating Paws Animation */
.floating-paws[b-1n645ynr0s] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
    overflow: hidden;
}

.paw[b-1n645ynr0s] {
    position: absolute;
    width: 30px;
    height: 30px;
    opacity: 0;
    background-size: contain;
    background-repeat: no-repeat;
    animation: floatPaws-b-1n645ynr0s 8s infinite ease-in-out;
}

    /* Many different paw locations and colors */
    .paw:nth-child(1)[b-1n645ynr0s] {
        top: 5%;
        left: 3%;
        animation-delay: 0s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23667eea'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(2)[b-1n645ynr0s] {
        top: 12%;
        right: 6%;
        animation-delay: 0.5s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f093fb'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(3)[b-1n645ynr0s] {
        top: 25%;
        left: 85%;
        animation-delay: 1s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234facfe'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(4)[b-1n645ynr0s] {
        top: 38%;
        left: 12%;
        animation-delay: 1.5s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2327ae60'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(5)[b-1n645ynr0s] {
        top: 52%;
        right: 18%;
        animation-delay: 2s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e74c3c'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(6)[b-1n645ynr0s] {
        top: 68%;
        left: 35%;
        animation-delay: 2.5s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23764ba2'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(7)[b-1n645ynr0s] {
        top: 82%;
        right: 8%;
        animation-delay: 3s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f5576c'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(8)[b-1n645ynr0s] {
        top: 18%;
        left: 55%;
        animation-delay: 3.5s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2300f2fe'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(9)[b-1n645ynr0s] {
        top: 45%;
        left: 78%;
        animation-delay: 4s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ff6b6b'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(10)[b-1n645ynr0s] {
        top: 92%;
        left: 22%;
        animation-delay: 4.5s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%239b59b6'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(11)[b-1n645ynr0s] {
        top: 8%;
        left: 72%;
        animation-delay: 5s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f39c12'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(12)[b-1n645ynr0s] {
        top: 62%;
        right: 42%;
        animation-delay: 5.5s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233498db'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(13)[b-1n645ynr0s] {
        top: 32%;
        left: 5%;
        animation-delay: 6s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e67e22'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(14)[b-1n645ynr0s] {
        top: 78%;
        left: 65%;
        animation-delay: 6.5s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2316a085'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(15)[b-1n645ynr0s] {
        top: 22%;
        right: 28%;
        animation-delay: 7s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23d63031'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

    .paw:nth-child(16)[b-1n645ynr0s] {
        top: 88%;
        right: 62%;
        animation-delay: 7.5s;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230984e3'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    }

@keyframes floatPaws-b-1n645ynr0s {
    0%, 100% {
        opacity: 0;
        transform: translateY(0px) rotate(0deg) scale(1);
    }

    25% {
        opacity: 0.5;
        transform: translateY(-12px) rotate(10deg) scale(1.1);
    }

    50% {
        opacity: 0.7;
        transform: translateY(-20px) rotate(-6deg) scale(0.9);
    }

    75% {
        opacity: 0.3;
        transform: translateY(-8px) rotate(15deg) scale(1.05);
    }
}
/* /Components/Routes.razor.rz.scp.css */
body[b-1fkkr63rar] {
}
/* DevExpress spinner ve default Loading yazısı gizle */
.paw-splash .dxbl-spinner[b-1fkkr63rar],
.paw-splash .dxbl-loading-indicator[b-1fkkr63rar],
.paw-splash .dxbl-loading-text[b-1fkkr63rar] {
    display: none !important;
}

/* Arkaplan */
.paw-overlay[b-1fkkr63rar] {
    position: fixed;
    inset: 0;
    z-index: 2147483600;
    background: linear-gradient(135deg, #5AA9FF 0%, #3DDC97 45%, #B76CFD 100%);
    opacity: .96;
    overflow: hidden;
}

/* Ortadaki kart */
.paw-card[b-1fkkr63rar] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    padding: 1rem 1.2rem;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 16px;
    backdrop-filter: blur(6px);
    box-shadow: 0 10px 28px rgba(0,0,0,.18);
}

.paw-logo[b-1fkkr63rar] {
    width: min(40vw,200px);
}

.paw-title[b-1fkkr63rar] {
    color: #fff;
    font: 600 1rem/1.3 system-ui;
    text-shadow: 0 1px 2px rgba(0,0,0,.25);
}

/* Pati izi hattı */
.paw-trail[b-1fkkr63rar] {
    position: absolute;
    bottom: 12vh;
    width: 100%;
    height: 15vh;
    pointer-events: none;
}

.paw[b-1fkkr63rar] {
    --size: clamp(22px, 3vw, 36px);
    position: absolute;
    width: var(--size);
    height: var(--size);
    opacity: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 128'%3E%3Cg fill='%23fff' fill-opacity='0.92'%3E%3Ccircle cx='32' cy='36' r='14'/%3E%3Ccircle cx='54' cy='26' r='12'/%3E%3Ccircle cx='74' cy='26' r='12'/%3E%3Ccircle cx='96' cy='36' r='14'/%3E%3Cpath d='M64 46c-18 0-36 10-36 26 0 14 12 26 36 26s36-12 36-26c0-16-18-26-36-26z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain;
    filter: drop-shadow(0 4px 10px rgba(0,0,0,.25));
    animation: paw-step-b-1fkkr63rar 2.2s ease-in-out infinite;
}

/* Konumlar */
.p1[b-1fkkr63rar] {
    left: 10%;
    top: 50%;
    animation-delay: 0s;
}

.p2[b-1fkkr63rar] {
    left: 25%;
    top: 60%;
    animation-delay: .2s;
}

.p3[b-1fkkr63rar] {
    left: 40%;
    top: 50%;
    animation-delay: .4s;
}

.p4[b-1fkkr63rar] {
    left: 55%;
    top: 60%;
    animation-delay: .6s;
}

.p5[b-1fkkr63rar] {
    left: 70%;
    top: 50%;
    animation-delay: .8s;
}

.p6[b-1fkkr63rar] {
    left: 85%;
    top: 60%;
    animation-delay: 1s;
}

@keyframes paw-step-b-1fkkr63rar {
    0% {
        opacity: 0;
        transform: translateY(8px) scale(.8);
    }

    20% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

    80% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

    100% {
        opacity: 0;
        transform: translateY(-8px) scale(1.1);
    }
}
/* /Components/Views/Auths/LoginView.razor.rz.scp.css */
/* Modern login page styling - full page utilization */
body[b-n5qp3u25kd], html[b-n5qp3u25kd] {
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
}

.login-container[b-n5qp3u25kd] {
    min-height: 100vh;
    width: 100vw;
    background: linear-gradient(135deg, #5AA9FF 0%, #3DDC97 45%, #B76CFD 100%) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

    /* Animated background paws for login */
    .login-container[b-n5qp3u25kd]::before {
        content: '';
        position: absolute;
        width: 80px;
        height: 80px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(255,255,255,0.4)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        animation: pawMoveLtoR-b-n5qp3u25kd 12s linear infinite;
        pointer-events: none;
        z-index: 1;
    }

    .login-container[b-n5qp3u25kd]::after {
        content: '';
        position: absolute;
        width: 60px;
        height: 60px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(255,255,255,0.3)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        animation: pawMoveRtoL-b-n5qp3u25kd 15s linear infinite 3s;
        pointer-events: none;
        z-index: 1;
    }

/* Additional floating paws with higher visibility */
.floating-paw-1[b-n5qp3u25kd]::before {
    content: '';
    position: fixed;
    width: 45px;
    height: 45px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(22,160,133,0.5)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    animation: pawMoveDiagonal1-b-n5qp3u25kd 18s linear infinite 6s;
    pointer-events: none;
    z-index: 1;
}

.floating-paw-2[b-n5qp3u25kd]::before {
    content: '';
    position: fixed;
    width: 35px;
    height: 35px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(142,68,173,0.4)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    animation: pawMoveVertical-b-n5qp3u25kd 10s linear infinite 9s;
    pointer-events: none;
    z-index: 1;
}

.floating-paw-3[b-n5qp3u25kd]::before {
    content: '';
    position: fixed;
    width: 50px;
    height: 50px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(52,152,219,0.35)'%3E%3Cpath d='M8.5 8.5C9.88 8.5 11 7.38 11 6S9.88 3.5 8.5 3.5 6 4.62 6 6 7.12 8.5 8.5 8.5M15.5 8.5C16.88 8.5 18 7.38 18 6S16.88 3.5 15.5 3.5 13 4.62 13 6 14.12 8.5 15.5 8.5M6 12C7.38 12 8.5 10.88 8.5 9.5S7.38 7 6 7 3.5 8.12 3.5 9.5 4.62 12 6 12M18 12C19.38 12 20.5 10.88 20.5 9.5S19.38 7 18 7 15.5 8.12 15.5 9.5 16.62 12 18 12M12 20C15.31 20 18 17.31 18 14S15.31 8 12 8 6 10.69 6 14 8.69 20 12 20Z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    animation: pawMoveDiagonal2-b-n5qp3u25kd 20s linear infinite 2s;
    pointer-events: none;
    z-index: 1;
}

/* Glass morphism login card */
.login-card[b-n5qp3u25kd] {
    background: rgba(255,255,255,0.22);
    border: 1px solid rgba(255,255,255,0.35);
    /*    background: rgba(255, 255, 255, 0.15);*/
    backdrop-filter: blur(20px);
    border-radius: 20px;
    /*    border: 1px solid rgba(255, 255, 255, 0.2);*/
    padding: 2.5rem;
    max-width: 420px;
    width: 90%;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
    animation: cardSlideIn-b-n5qp3u25kd 0.8s ease-out;
    position: relative;
    z-index: 10;
}

/* Form styling */
.login-form[b-n5qp3u25kd] {
    animation: formFadeIn-b-n5qp3u25kd 1s ease-out 0.6s both;
}

    /* Ultra specific selectors - brute force approach */
    * .dx-textbox[b-n5qp3u25kd],
    * .dx-texteditor[b-n5qp3u25kd],
    * .dx-texteditor-input-container[b-n5qp3u25kd],
    * .dx-field-item .dx-textbox[b-n5qp3u25kd],
    * .dx-field-item .dx-texteditor[b-n5qp3u25kd],
    .login-container * .dx-textbox[b-n5qp3u25kd],
    .login-container * .dx-texteditor[b-n5qp3u25kd],
    .login-form * .dx-textbox[b-n5qp3u25kd],
    .login-form * .dx-texteditor[b-n5qp3u25kd],
    div[data-dx_placeholder] input[b-n5qp3u25kd],
    input[type="text"][b-n5qp3u25kd],
    input[type="password"][b-n5qp3u25kd] {
        background: rgba(255, 255, 255, 0.95) !important;
        border: 2px solid rgba(255, 255, 255, 0.4) !important;
        border-radius: 16px !important;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
        min-height: 45px !important;
        padding: 15px 20px !important;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #2c3e50 !important;
    }

        * .dx-textbox:hover[b-n5qp3u25kd],
        * .dx-texteditor:hover[b-n5qp3u25kd],
        .login-container * input:hover[b-n5qp3u25kd],
        .login-form * input:hover[b-n5qp3u25kd] {
            border-color: rgba(255, 255, 255, 0.7) !important;
            background: rgba(255, 255, 255, 1) !important;
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
            transform: translateY(-2px) !important;
        }

        * .dx-textbox:focus[b-n5qp3u25kd],
        * .dx-texteditor:focus[b-n5qp3u25kd],
        * input:focus[b-n5qp3u25kd] {
            border-color: rgba(102, 126, 234, 0.8) !important;
            background: rgba(255, 255, 255, 1) !important;
            box-shadow: 0 12px 40px rgba(102, 126, 234, 0.3), 0 0 0 3px rgba(102, 126, 234, 0.1) !important;
            transform: translateY(-3px) !important;
            outline: none !important;
        }

    /* Ultra specific button selectors */
    * button[b-n5qp3u25kd],
    * .dx-button[b-n5qp3u25kd],
    * .dx-button-mode-contained[b-n5qp3u25kd],
    .login-container * button[b-n5qp3u25kd],
    .login-form * button[b-n5qp3u25kd],
    button[type="button"][b-n5qp3u25kd],
    input[type="submit"][b-n5qp3u25kd] {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #8e44ad 100%) !important;
        border: none !important;
        border-radius: 16px !important;
        min-height: 50px !important;
        padding: 16px 40px !important;
        font-weight: 700 !important;
        font-size: 16px !important;
        letter-spacing: 1px !important;
        text-transform: uppercase !important;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
        box-shadow: 0 12px 35px rgba(102, 126, 234, 0.4), 0 4px 15px rgba(0, 0, 0, 0.1) !important;
        position: relative !important;
        overflow: hidden !important;
        cursor: pointer !important;
        width: 100% !important;
        color: white !important;
    }

        * button:hover[b-n5qp3u25kd],
        * .dx-button:hover[b-n5qp3u25kd],
        .login-container * button:hover[b-n5qp3u25kd],
        .login-form * button:hover[b-n5qp3u25kd] {
            transform: translateY(-4px) !important;
            box-shadow: 0 20px 50px rgba(102, 126, 234, 0.6), 0 8px 25px rgba(0, 0, 0, 0.15) !important;
            background: linear-gradient(135deg, #5a6fd8 0%, #6b4190 50%, #7d3c98 100%) !important;
        }

    /* Ultra specific label selectors */
    * label[b-n5qp3u25kd],
    * .dx-field-label[b-n5qp3u25kd],
    * .dx-formlayout-label[b-n5qp3u25kd],
    .login-container * label[b-n5qp3u25kd],
    .login-form * label[b-n5qp3u25kd],
    .dx-field-item-label[b-n5qp3u25kd] {
        color: rgba(255, 255, 255, 0.95) !important;
        font-weight: 600 !important;
        font-size: 14px !important;
        margin-bottom: 10px !important;
        text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
        letter-spacing: 0.5px !important;
        text-transform: uppercase !important;
        display: block !important;
    }

    /* Extra specific DevExpress selectors for guaranteed styling */
    .login-container .dx-textbox[b-n5qp3u25kd],
    .login-container .dx-texteditor[b-n5qp3u25kd],
    .login-container .dx-texteditor-input-container[b-n5qp3u25kd],
    .login-form .dx-textbox[b-n5qp3u25kd],
    .login-form .dx-texteditor[b-n5qp3u25kd],
    .login-form .dx-texteditor-input-container[b-n5qp3u25kd] {
        background: rgba(255, 255, 255, 0.95) !important;
        border: 2px solid rgba(255, 255, 255, 0.4) !important;
        border-radius: 16px !important;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
        min-height: 50px !important;
    }

        .login-container .dx-textbox:hover[b-n5qp3u25kd],
        .login-container .dx-texteditor:hover[b-n5qp3u25kd],
        .login-form .dx-textbox:hover[b-n5qp3u25kd],
        .login-form .dx-texteditor:hover[b-n5qp3u25kd] {
            border-color: rgba(255, 255, 255, 0.7) !important;
            background: rgba(255, 255, 255, 1) !important;
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
            transform: translateY(-2px) !important;
        }

        .login-container .dx-textbox.dx-state-focused[b-n5qp3u25kd],
        .login-container .dx-texteditor.dx-state-focused[b-n5qp3u25kd],
        .login-form .dx-textbox.dx-state-focused[b-n5qp3u25kd],
        .login-form .dx-texteditor.dx-state-focused[b-n5qp3u25kd] {
            border-color: rgba(102, 126, 234, 0.8) !important;
            background: rgba(255, 255, 255, 1) !important;
            box-shadow: 0 12px 40px rgba(102, 126, 234, 0.3), 0 0 0 3px rgba(102, 126, 234, 0.1) !important;
            transform: translateY(-3px) !important;
        }

/* Form labels with DevExpress class names */
.dx-field-label[b-n5qp3u25kd],
.dx-formlayout-label-location-top .dx-field-item-label-content[b-n5qp3u25kd] {
    color: rgba(255, 255, 255, 0.95) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    margin-bottom: 10px !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
}

/* Extra specific label selectors */
.login-container .dx-field-item-label[b-n5qp3u25kd],
.login-container .dx-field-label[b-n5qp3u25kd],
.login-container .dx-formlayout-label[b-n5qp3u25kd],
.login-form .dx-field-item-label[b-n5qp3u25kd],
.login-form .dx-field-label[b-n5qp3u25kd],
.login-form .dx-formlayout-label[b-n5qp3u25kd],
.dx-formlayout-label-location-top .dx-field-item-label-content[b-n5qp3u25kd] {
    color: rgba(255, 255, 255, 0.95) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    margin-bottom: 10px !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
}

/* Modern gradient button with DevExpress class names */
.dx-button.dx-button-mode-contained.dx-button-default[b-n5qp3u25kd],
.dx-button.dx-button-mode-contained.dx-button-success[b-n5qp3u25kd] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #8e44ad 100%) !important;
    border: none !important;
    border-radius: 16px !important;
    min-height: 55px !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 12px 35px rgba(102, 126, 234, 0.4), 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    position: relative !important;
    overflow: hidden !important;
    cursor: pointer !important;
    width: 100% !important;
}

.dx-button.dx-button-mode-contained .dx-button-content[b-n5qp3u25kd] {
    padding: 16px 40px !important;
    color: white !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

.dx-button.dx-button-mode-contained[b-n5qp3u25kd]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    transition: left 0.6s ease;
    z-index: 1;
}

.dx-button.dx-button-mode-contained:hover[b-n5qp3u25kd] {
    transform: translateY(-4px) !important;
    box-shadow: 0 20px 50px rgba(102, 126, 234, 0.6), 0 8px 25px rgba(0, 0, 0, 0.15) !important;
    background: linear-gradient(135deg, #5a6fd8 0%, #6b4190 50%, #7d3c98 100%) !important;
}

    .dx-button.dx-button-mode-contained:hover[b-n5qp3u25kd]::before {
        left: 100%;
    }

.dx-button.dx-button-mode-contained:active[b-n5qp3u25kd] {
    transform: translateY(-2px) !important;
    box-shadow: 0 15px 40px rgba(102, 126, 234, 0.5), 0 6px 20px rgba(0, 0, 0, 0.12) !important;
}

/* Extra specific button selectors */
.login-container .dx-button[b-n5qp3u25kd],
.login-container .dx-button.dx-button-mode-contained[b-n5qp3u25kd],
.login-form .dx-button[b-n5qp3u25kd],
.login-form .dx-button.dx-button-mode-contained[b-n5qp3u25kd],
div[data-render-style="Primary"][b-n5qp3u25kd] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #8e44ad 100%) !important;
    border: none !important;
    border-radius: 16px !important;
    min-height: 55px !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 12px 35px rgba(102, 126, 234, 0.4), 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    position: relative !important;
    overflow: hidden !important;
    cursor: pointer !important;
    width: 100% !important;
    color: white !important;
}

    .login-container .dx-button:hover[b-n5qp3u25kd],
    .login-form .dx-button:hover[b-n5qp3u25kd],
    div[data-render-style="Primary"]:hover[b-n5qp3u25kd] {
        transform: translateY(-4px) !important;
        box-shadow: 0 20px 50px rgba(102, 126, 234, 0.6), 0 8px 25px rgba(0, 0, 0, 0.15) !important;
        background: linear-gradient(135deg, #5a6fd8 0%, #6b4190 50%, #7d3c98 100%) !important;
    }

/* Responsive adjustments */
@media (max-width: 480px) {
    .login-card[b-n5qp3u25kd] {
        padding: 2rem;
        margin: 20px;
    }

    .login-form[b-n5qp3u25kd]  .dx-textbox {
        padding: 12px 16px !important;
        font-size: 14px !important;
    }

    .login-form[b-n5qp3u25kd]  .dx-btn-primary {
        padding: 14px 30px !important;
        font-size: 14px !important;
    }
}

/* Animations for realistic walking paw movement */
@keyframes pawMoveLtoR-b-n5qp3u25kd {
    0% {
        left: 5%;
        top: 30%;
        transform: rotate(0deg);
        opacity: 0.5;
    }

    15% {
        opacity: 0.5;
        transform: rotate(5deg);
    }

    20% {
        opacity: 0;
        transform: rotate(10deg);
    }

    25% {
        left: 25%;
        top: 35%;
        opacity: 0.5;
        transform: rotate(-5deg);
    }

    40% {
        opacity: 0.5;
        transform: rotate(0deg);
    }

    45% {
        opacity: 0;
        transform: rotate(5deg);
    }

    50% {
        left: 50%;
        top: 32%;
        opacity: 0.5;
        transform: rotate(-10deg);
    }

    65% {
        opacity: 0.5;
        transform: rotate(0deg);
    }

    70% {
        opacity: 0;
        transform: rotate(8deg);
    }

    75% {
        left: 75%;
        top: 28%;
        opacity: 0.5;
        transform: rotate(-3deg);
    }

    90% {
        opacity: 0.5;
        transform: rotate(2deg);
    }

    100% {
        left: 95%;
        top: 30%;
        transform: rotate(0deg);
        opacity: 0;
    }
}

@keyframes pawMoveRtoL-b-n5qp3u25kd {
    0% {
        right: 5%;
        top: 65%;
        transform: rotate(0deg);
        opacity: 0.4;
    }

    15% {
        opacity: 0.4;
        transform: rotate(-8deg);
    }

    20% {
        opacity: 0;
        transform: rotate(-15deg);
    }

    25% {
        right: 25%;
        top: 62%;
        opacity: 0.4;
        transform: rotate(10deg);
    }

    40% {
        opacity: 0.4;
        transform: rotate(0deg);
    }

    45% {
        opacity: 0;
        transform: rotate(-12deg);
    }

    50% {
        right: 50%;
        top: 68%;
        opacity: 0.4;
        transform: rotate(15deg);
    }

    65% {
        opacity: 0.4;
        transform: rotate(0deg);
    }

    70% {
        opacity: 0;
        transform: rotate(-8deg);
    }

    75% {
        right: 75%;
        top: 65%;
        opacity: 0.4;
        transform: rotate(5deg);
    }

    90% {
        opacity: 0.4;
        transform: rotate(-2deg);
    }

    100% {
        right: 95%;
        top: 63%;
        transform: rotate(0deg);
        opacity: 0;
    }
}

@keyframes pawMoveDiagonal1-b-n5qp3u25kd {
    0% {
        left: 15%;
        top: 15%;
        transform: rotate(45deg);
        opacity: 0.5;
    }

    18% {
        opacity: 0.5;
        transform: rotate(50deg);
    }

    22% {
        opacity: 0;
        transform: rotate(55deg);
    }

    28% {
        left: 30%;
        top: 25%;
        opacity: 0.5;
        transform: rotate(40deg);
    }

    45% {
        opacity: 0.5;
        transform: rotate(45deg);
    }

    50% {
        opacity: 0;
        transform: rotate(50deg);
    }

    55% {
        left: 50%;
        top: 45%;
        opacity: 0.6;
        transform: rotate(35deg);
    }

    72% {
        opacity: 0.5;
        transform: rotate(40deg);
    }

    77% {
        opacity: 0;
        transform: rotate(45deg);
    }

    82% {
        left: 70%;
        top: 65%;
        opacity: 0.5;
        transform: rotate(30deg);
    }

    95% {
        opacity: 0.4;
        transform: rotate(35deg);
    }

    100% {
        left: 85%;
        top: 80%;
        transform: rotate(45deg);
        opacity: 0;
    }
}

@keyframes pawMoveVertical-b-n5qp3u25kd {
    0% {
        left: 80%;
        top: 10%;
        transform: rotate(-20deg);
        opacity: 0.4;
    }

    20% {
        opacity: 0.4;
        transform: rotate(-25deg);
    }

    25% {
        opacity: 0;
        transform: rotate(-30deg);
    }

    30% {
        left: 78%;
        top: 30%;
        opacity: 0.5;
        transform: rotate(-15deg);
    }

    50% {
        opacity: 0.5;
        transform: rotate(-20deg);
    }

    55% {
        opacity: 0;
        transform: rotate(-25deg);
    }

    60% {
        left: 76%;
        top: 55%;
        opacity: 0.5;
        transform: rotate(-10deg);
    }

    80% {
        opacity: 0.4;
        transform: rotate(-15deg);
    }

    85% {
        opacity: 0;
        transform: rotate(-20deg);
    }

    90% {
        left: 74%;
        top: 80%;
        opacity: 0.4;
        transform: rotate(-25deg);
    }

    100% {
        left: 72%;
        top: 95%;
        transform: rotate(-30deg);
        opacity: 0;
    }
}

@keyframes pawMoveDiagonal2-b-n5qp3u25kd {
    0% {
        right: 20%;
        top: 85%;
        transform: rotate(120deg);
        opacity: 0.35;
    }

    18% {
        opacity: 0.35;
        transform: rotate(125deg);
    }

    23% {
        opacity: 0;
        transform: rotate(130deg);
    }

    28% {
        right: 35%;
        top: 70%;
        opacity: 0.4;
        transform: rotate(115deg);
    }

    45% {
        opacity: 0.4;
        transform: rotate(120deg);
    }

    50% {
        opacity: 0;
        transform: rotate(125deg);
    }

    55% {
        right: 55%;
        top: 50%;
        opacity: 0.45;
        transform: rotate(110deg);
    }

    72% {
        opacity: 0.4;
        transform: rotate(115deg);
    }

    77% {
        opacity: 0;
        transform: rotate(120deg);
    }

    82% {
        right: 75%;
        top: 30%;
        opacity: 0.35;
        transform: rotate(105deg);
    }

    95% {
        opacity: 0.3;
        transform: rotate(110deg);
    }

    100% {
        right: 90%;
        top: 15%;
        transform: rotate(135deg);
        opacity: 0;
    }
}

@keyframes cardSlideIn-b-n5qp3u25kd {
    from {
        opacity: 0;
        transform: translateY(50px) scale(0.9);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes formFadeIn-b-n5qp3u25kd {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Views/Auths/NotAuthorizedView.razor.rz.scp.css */
@media (prefers-color-scheme: dark) {
    : root[b-dww10ttn8s] {
        --bg-1: #0f1320;
        --bg-2: #0f1b22;
        --ink: #eaf2ff;
        --muted: #a8b7d6;
        --card: #101722cc;
        --stroke: #22324a;
        --shadow: 0 18px 40px rgba(0,0,0,.45)
    }
}
@media (max-width:820px) {
    .inner[b-dww10ttn8s] {
        grid-template-columns: 1fr
    }
}
@media (prefers-color-scheme: dark) {
    :root[b-dww10ttn8s] {
        --bg-1: #0f1320;
        --bg-2: #0f1b22;
        --ink: #eaf2ff;
        --muted: #a8b7d6;
        --card: #101722cc;
        --stroke: #22324a;
        --shadow: 0 18px 40px rgba(0,0,0,.45)
    }
}
@media (max-width:520px) {
    :root[b-dww10ttn8s] {
        --paw-size: 72px
    }

    .card[b-dww10ttn8s]::before {
        display: none
    }
    /* mobile’da tek pati */
}