/*
* demo.css
* File include item demo only specific css only
******************************************************************************/

.menu .app-brand.demo {
  height: 64px;
}

.app-brand-logo.demo svg {
  width: 100px;
  height: auto;
}

.app-brand-text.demo {
  font-size: 1.375rem;
}

[data-bs-theme="dark"] option {
	background: #484a5d;
    color: #cfcde4;
  }

/* ! For .layout-navbar-fixed added fix padding top to .layout-page */
/* Default navbar */
.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
  padding-top: 64px !important;
}
.layout-navbar-fixed .layout-wrapper:not(.layout-horizontal):not(.layout-without-menu) .layout-page {
  padding-top: 72px !important;
}
/* Navbar page z-index issue solution */
.content-wrapper .navbar {
  z-index: auto;
}

/*
* Content
******************************************************************************/

.demo-blocks > * {
  display: block !important;
}

.demo-inline-spacing > * {
  margin: 1rem 0.375rem 0 0 !important;
}

/* ? .demo-vertical-spacing class is used to have vertical margins between elements. To remove margin-top from the first-child, use .demo-only-element class with .demo-vertical-spacing class. For example, we have used this class in forms-input-groups.html file. */
.demo-vertical-spacing > * {
  margin-top: 1rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-lg > * {
  margin-top: 1.875rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-lg.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-xl > * {
  margin-top: 5rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-xl.demo-only-element > :first-child {
  margin-top: 0 !important;
}

/* Dropdown buttons going out of small screens */
@media (max-width: 576px) {
  #dropdown-variation-demo .btn-group .text-truncate {
    width: 254px;
    position: relative;
  }
  #dropdown-variation-demo .btn-group .text-truncate::after {
    position: absolute;
    top: 45%;
    right: 0.65rem;
  }
}

/*
* Layout demo
******************************************************************************/

.layout-demo-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 1rem;
}
.layout-demo-placeholder img {
  width: 900px;
}
.layout-demo-info {
  text-align: center;
  margin-top: 1rem;
}


/* RechNext Wa UI layer - visual styles only */
body{background:radial-gradient(circle at 10% 10%,rgba(168,85,247,.12),transparent 28%),radial-gradient(circle at 90% 20%,rgba(236,72,153,.10),transparent 30%),#0b0d18!important}
#layout-menu,.layout-navbar,.navbar-detached,.rn-glass-footer{background:linear-gradient(145deg,rgba(10,12,24,.88),rgba(35,20,48,.72))!important;border:1px solid rgba(255,255,255,.10)!important;box-shadow:0 18px 50px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.05)!important;backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%)}
.layout-menu .menu-link{border-radius:13px;transition:all .35s cubic-bezier(.2,.8,.2,1)}
.layout-menu .menu-link:hover{transform:translateX(5px) scale(1.015);background:linear-gradient(100deg,rgba(168,85,247,.26),rgba(236,72,153,.18))!important;color:#fff!important;box-shadow:0 10px 28px rgba(168,85,247,.18),inset 0 1px 0 rgba(255,255,255,.07)}
.layout-menu .menu-item.active>.menu-link,.layout-menu .menu-item.open>.menu-link{background:linear-gradient(100deg,rgba(139,92,246,.34),rgba(236,72,153,.20))!important;box-shadow:0 12px 30px rgba(139,92,246,.20),inset 0 1px 0 rgba(255,255,255,.08)!important;color:#fff!important}
.card{position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(168,85,247,.06),rgba(236,72,153,.045))!important;border:1px solid rgba(255,255,255,.13)!important;box-shadow:0 18px 50px rgba(0,0,0,.20),0 8px 24px rgba(168,85,247,.08),inset 0 1px 0 rgba(255,255,255,.07)!important;backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease,border-color .4s ease}
.card:before,.card:after{content:"";position:absolute;pointer-events:none;border-radius:50%;opacity:.28;z-index:0}.card:before{width:180px;height:180px;right:-85px;bottom:-105px;background:radial-gradient(circle at 25% 30%,rgba(236,72,153,.9) 0 6%,transparent 7%),radial-gradient(circle at 58% 42%,rgba(168,85,247,.85) 0 5%,transparent 6%),radial-gradient(circle at 42% 72%,rgba(99,102,241,.8) 0 5%,transparent 6%);animation:rnBubble 7s ease-in-out infinite alternate}.card:after{width:120px;height:120px;left:-60px;top:-70px;background:radial-gradient(circle at 32% 30%,rgba(168,85,247,.85) 0 7%,transparent 8%),radial-gradient(circle at 65% 60%,rgba(236,72,153,.8) 0 6%,transparent 7%);animation:rnBubble2 9s ease-in-out infinite alternate}.card>*{position:relative;z-index:1}.card:hover{transform:translateY(-5px);border-color:rgba(236,72,153,.30)!important;box-shadow:0 24px 65px rgba(0,0,0,.30),0 12px 34px rgba(168,85,247,.16),inset 0 1px 0 rgba(255,255,255,.10)!important}
@keyframes rnBubble{to{transform:translate(-20px,-38px) scale(1.06)}}@keyframes rnBubble2{to{transform:translate(28px,40px) scale(1.08)}}
.dropdown-menu{background:rgba(15,17,32,.90)!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 20px 55px rgba(0,0,0,.34)!important;backdrop-filter:blur(24px)}.dropdown-item{transition:all .25s ease;border-radius:9px}.dropdown-item:hover{transform:translateX(3px);background:linear-gradient(100deg,rgba(168,85,247,.22),rgba(236,72,153,.13))!important}
.form-control,.form-select,.input-group-text{background:rgba(255,255,255,.055)!important;color:inherit!important}.form-control:focus,.form-select:focus{border-color:rgba(168,85,247,.62)!important;box-shadow:0 0 0 .2rem rgba(168,85,247,.12),0 8px 24px rgba(168,85,247,.10)!important}
.btn{transition:all .28s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(168,85,247,.18)}
.rn-glass-footer{margin:0 1rem 1rem;border-radius:18px}.rn-auth-footer{position:fixed;left:0;right:0;bottom:0;z-index:10;display:flex;justify-content:center;gap:1.5rem;padding:.75rem 1rem;font-size:.78rem;color:rgba(255,255,255,.78);background:rgba(9,11,22,.60);border-top:1px solid rgba(255,255,255,.10);backdrop-filter:blur(18px)}
.rn-page-loader{position:fixed;inset:0;z-index:999999;display:grid;place-items:center;background:rgba(6,7,16,.98);transition:opacity .62s ease,visibility .62s ease}.rn-page-loader.rn-loader-hidden{opacity:0;visibility:hidden;pointer-events:none}.rn-loader-rings{position:absolute;width:170px;height:170px;animation:rnSpin 3.2s linear infinite}.rn-loader-rings span{position:absolute;inset:0;border-radius:50%;border:2px solid transparent;border-top-color:#a855f7;border-right-color:#ec4899}.rn-loader-rings span:nth-child(2){inset:10px;border-top-color:#22d3ee;border-left-color:#818cf8;animation:rnSpinR 2.4s linear infinite}.rn-loader-rings span:nth-child(3){inset:23px;border-right-color:#f59e0b;border-bottom-color:#ec4899;animation:rnSpin 1.9s linear infinite}.rn-loader-rings span:nth-child(4){inset:36px;border-left-color:#34d399;border-top-color:#c084fc;animation:rnSpinR 1.45s linear infinite}.rn-loader-rings span:nth-child(5){inset:50px;border-right-color:#60a5fa;border-top-color:#f472b6;animation:rnSpin 1.1s linear infinite}.rn-loader-logo{position:relative;z-index:2;font-size:1.25rem;font-weight:900;letter-spacing:.07em;background:linear-gradient(135deg,#c084fc,#f472b6,#60a5fa);-webkit-background-clip:text;background-clip:text;color:transparent}@keyframes rnSpin{to{transform:rotate(360deg)}}@keyframes rnSpinR{to{transform:rotate(-360deg)}}
/* Install wizard: stronger glass override, including its higher-specificity white card rule */
body:has(.install-card){background:radial-gradient(circle at 10% 15%,rgba(168,85,247,.18),transparent 30%),radial-gradient(circle at 90% 80%,rgba(236,72,153,.14),transparent 32%),#0b0d18!important}.install-card.card{background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(168,85,247,.07),rgba(236,72,153,.06))!important;border:1px solid rgba(255,255,255,.16)!important;box-shadow:0 24px 70px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.10)!important;backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%)}.glass-header{background:rgba(15,17,32,.62)!important;border-color:rgba(255,255,255,.12)!important;backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%)}.step-icon{transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,filter .35s ease!important}.step-icon:hover{transform:translateY(-7px) scale(1.12) rotate(5deg)!important;box-shadow:0 15px 35px rgba(139,92,246,.28),0 0 0 5px rgba(236,72,153,.10)!important;filter:brightness(1.08)}.rn-install-developer-card{background:linear-gradient(135deg,rgba(168,85,247,.13),rgba(236,72,153,.10),rgba(99,102,241,.08))!important;border:1px solid rgba(168,85,247,.20)!important;color:rgba(255,255,255,.82)!important;box-shadow:0 12px 32px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.08)!important;backdrop-filter:blur(18px)}.rn-install-developer-card strong{background:linear-gradient(135deg,#c084fc,#f472b6,#818cf8);-webkit-background-clip:text;background-clip:text;color:transparent}.rn-install-developer-card span,.rn-install-developer-card small{color:rgba(255,255,255,.72)!important}
@media(prefers-reduced-motion:reduce){.card,.card:before,.card:after,.step-icon,.btn,.layout-menu .menu-link,.rn-loader-rings,.rn-loader-rings span{animation:none!important;transition:none!important}}
