html{
    font-size:14px
}

body{
    font-size:14px;
    line-height:1.6
}

body,
button,
input,
select,
textarea{
    font-size:14px
}

.form-control,
.form-select,
.btn,
.dropdown-item,
.nav-link,
.form-label,
.form-check-label,
.table{
    font-size:14px
}

.case-form-page{
    max-width:1360px;
    margin:0 auto
}

.case-form-card{
    border:0;
    overflow:hidden;
    box-shadow:0 18px 40px rgba(15,23,42,.08)
}

.case-form-header{
    background:linear-gradient(135deg,#fff7d6 0%,#fff 100%);
    border-bottom:1px solid rgba(245,158,11,.18);
    padding:1.5rem 1.5rem 1rem
}

.case-form-title{
    font-size:1.5rem;
    font-weight:700;
    color:#3b2f12;
    margin-bottom:.5rem
}

.case-form-desc{
    color:#6b7280;
    margin-bottom:1rem
}

.case-form-nav{
    display:flex;
    flex-wrap:wrap;
    gap:.5rem
}

.case-form-nav a{
    padding:.15rem .8rem;
    border-radius:999px;
    background:#fff;
    border:1px solid rgba(245,158,11,.2);
    color:#7c5a10;
    font-size:.9rem;
    text-decoration:none
}

.case-form-nav a:hover{
    background:#fef3c7;
    border-color:#f59e0b;
    color:#92400e;
    font-weight:600
}

.case-form-body{
    padding:1.5rem
}

.case-form-card .form-control,
.case-form-card .form-select{
    padding:.15rem .7rem;
    min-height:1.25rem
}

.case-form-card textarea.form-control{
    min-height:auto;
    padding-top:.5rem;
    padding-bottom:.5rem
}

.case-form-card .form-check-input{
    margin-top:.18rem
}

.case-form-section{
    padding:1rem;
    border:1px solid #e5e7eb;
    border-radius:0.5rem;
    background:#fff
}

.case-form-section+.case-form-section{
    margin-top:1.25rem
}

.case-form-section-header{
    display:flex;
    align-items:flex-start;
    justify-content:flex-start;
    gap:1rem;
    margin-bottom:1rem;
    padding-bottom:1rem;
    border-bottom:1px dashed #e5e7eb
}

.case-form-section-title{
    margin-bottom:.15rem;
    font-size:1rem;
    font-weight:700;
    color:#111827
}

.case-form-section-desc{
    margin-bottom:0;
    color:#e14d4d;
    font-size:.85rem
}

.case-form-index{
    order:-1;
    flex:0 0 auto;
    min-width:2.5rem;
    height:2.5rem;
    border-radius:.85rem;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#fef3c7;
    color:#92400e;
    font-weight:700
}

.case-form-subtitle{
    font-size:.98rem;
    font-weight:500;
    color:#374151;
    margin:.5rem 0 1rem
}

.case-form-grid{
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:1rem
}

.case-form-grid>div{
    min-width:0
}

.case-form-grid.compact-grid{
    gap:.85rem .9rem
}

.span-12{grid-column:span 12}
.span-8{grid-column:span 8}
.span-6{grid-column:span 6}
.span-4{grid-column:span 4}
.span-3{grid-column:span 3}
.span-2{grid-column:span 2}

.case-form-label{
    display:inline-flex;
    align-items:center;
    gap:.12rem;
    margin-bottom:.4rem
}

.case-required{
    color:#dc2626;
    font-weight:700
}

.case-inline-options{
    display:flex;
    flex-wrap:wrap;
    gap:.75rem 1rem
}

.case-checklist{
    display:flex;
    flex-wrap:wrap;
    gap:.6rem 1rem
}

.compact-grid .case-inline-options{
    gap:.45rem 1rem
}

.compact-grid .case-checklist{
    gap:.45rem 1rem
}

.case-address-inline{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.65rem
}

.case-address-item{
    display:flex;
    align-items:center;
    gap:.4rem;
    min-width:0
}

.case-address-item .form-control{
    flex:1 1 0;
    width:auto;
    min-width:0
}

.case-address-suffix{
    flex:0 0 auto;
    min-width:2.5rem;
    text-align:center
}

.case-muted-block{
    padding:.9rem 1rem;
    border-radius:.9rem;
    background:#f8fafc;
    border:1px solid #e5e7eb
}

.case-panel{
    padding:1rem;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:.85rem
}

.case-panel+.case-panel{
    margin-top:.85rem
}

.case-panel-detail{
    margin-top:.75rem;
    margin-left:1.25rem;
    padding:.75rem .9rem;
    background:#fff;
    border-left:3px solid #f59e0b;
    border-radius:.5rem
}

.case-form-actions{
    display:flex;
    justify-content:flex-end;
    gap:.75rem;
    padding-top:1rem
}

.case-detail-hero{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:1rem;
    align-items:start;
    margin-bottom:1.25rem
}

.case-detail-title{
    margin:0 0 .35rem;
    font-size:1.4rem;
    font-weight:700;
    color:#111827
}

.case-detail-meta{
    display:flex;
    flex-wrap:wrap;
    gap:.5rem;
    color:#6b7280
}

.case-detail-meta .badge{
    font-weight:600
}

.case-detail-summary{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:.9rem;
    margin-bottom:1.25rem
}

.case-summary-card{
    padding:1rem 1.05rem;
    border:1px solid #e5e7eb;
    border-radius:1rem;
    background:#fffaf0
}

.case-summary-label{
    margin-bottom:.35rem;
    color:#6b7280;
    font-size:.85rem
}

.case-summary-value{
    color:#111827;
    font-size:1.05rem;
    font-weight:700
}

.case-detail-grid{
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:.85rem 1rem
}

.case-detail-col-12{grid-column:span 12}
.case-detail-col-8{grid-column:span 8}
.case-detail-col-6{grid-column:span 6}
.case-detail-col-4{grid-column:span 4}
.case-detail-col-3{grid-column:span 3}
.case-detail-col-2{grid-column:span 2}

.case-detail-item{
    padding:.9rem 1rem;
    border:1px solid #edf2f7;
    border-radius:.9rem;
    background:#fff
}

.case-detail-item strong{
    display:block;
    margin-bottom:.35rem;
    color:#6b7280;
    font-size:.85rem;
    font-weight:600
}

.case-detail-item span,
.case-detail-item div{
    color:#111827;
    line-height:1.6
}

.case-detail-note{
    padding:1rem 1.1rem;
    border:1px solid #fde68a;
    border-radius:1rem;
    background:#fffdf4
}

.case-info-banner{
    display:flex;
    align-items:center;
    gap:.75rem;
    padding:1rem 1.1rem;
    border:1px solid #fde68a;
    border-radius:1rem;
    background:linear-gradient(135deg,#fffdf4 0%,#fff7d6 100%);
    color:#6b7280
}

.case-record-switch{
    display:flex;
    flex-wrap:wrap;
    gap:.75rem;
    margin-bottom:1.25rem
}

.case-record-switch a{
    display:inline-flex;
    align-items:center;
    gap:.45rem;
    padding:.7rem 1rem;
    border-radius:.95rem;
    text-decoration:none;
    border:1px solid #e5e7eb;
    background:#fff;
    color:#374151;
    font-weight:600
}

.case-record-switch a.active{
    background:#fef3c7;
    border-color:#f59e0b;
    color:#92400e
}

.app-header-breadcrumb{
    display:none;
    align-items:center;
    min-height:40px;
    margin-left:.5rem
}

.app-header-breadcrumb.is-ready{
    display:flex
}

.app-header-breadcrumb .breadcrumb{
    margin-bottom:0;
    font-size:.875rem
}

.app-header-breadcrumb .breadcrumb-item,
.app-header-breadcrumb .breadcrumb-item a{
    color:#6b7280;
    text-decoration:none
}

.app-header-breadcrumb .breadcrumb-item.active{
    color:#111827;
    font-weight:600
}

.app-header-breadcrumb .breadcrumb-item+.breadcrumb-item::before{
    color:#9ca3af
}

@media (max-width:991.98px){
    .span-8,
    .span-6,
    .span-4,
    .span-3,
    .span-2{
        grid-column:span 12
    }

    .case-address-inline{
        grid-template-columns:1fr
    }

    .case-form-section{
        padding:1.1rem
    }

    .case-form-body,
    .case-form-header{
        padding:1rem
    }

    .case-detail-hero{
        grid-template-columns:1fr
    }

    .case-detail-summary{
        grid-template-columns:repeat(2,minmax(0,1fr))
    }

    .case-detail-col-8,
    .case-detail-col-6,
    .case-detail-col-4,
    .case-detail-col-3,
    .case-detail-col-2{
        grid-column:span 12
    }

    .app-header-breadcrumb{
        display:none !important
    }
}

h3 {
    font-size: 1.2rem;
    font-weight: 700;
    color: #3b2f12;
    margin-bottom: 0.5rem;
}

[data-bs-theme=dark]{
    --pe-app-sidebar-border-color: #131313 !important;
    --pe-app-sidebar-caption-color: #ffffff !important;
    --pe-app-sidebar-menu-item-color: #f0e8e8 !important;
    --pe-app-sidebar-bg: #181d2e !important;
    --app-sidebar-border-color: #383838 !important;
    --pe-light-rgb: #060606;
    --pe-light-bg-subtle: #060606;
    --pe-light: var(--pe-body-bg);
    --pe-secondary-bg: #181d2e;
    --pe-app-header-border-color: #383838 !important;
    --pe-box-shadow-sm: 0 6px 10px -3px rgb(21 21 21 / 7%), 0 6px 10px -3px rgb(21 21 21 / 47%)
}

[data-bs-theme=dark] .btn-outline-light{
    --pe-btn-color: #fff;
    --pe-btn-border-color: var(--pe-border-color);
    --pe-btn-hover-bg: var(--pe-light-rgb);
    --pe-btn-hover-color: #fff;
    --pe-btn-hover-border-color: var(--pe-btn-border-color);
    --pe-btn-active-bg: #1e2538;
    --pe-btn-active-border-color: #1e2538;
    --pe-btn-active-color: #fff
}

[data-bs-theme=dark] .btn-light{
    --pe-list-group-disabled-bg: #1f2438;
    --pe-btn-hover-color: #fff;
    --pe-btn-active-color: #fff;
    --pe-btn-bg: #1e2538;
    --pe-btn-border-color: #1e2538;
    --pe-btn-hover-border-color: #060606;
    --pe-btn-hover-bg: #060606;
    --pe-btn-active-bg: #060606;
    box-shadow:0 .125rem .375rem 0 rgba(50,50,50,.05) !important;
    color:#fff
}

[data-bs-theme=dark] .bg-light{
    background-color:#1e2538 !important
}

[data-sidebar-color=dark]{
    --pe-app-sidebar-menu-item-color: #f0e8e8 !important
}

.avatar-sm{
    height:24px;
    width:24px;
    min-width:24px;
    min-height:24px
}

.avatar-md{
    height:36px;
    width:36px;
    min-width:36px;
    min-height:36px
}

.avatar-xl{
    height:72px;
    width:72px;
    min-width:72px;
    min-height:72px
}

.avatar-3xl{
    height:100px;
    width:100px;
    min-width:100px;
    min-height:100px
}

.btn-primary{
    --pe-btn-bg:var(--pe-primary);
    --pe-btn-border-color:var(--pe-primary);
    --pe-btn-hover-bg: var(--pe-primary-text-emphasis);
    --pe-btn-hover-border-color: var(--pe-primary-text-emphasis);
    --pe-btn-active-bg: var(--pe-primary-text-emphasis);
    --pe-btn-active-border-color: var(--pe-primary-text-emphasis);
    --pe-btn-disabled-bg:var(--pe-primary);
    --pe-btn-disabled-border-color:var(--pe-primary)
}

.btn-primary:first-child:active, .btn-primary:active{
    box-shadow:0 .125rem .375rem 0 rgba(91,102,235,.3)
}

.btn-outline-light{
    --pe-btn-color: var(--pe-primary);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-#ebebeb);
    --pe-btn-hover-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-hover-border-color: var(--pe-#ebebeb);
    --pe-btn-focus-shadow-rgb: var(--pe-rgba(235, 235, 235, 0.5)-rgb);
    --pe-btn-active-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-active-border-color: var(--pe-primary);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-primary);
    --pe-btn-disabled-border-color: var(--pe-primary)
}

.btn-outline-primary{
    --pe-btn-color: var(--pe-primary);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-primary);
    --pe-btn-hover-bg: var(--pe-primary);
    --pe-btn-hover-border-color: var(--pe-primary);
    --pe-btn-focus-shadow-rgb: var(--pe-primary-rgb);
    --pe-btn-active-bg: var(--pe-primary);
    --pe-btn-active-border-color: var(--pe-primary);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-primary);
    --pe-btn-disabled-border-color: var(--pe-primary)
}

.btn-secondary{
    --pe-btn-bg:var(--pe-secondary);
    --pe-btn-border-color:var(--pe-secondary);
    --pe-btn-hover-bg: var(--pe-secondary-text-emphasis);
    --pe-btn-hover-border-color: var(--pe-secondary-text-emphasis);
    --pe-btn-active-bg: var(--pe-secondary-text-emphasis);
    --pe-btn-active-border-color: var(--pe-secondary-text-emphasis);
    --pe-btn-disabled-bg:var(--pe-secondary);
    --pe-btn-disabled-border-color:var(--pe-secondary)
}

.btn-secondary:first-child:active, .btn-secondary:active{
    box-shadow:0 .125rem .375rem 0 rgba(108,117,125,.3)
}

.btn-outline-light{
    --pe-btn-color: var(--pe-secondary);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-#ebebeb);
    --pe-btn-hover-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-hover-border-color: var(--pe-#ebebeb);
    --pe-btn-focus-shadow-rgb: var(--pe-rgba(235, 235, 235, 0.5)-rgb);
    --pe-btn-active-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-active-border-color: var(--pe-secondary);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-secondary);
    --pe-btn-disabled-border-color: var(--pe-secondary)
}

.btn-outline-secondary{
    --pe-btn-color: var(--pe-secondary);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-secondary);
    --pe-btn-hover-bg: var(--pe-secondary);
    --pe-btn-hover-border-color: var(--pe-secondary);
    --pe-btn-focus-shadow-rgb: var(--pe-secondary-rgb);
    --pe-btn-active-bg: var(--pe-secondary);
    --pe-btn-active-border-color: var(--pe-secondary);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-secondary);
    --pe-btn-disabled-border-color: var(--pe-secondary)
}

.btn-success{
    --pe-btn-bg:var(--pe-success);
    --pe-btn-border-color:var(--pe-success);
    --pe-btn-hover-bg: var(--pe-success-text-emphasis);
    --pe-btn-hover-border-color: var(--pe-success-text-emphasis);
    --pe-btn-active-bg: var(--pe-success-text-emphasis);
    --pe-btn-active-border-color: var(--pe-success-text-emphasis);
    --pe-btn-disabled-bg:var(--pe-success);
    --pe-btn-disabled-border-color:var(--pe-success)
}

.btn-success:first-child:active, .btn-success:active{
    box-shadow:0 .125rem .375rem 0 rgba(24,165,56,.3)
}

.btn-outline-light{
    --pe-btn-color: var(--pe-success);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-#ebebeb);
    --pe-btn-hover-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-hover-border-color: var(--pe-#ebebeb);
    --pe-btn-focus-shadow-rgb: var(--pe-rgba(235, 235, 235, 0.5)-rgb);
    --pe-btn-active-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-active-border-color: var(--pe-success);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-success);
    --pe-btn-disabled-border-color: var(--pe-success)
}

.btn-info{
    --pe-btn-bg:var(--pe-info);
    --pe-btn-border-color:var(--pe-info);
    --pe-btn-hover-bg: var(--pe-info-text-emphasis);
    --pe-btn-hover-border-color: var(--pe-info-text-emphasis);
    --pe-btn-active-bg: var(--pe-info-text-emphasis);
    --pe-btn-active-border-color: var(--pe-info-text-emphasis);
    --pe-btn-disabled-bg:var(--pe-info);
    --pe-btn-disabled-border-color:var(--pe-info)
}

.btn-info:first-child:active, .btn-info:active{
    box-shadow:0 .125rem .375rem 0 rgba(23,162,184,.3)
}

.btn-outline-light{
    --pe-btn-color: var(--pe-info);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-#ebebeb);
    --pe-btn-hover-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-hover-border-color: var(--pe-#ebebeb);
    --pe-btn-focus-shadow-rgb: var(--pe-rgba(235, 235, 235, 0.5)-rgb);
    --pe-btn-active-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-active-border-color: var(--pe-info);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-info);
    --pe-btn-disabled-border-color: var(--pe-info)
}

.btn-warning{
    --pe-btn-bg:var(--pe-warning);
    --pe-btn-border-color:var(--pe-warning);
    --pe-btn-hover-bg: var(--pe-warning-text-emphasis);
    --pe-btn-hover-border-color: var(--pe-warning-text-emphasis);
    --pe-btn-active-bg: var(--pe-warning-text-emphasis);
    --pe-btn-active-border-color: var(--pe-warning-text-emphasis);
    --pe-btn-disabled-bg:var(--pe-warning);
    --pe-btn-disabled-border-color:var(--pe-warning)
}

.btn-warning:first-child:active, .btn-warning:active{
    box-shadow:0 .125rem .375rem 0 rgba(255,193,7,.3)
}

.btn-outline-light{
    --pe-btn-color: var(--pe-warning);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-#ebebeb);
    --pe-btn-hover-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-hover-border-color: var(--pe-#ebebeb);
    --pe-btn-focus-shadow-rgb: var(--pe-rgba(235, 235, 235, 0.5)-rgb);
    --pe-btn-active-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-active-border-color: var(--pe-warning);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-warning);
    --pe-btn-disabled-border-color: var(--pe-warning)
}

.btn-danger{
    --pe-btn-bg:var(--pe-danger);
    --pe-btn-border-color:var(--pe-danger);
    --pe-btn-hover-bg: var(--pe-danger-text-emphasis);
    --pe-btn-hover-border-color: var(--pe-danger-text-emphasis);
    --pe-btn-active-bg: var(--pe-danger-text-emphasis);
    --pe-btn-active-border-color: var(--pe-danger-text-emphasis);
    --pe-btn-disabled-bg:var(--pe-danger);
    --pe-btn-disabled-border-color:var(--pe-danger)
}

.btn-danger:first-child:active, .btn-danger:active{
    box-shadow:0 .125rem .375rem 0 rgba(220,53,69,.3)
}

.btn-outline-light{
    --pe-btn-color: var(--pe-danger);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-#ebebeb);
    --pe-btn-hover-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-hover-border-color: var(--pe-#ebebeb);
    --pe-btn-focus-shadow-rgb: var(--pe-rgba(235, 235, 235, 0.5)-rgb);
    --pe-btn-active-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-active-border-color: var(--pe-danger);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-danger);
    --pe-btn-disabled-border-color: var(--pe-danger)
}

.btn-outline-danger{
    --pe-btn-color: var(--pe-danger);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-danger);
    --pe-btn-hover-bg: var(--pe-danger);
    --pe-btn-hover-border-color: var(--pe-danger);
    --pe-btn-focus-shadow-rgb: var(--pe-danger-rgb);
    --pe-btn-active-bg: var(--pe-danger);
    --pe-btn-active-border-color: var(--pe-danger);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-danger);
    --pe-btn-disabled-border-color: var(--pe-danger)
}

.btn-light{
    --pe-btn-bg:var(--pe-light);
    --pe-btn-border-color:var(--pe-light);
    --pe-btn-hover-bg: var(--pe-light-text-emphasis);
    --pe-btn-hover-border-color: var(--pe-light-text-emphasis);
    --pe-btn-active-bg: var(--pe-light-text-emphasis);
    --pe-btn-active-border-color: var(--pe-light-text-emphasis);
    --pe-btn-disabled-bg:var(--pe-light);
    --pe-btn-disabled-border-color:var(--pe-light);
    --pe-btn-hover-color: var(--pe-body-color);
    --pe-btn-active-color: var(--pe-body-color);
    --pe-btn-shadow-color: var(--pe-body-color)
}

.btn-light:first-child:active, .btn-light:active{
    box-shadow:0 .125rem .375rem 0 rgba(235,235,235,.3)
}

.btn-outline-light{
    --pe-btn-color: var(--pe-light);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-#ebebeb);
    --pe-btn-hover-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-hover-border-color: var(--pe-#ebebeb);
    --pe-btn-focus-shadow-rgb: var(--pe-rgba(235, 235, 235, 0.5)-rgb);
    --pe-btn-active-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-active-border-color: var(--pe-light);
    --pe-btn-disabled-color: #000;
    --pe-btn-disabled-bg: var(--pe-light);
    --pe-btn-disabled-border-color: var(--pe-light)
}

.btn-outline-light{
    --pe-btn-color: var(--pe-light);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-light);
    --pe-btn-hover-bg: var(--pe-light);
    --pe-btn-hover-border-color: var(--pe-light);
    --pe-btn-focus-shadow-rgb: var(--pe-light-rgb);
    --pe-btn-active-bg: var(--pe-light);
    --pe-btn-active-border-color: var(--pe-light);
    --pe-btn-disabled-color: #000;
    --pe-btn-disabled-bg: var(--pe-light);
    --pe-btn-disabled-border-color: var(--pe-light)
}

.btn-outline-light{
    --pe-btn-color: var(--pe-dark);
    --pe-btn-bg: transparent;
    --pe-btn-border-color: var(--pe-#ebebeb);
    --pe-btn-hover-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-hover-border-color: var(--pe-#ebebeb);
    --pe-btn-focus-shadow-rgb: var(--pe-rgba(235, 235, 235, 0.5)-rgb);
    --pe-btn-active-bg: var(--pe-rgba(235, 235, 235, 0.5));
    --pe-btn-active-border-color: var(--pe-dark);
    --pe-btn-disabled-color: #fff;
    --pe-btn-disabled-bg: var(--pe-dark);
    --pe-btn-disabled-border-color: var(--pe-dark)
}

.nav-success{
    --pe-nav-pills-link-active-color: #fff;
    --pe-nav-pills-link-active-bg: var(--pe-success);
    --pe-nav-link-hover-color: var(--pe-success);
    --pe-nav-underline-link-active-color: var(--pe-success)
}

.pagination .page-link{
    height:38px;
    width:38px;
    line-height:38px
}

.progress{
    height:.75rem
}

:root, [data-bs-theme=light]{
    --pe-app-sidebar-width: 12rem;
    --pe-app-sidebar-sm-width: 5.3rem;
    --pe-app-sidebar-medium-width: 11rem;
    --pe-app-sidebar-bg: #fff;
    --pe-app-sidebar-border-color: #ebebeb;
    --pe-app-sidebar-caption-color: #adb5bd;
    --pe-app-sidebar-color: #5b6b79;
    --pe-app-sidebar-menu-item-color: #5b6b79;
    --pe-app-sidebar-menu-item-color-hover: #5b66eb;
    --pe-app-sidebar-menu-item-color-active: #5b66eb;
    --pe-app-header-height: 74px;
    --pe-app-header-bg: #fff;
    --pe-app-header-border-color: #e2e8f0;
    --pe-app-footer-height: 60px;
    --pe-semibox-width: 1rem;
    --pe-boxed-width: 7.5rem;
    --pe-boxed-width-sm: 1.5rem
}

:root[data-theme-colors=default], [data-bs-theme=light][data-theme-colors=default]{
    --pe-primary: #5b66eb;
    --pe-primary-rgb: 91, 102, 235;
    --pe-primary-text-emphasis: #4451e8;
    --pe-primary-bg-subtle: rgba(91, 102, 235, 0.1);
    --pe-primary-border-subtle: rgba(91, 102, 235, 0.50);
    --pe-app-sidebar-menu-item-color-hover: #5b66eb;
    --pe-app-sidebar-menu-item-color-active: #5b66eb;
    --pe-link-color-rgb: 91, 102, 235;
    --pe-link-hover-color-rgb: 50, 64, 230
}

:root[data-theme-colors=cyan]{
    --pe-primary: #3795BD;
    --pe-primary-rgb: 55, 149, 189;
    --pe-primary-text-emphasis: #3185a9;
    --pe-primary-bg-subtle: rgba(55, 149, 189, 0.1);
    --pe-primary-border-subtle: rgba(55, 149, 189, 0.50);
    --pe-app-sidebar-menu-item-color-hover: #3795BD;
    --pe-app-sidebar-menu-item-color-active: #3795BD;
    --pe-link-color-rgb: 55, 149, 189;
    --pe-link-hover-color-rgb: 45, 121, 153
}

:root[data-theme-colors=blue]{
    --pe-primary: #2E5077;
    --pe-primary-rgb: 46, 80, 119;
    --pe-primary-text-emphasis: #274465;
    --pe-primary-bg-subtle: rgba(46, 80, 119, 0.1);
    --pe-primary-border-subtle: rgba(46, 80, 119, 0.50);
    --pe-app-sidebar-menu-item-color-hover: #2E5077;
    --pe-app-sidebar-menu-item-color-active: #2E5077;
    --pe-link-color-rgb: 46, 80, 119;
    --pe-link-hover-color-rgb: 33, 58, 86
}

:root[data-theme-colors=purple]{
    --pe-primary: #9F73AB;
    --pe-primary-rgb: 159, 115, 171;
    --pe-primary-text-emphasis: #9463a1;
    --pe-primary-bg-subtle: rgba(159, 115, 171, 0.1);
    --pe-primary-border-subtle: rgba(159, 115, 171, 0.50);
    --pe-app-sidebar-menu-item-color-hover: #9F73AB;
    --pe-app-sidebar-menu-item-color-active: #9F73AB;
    --pe-link-color-rgb: 159, 115, 171;
    --pe-link-hover-color-rgb: 137, 90, 150
}

.btn-light{
    --pe-btn-hover-bg: #dee2e6;
    --pe-btn-hover-border-color: #dee2e6;
    --pe-btn-active-bg: #dee2e6;
    --pe-btn-active-border-color: #dee2e6
}

.app-header{
    height:var(--pe-app-header-height);
    background-color:var(--pe-secondary-bg);
    transition:none;
    display:flex;
    align-items:center;
    border-bottom:1px solid var(--pe-border-color);
    z-index:1001;
    position:fixed;
    left:var(--pe-app-sidebar-width);
    right:0;
    top:0;
    padding:0 .75rem
}

.app-header .logo-main h3{
    letter-spacing:.5px
}

.logo-main{
    display:inline-flex;
    align-items:center;
}

.logo-main img{
    flex:0 0 auto;
    display:block;
}

.brand-wordmark{
    display:inline-block;
    font-size:1.35rem;
    font-weight:800;
    line-height:1;
    letter-spacing:.02em;
    color:#153b7a;
}

.app-header .form-icon .form-control-icon{
    padding-right:calc(1.125rem*3);
    padding-left:1.125rem
}

.app-header .form-icon .search-btn{
    display:flex;
    align-items:center;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    right:18px
}

.app-header .form-icon .search-btn i{
    position:static
}

.app-header .header-btn{
    width:44px;
    height:44px;
    border-color:var(--pe-border-color);
    color:var(--pe-body-color);
    font-size:1.125rem;
    padding:0;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center
}

.app-header .header-btn .icon-dot{
    position:absolute;
    top:6px;
    right:8px;
    height:13px;
    width:13px;
    background-color:var(--pe-danger);
    border:3px solid var(--pe-light-border-subtle);
    border-radius:100%
}

.app-header .header-btn.show{
    border-color:var(--pe-border-color) !important
}

.app-header .dark-mode-btn, .app-header .header-profile-btn{
    height:44px;
    border:1px solid var(--pe-border-color);
    font-size:1.0625rem;
    padding:6px;
    border-radius:20rem;
    display:flex;
    align-items:center
}

.app-header .dark-mode-btn .header-btn, .app-header .header-profile-btn .header-btn{
    height:34px;
    width:34px;
    background-color:rgba(0,0,0,0);
    border-color:rgba(0,0,0,0)
}

.app-header .dark-mode-btn .header-btn.active, .app-header .header-profile-btn .header-btn.active{
    background-color:var(--pe-warning);
    color:var(--pe-white)
}

.app-header .header-profile-btn{
    border-radius:.75rem
}

.app-header.sticky-scroll{
    background-color:var(--pe-secondary-bg)
}

.app-header .pe-dropdown-mega :is(.dropdown-menu.dropdown-mega-xl,
.dropdown-menu.dropdown-mega-lg,
.dropdown-menu.dropdown-mega-md,
.dropdown-menu,
.dropdown-mega-sm){
    --pe-dropdown-item-padding-x: 1rem;
    --pe-dropdown-item-padding-y: 0.45rem;
    max-height:calc(100vh - 90px);
    overflow-y:auto
}

.app-header .pe-dropdown-mega .header-dropdown-menu{
    top:24px !important
}

.app-header .pe-dropdown-mega .dropdown-menu.dropdown-mega-md{
    width:28rem
}

.app-header .pe-noti-dropdown-menu .noti-item{
    position:relative;
    display:flex;
    gap:16px;
    border-bottom:1px solid var(--pe-border-color);
    padding:16px
}

.app-header .pe-noti-dropdown-menu .noti-item .link{
    opacity:0;
    transition:all .5s ease
}

.app-header .pe-noti-dropdown-menu .noti-item:hover .link{
    opacity:1
}

.app-header .offcanvas .card-radio{
    padding:0
}

.app-header .offcanvas .card-radio .form-check-input{
    display:none
}

.search-modal .modal-body{
    max-height:400px
}

.search-modal .modal-body .suggestion-title{
    color:#adb5bd;
    font-size:.6875rem;
    text-transform:uppercase;
    letter-spacing:1.5px
}

.search-modal .modal-body .suggestion-item{
    transition:all .2s ease-in-out;
    padding:10px 12px;
    display:flex;
    align-items:center;
    cursor:pointer;
    border-radius:.3125rem
}

.search-modal .modal-body .suggestion-item:hover{
    background-color:var(--pe-light-bg-subtle)
}

.pe-app-sidebar{
    background-color:var(--pe-app-sidebar-bg);
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    z-index:1005;
    width:var(--pe-app-sidebar-width);
    border-right:1px solid var(--pe-border-color)
}

@media(max-width: 991.98px){
.pe-app-sidebar.show{
        display:block
    }
}

@media(max-width: 991.98px){
.pe-app-sidebar{
        display:none
    }
}

.pe-app-sidebar .pe-app-sidebar-logo{
    height:var(--pe-app-header-height)
}

.pe-app-sidebar .pe-app-sidebar-logo h3{
    letter-spacing:.5px
}

.pe-app-sidebar .pe-app-sidebar-menu{
    height:calc(100% - var(--pe-app-header-height))
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-main-menu{
    margin-bottom:0;
    padding:0 1rem;
    width:100%;
    min-height:100%
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-main-menu>*{
    list-style-type:none
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-menu-title{
    line-height:1.55;
    font-size:0.6875rem;
    font-weight:500;
    letter-spacing:1.5px;
    color:var(--pe-text-muted);
    text-transform:uppercase;
    padding:15px 5px 8px;
    white-space:nowrap;
    position:relative
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link{
    padding:10px 12px;
    position:relative;
    display:flex;
    gap:12px;
    margin-bottom:4px;
    align-items:center;
    text-decoration:none;
    line-height:24px;
    color:var(--pe-app-sidebar-menu-item-color);
    transition:all .2s ease-in-out;
    border-radius:.3125rem
}

@media(prefers-reduced-motion: reduce){
.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link{
        transition:none
    }
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link .pe-nav-icon{
    font-size:1.0625rem;
    width:20px;
    height:20px
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link .pe-nav-content{
    position:relative;
    font-size:14px;
    line-height:1;
    vertical-align:middle;
    white-space:nowrap
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link .pe-nav-arrow{
    margin-left:auto;
    font-size:1rem;
    transition:all .2s ease-in-out;
    opacity:.8
}

@media(prefers-reduced-motion: reduce){
.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link .pe-nav-arrow{
        transition:none
    }
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link:hover{
    color:var(--pe-white);
    background-color:var(--pe-app-sidebar-menu-item-color-hover)
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link:hover::before{
    border-color:var(--pe-app-sidebar-menu-item-color-hover) !important
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link:hover::after{
    background-color:var(--pe-app-sidebar-menu-item-color-hover) !important
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link.active{
    font-weight:500;
    color:var(--pe-white);
    background-color:var(--pe-app-sidebar-menu-item-color-active)
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link.active::before{
    border-color:var(--pe-app-sidebar-menu-item-color-active) !important
}

.pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link.active::after{
    background-color:var(--pe-app-sidebar-menu-item-color-active) !important
}

.pe-app-sidebar .sidebar-widget{
    padding:1.5rem 12px;
    margin:30px 16px 16px;
    position:relative;
    border:1px solid var(--pe-border-color);
    box-shadow:var(--pe-box-shadow-sm);
    border-radius:var(--pe-border-radius);
    background-color:var(--pe-secondary-bg)
}

@media(max-width: 991.98px){
.app-header{
        left:0
    }
}

:is([data-sidebar-color=dark]) .pe-app-sidebar-logo .logo-main .logo-light{
    display:inline-block !important
}

:is([data-sidebar-color=dark]) .pe-app-sidebar-logo .logo-main .logo-dark{
    display:none !important
}

:is([data-bs-theme=light],
[data-bs-theme=dark]) .pe-app-sidebar-logo .logo-main .logo-light{
    display:none
}

@media(min-width: 992px){
:is([data-layout=horizontal]) .logo-main{
        display:flex !important
    }
}

:is([data-topbar-theme=dark]) .app-header .logo-main h3{
    color:#f6f6f8 !important
}

:is([data-topbar-theme=dark]) .app-header .brand-wordmark{
    color:#f6f6f8 !important
}

:is([data-topbar-theme=dark]) .app-header .header-btn{
    border-color:rgba(135,135,135,.15);
    color:#dee2e6
}

:is([data-topbar-theme=dark]) .app-header .header-btn.show{
    border-color:rgba(135,135,135,.15) !important;
    color:#dee2e6 !important
}

:is([data-topbar-theme=dark]) .app-header .header-btn .icon-dot{
    border-color:#212529
}

:is([data-topbar-theme=dark]) .app-header .form-control, :is([data-topbar-theme=dark]) .app-header .dark-mode-btn, :is([data-topbar-theme=dark]) .app-header .header-profile-btn{
    border-color:rgba(135,135,135,.15)
}

:is([data-topbar-theme=dark]) .app-header .search-btn span, :is([data-topbar-theme=dark]) .app-header .header-profile-btn span{
    color:#dee2e6 !important
}

:is([data-topbar-theme=dark]) .app-header .search-btn i, :is([data-topbar-theme=dark]) .app-header .header-profile-btn i{
    color:rgba(222,226,230,.75) !important
}

:is([data-bs-theme=dark][data-layout=horizontal]) .app-header .search-btn span{
    background-color:rgba(235,235,235,.5) !important;
    color:#dee2e6 !important
}

[data-sidebar-color=dark] .pe-app-sidebar{
    background-color:var(--pe-primary);
    border-color:var(--pe-primary)
}

[data-sidebar-color=dark] .pe-app-sidebar .pe-app-sidebar-logo{
    background-color:var(--pe-primary);
    border-right:var(--pe-primary)
}

[data-sidebar-color=dark] .pe-app-sidebar .pe-app-sidebar-logo .logo-main h3{
    color:var(--pe-white) !important
}

[data-sidebar-color=dark] .pe-app-sidebar .pe-app-sidebar-logo .brand-wordmark{
    color:var(--pe-white) !important
}

[data-sidebar-color=dark] .pe-app-sidebar .pe-app-sidebar-menu .pe-menu-title{
    color:#fff
}

[data-sidebar-color=dark] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link{
    color:var(--pe-app-sidebar-menu-item-color)
}

[data-sidebar-color=dark] .pe-app-sidebar .pe-app-sidebar-menu .pe-nav-link.active{
    color:var(--pe-app-sidebar-menu-item-color-active) !important;
    background-color:var(--pe-white)
}

.layout-customizer .form-check-label{
    display:block;
    border:1px solid rgba(0,0,0,0);
    transition:border .3s ease-in-out
}

#sidebar-color .form-check{
    padding-left:0
}

#sidebar-color .card-radio .form-check-label{
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative
}

#sidebar-color .card-radio .form-check-input:checked+.form-check-label::after{
    content:"✔";
    font-size:18px;
    color:#fff;
    position:absolute;
    transform:scale(1)
}

#sidebar-color .card-radio .form-check-label::after{
    transform:scale(0)
}

.footer{
    height:var(--pe-app-footer-height);
    background-color:var(--pe-secondary-bg);
    color:#adb5bd;
    padding:20px calc(1.5rem*.5)
}

@media(min-width: 992px){
.footer{
        margin-inline-start:var(--pe-app-sidebar-width)
    }
}

.app-wrapper{
    margin-inline-start:var(--pe-app-sidebar-width);
    margin-block-start:var(--pe-app-header-height);
    transition:all .2s ease-in-out;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    position:relative;
    min-height:calc(100vh - (var(--pe-app-header-height) + var(--pe-app-footer-height)));
    padding:0 10px
}

@media(max-width: 991.98px){
.app-wrapper{
        margin-inline-start:auto
    }
}

.alert hr{
    border-color:inherit
}

.alert-dismissible .btn-close{
    padding:.86rem 1rem;
    background:none;
    color:var(--pe-alert-link-color)
}

.alert-dismissible .btn-close::after{
    position:absolute;
    inset:0;
    padding:.55rem 1rem;
    font-size:1.25rem;
    content:"";
    font-family:bootstrap-icons;
    transition:all .2s ease-in-out
}

@media(prefers-reduced-motion: reduce){
.alert-dismissible .btn-close::after{
        transition:none
    }
}

.btn-loader i{
    animation:loader 1500ms infinite linear;
    display:inline-block;
    transform:rotate(0deg)
}

@keyframes loader {
    to {
        transform:rotate(360deg)
    }
}

.breadcrumb-item>a{
    color:var(--pe-emphasis-color)
}

.breadcrumb-item+.breadcrumb-item::before{
    content:">"
}

.card{
    transition:transform .2s ease-in-out;
    margin: 0.5rem 0;
    position:relative;
    box-shadow:var(--pe-card-box-shadow);
    border:0
}

.card-title{
    font-size:15px;
    margin-bottom:0;
    color:var(--pe-body-color)
}

.card{
    position:relative
}

.card .card-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    border-bottom:0;
    padding:var(--pe-card-spacer-y);
    padding-bottom:0px
}

.card .card-header h4{
    font-size:20px;
    margin-bottom:0px
}

.card-h-100{
    height:calc(100% - 1.5rem)
}

.dropdown{
    line-height:1
}

.dropdown-menu{
    box-shadow:0 4px 24px 0 rgba(62,57,107,.18);
    background-color:var(--pe-dropdown-bg)
}

*{
    scrollbar-width:thin
}

*::-webkit-scrollbar{
    width:5px;
    height:5px
}

* ::-webkit-scrollbar-track{
    background-color:rgba(0,0,0,0)
}

.form-control:disabled{
    cursor:not-allowed
}

.form-control:focus{
    border-color:var(--pe-primary)
}

.form-icon{
    position:relative
}

.form-icon i{
    position:absolute;
    top:0;
    bottom:0;
    display:flex;
    justify-content:center;
    align-items:center;
    width:2.7rem
}

.form-icon .form-control-icon{
    padding-left:calc(1.125rem*2.5)
}

.form-icon.right .form-control-icon{
    padding-right:calc(1.125rem*2.5);
    padding-left:1.125rem
}

.form-icon.right i{
    left:auto;
    right:0
}

.form-check{
    position:relative
}

.form-check .form-check-input{
    cursor:pointer
}

.offcanvas-header{
    border-bottom:var(--pe-offcanvas-border-width) solid var(--pe-offcanvas-border-color)
}

.pagination{
    flex-wrap:wrap;
    gap:8px
}

.pagination .page-link{
    padding:0;
    text-align:center
}

.pagination-rounded .page-link{
    border-radius:50rem
}

.progress{
    cursor:pointer
}

.progress:hover{
    --pe-progress-bg: var(--pe-body-bg)
}

.table>:not(:first-child){
    border-top:0
}

.table{
    margin-bottom:0
}

.table thead>:not(:last-child){
    border-style:none
}

.table-nowrap th, .table-nowrap td{
    white-space:nowrap
}

.table th, .table td{
    vertical-align:middle
}

@media print{
.pe-app-sidebar, .app-header{
        display:none
    }

.app-wrapper{
        margin-left:0;
        padding:0
    }
}

.progress-wrap{
    right:25px;
    bottom:25px;
    border-radius:50rem;
    backdrop-filter:blur(6px);
    background:var(--pe-primary-bg-subtle);
    z-index:999;
    opacity:0;
    visibility:hidden;
    transform:translateY(15px);
    transition:all 200ms linear
}

.progress-wrap svg{
    transform:rotate(-90deg)
}

.progress-wrap svg .progress{
    fill:none;
    stroke:var(--pe-primary);
    stroke-width:3px;
    stroke-linecap:round;
    transition:stroke-dashoffset 10ms linear
}

.school-card{
    position:relative;
    background-color:#0e5d98;
    height:244px
}

:root .air-datepicker{
    --adp-day-cell-height: 55px !important
}

:root .air-datepicker{
    --adp-day-cell-height: 43px;
    --adp-background-color: var(--pe-secondary-bg)
}

body .apexcharts-tooltip.apexcharts-theme-light{
    background:var(--pe-body-bg);
    border-color:var(--pe-border-color)
}

body .apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title{
    background:rgba(0,0,0,0);
    border-bottom:1px solid var(--pe-border-color);
    font-family:var(--pe-font-sans-serif) !important
}

body{
    --fc-button-active-border-color: $primary;
    --fc-button-text-color: $btn-color
}

[data-bs-theme=dark] button:is(.gridjs-sort-neutral,
.gridjs-sort-asc,
.gridjs-sort-desc){
    filter:invert(1) grayscale(100%) brightness(200%)
}

:root{
    --gl-star-empty: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27rgba%28204,204,204,1%29%27%3E%3Cpath d=%27M12.0006 18.26L4.94715 22.2082L6.52248 14.2799L0.587891 8.7918L8.61493 7.84006L12.0006 0.5L15.3862 7.84006L23.4132 8.7918L17.4787 14.2799L19.054 22.2082L12.0006 18.26Z%27%3E%3C/path%3E%3C/svg%3E");
    --gl-star-full: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27rgba%28255,184,41,1%29%27%3E%3Cpath d=%27M12.0006 18.26L4.94715 22.2082L6.52248 14.2799L0.587891 8.7918L8.61493 7.84006L12.0006 0.5L15.3862 7.84006L23.4132 8.7918L17.4787 14.2799L19.054 22.2082L12.0006 18.26Z%27%3E%3C/path%3E%3C/svg%3E");
    --gl-star-size: 25px
}

:root .heart-rating-main{
    --gl-star-empty: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27rgba%28204,204,204,1%29%27%3E%3Cpath d=%27M12.001 4.52853C14.35 2.42 17.98 2.49 20.2426 4.75736C22.5053 7.02472 22.583 10.637 20.4786 12.993L11.9999 21.485L3.52138 12.993C1.41705 10.637 1.49571 7.01901 3.75736 4.75736C6.02157 2.49315 9.64519 2.41687 12.001 4.52853Z%27%3E%3C/path%3E%3C/svg%3E") !important;
    --gl-star-full: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27rgba%28255,184,41,1%29%27%3E%3Cpath d=%27M12.001 4.52853C14.35 2.42 17.98 2.49 20.2426 4.75736C22.5053 7.02472 22.583 10.637 20.4786 12.993L11.9999 21.485L3.52138 12.993C1.41705 10.637 1.49571 7.01901 3.75736 4.75736C6.02157 2.49315 9.64519 2.41687 12.001 4.52853Z%27%3E%3C/path%3E%3C/svg%3E") !important
}

.bg-pattern{
    background:radial-gradient(circle at 30% 40%, rgba(110, 66, 193, 0.04), transparent 50%),radial-gradient(circle at 70% 60%, rgba(66, 135, 245, 0.04), transparent 50%)
}

.auth-pattern-shape.extra{
    position:absolute;
    top:50%;
    left:12%;
    width:150px;
    height:150px;
    border-radius:40px;
    background:rgba(255,130,184,.1);
    backdrop-filter:blur(20px);
    transform:rotate(25deg)
}

.auth-pattern-extra{
    position:absolute;
    top:50%;
    left:12%;
    width:100px;
    height:100px;
    transform:translateY(-50%) rotate(10deg);
    border:1px solid rgba(255,130,184,.3);
    border-radius:10px
}

.auth-pattern-shapes::before, .auth-pattern-shapes::after{
    content:"";
    position:absolute;
    border-radius:30px;
    background:rgba(114,98,251,.1);
    backdrop-filter:blur(25px);
    -webkit-backdrop-filter:blur(25px)
}

.auth-pattern-shapes::before{
    width:140px;
    height:140px;
    top:23%;
    left:70%;
    transform:rotate(25deg)
}

.auth-pattern-shapes::after{
    width:180px;
    height:180px;
    bottom:20%;
    right:10%;
    background:rgba(98,239,255,.08)
}

.auth-pattern-outline{
    pointer-events:none;
    z-index:0
}

.auth-pattern-outline::before{
    content:"";
    position:absolute;
    width:100px;
    height:100px;
    top:18%;
    left:70%;
    border:2px dotted rgba(114,98,251,.4);
    border-radius:12px;
    transform:rotate(25deg)
}

.auth-pattern-outline::after{
    content:"";
    position:absolute;
    width:160px;
    height:160px;
    bottom:15%;
    right:8%;
    border:1px solid rgba(98,239,255,.3);
    border-radius:16px
}