@import '_content/JUtils.Web/JUtils.Web.kcgf6r00hm.bundle.scp.css';

/* /Pages/LoginPage.razor.rz.scp.css */
.login[b-liog2m33sd] {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 24px;
    overflow: auto;
    background:
        radial-gradient(1100px 560px at 15% -10%, #7a0012 0%, transparent 60%),
        radial-gradient(900px 680px at 105% 110%, #cc0f1d 0%, transparent 55%),
        #1a0406;
}

.login__card[b-liog2m33sd] {
    width: 100%;
    max-width: 400px;
    background: #fff;
    border-radius: 18px;
    padding: 34px 32px;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.4);
}

.login__brand[b-liog2m33sd] { display: flex; align-items: center; gap: 12px; margin-bottom: 26px; }

.login__mark[b-liog2m33sd] {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 13px;
    font-weight: 800;
    font-size: 1.25rem;
    color: #fff;
    background: linear-gradient(135deg, #e60000, #cc0f1d);
    box-shadow: 0 8px 20px rgba(204, 15, 29, 0.45);
}

.login__brandtext[b-liog2m33sd] { display: flex; flex-direction: column; line-height: 1.15; }
.login__name[b-liog2m33sd] { font-weight: 700; font-size: 1.1rem; color: #1f2430; }
.login__sub[b-liog2m33sd] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.14em; color: #9aa0ad; }

.login__heading[b-liog2m33sd] { margin: 0; font-size: 1.5rem; font-weight: 700; color: #1f2430; }
.login__hint[b-liog2m33sd] { margin: 4px 0 22px; color: #6b7280; font-size: 0.92rem; }

.login__card[b-liog2m33sd]  .login__form { display: flex; flex-direction: column; }

.login__label[b-liog2m33sd] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #384152;
    margin-bottom: 6px;
}
.login__card[b-liog2m33sd]  .form-control { margin-bottom: 16px; padding: 10px 12px; }

.login__error[b-liog2m33sd] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 10px 12px;
    border-radius: 9px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: 0.86rem;
    border: 1px solid #fecaca;
}

.login__submit[b-liog2m33sd] {
    margin-top: 4px;
    height: 46px;
    font-weight: 600;
    font-size: 1rem;
    border-radius: 11px;
}

.login__footer[b-liog2m33sd] { color: rgba(255, 255, 255, 0.6); font-size: 0.8rem; margin: 0; }
/* /Shared/MainLayout.razor.rz.scp.css */
.page[b-i5eovd5sc8] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.sidebar[b-i5eovd5sc8] {
    background: var(--SidebarGrad, linear-gradient(180deg, #3a0008 0%, #cc0f1d 100%));
    color: #fff;
}

.content[b-i5eovd5sc8] {
    flex: 1;
    padding: 1.5rem 1.25rem;
    min-width: 0;
}

/* Confirm dialog */
.confirm[b-i5eovd5sc8] { padding: 6px 4px; }
.confirm__title[b-i5eovd5sc8] { margin: 4px 0 16px; font-weight: 600; }
.confirm__actions[b-i5eovd5sc8] { display: flex; gap: 10px; }

@media (min-width: 641px) {
    .page[b-i5eovd5sc8] {
        flex-direction: row;
    }

    .sidebar[b-i5eovd5sc8] {
        width: 260px;
        flex: 0 0 260px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .content[b-i5eovd5sc8] {
        padding: 2rem 2.25rem;
    }
}
/* /Shared/NavMenu.razor.rz.scp.css */
/* Brand header */
.brand[b-x75e9hmh0m] {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 4rem;
    padding: 0 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.brand__mark[b-x75e9hmh0m] {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    font-weight: 800;
    font-size: 1.1rem;
    color: #fff;
    background: linear-gradient(135deg, #e60000, #cc0f1d);
    box-shadow: 0 6px 16px rgba(204, 15, 29, 0.45);
}

.brand__text[b-x75e9hmh0m] { display: flex; flex-direction: column; line-height: 1.15; }
.brand__name[b-x75e9hmh0m] { color: #fff; font-weight: 700; font-size: 1.05rem; letter-spacing: 0.02em; }
.brand__sub[b-x75e9hmh0m] { color: rgba(255, 255, 255, 0.55); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.12em; }

.brand__toggle[b-x75e9hmh0m] {
    margin-left: auto;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: #fff;
    width: 38px;
    height: 38px;
    border-radius: 9px;
    cursor: pointer;
}

/* Menu body */
.menu[b-x75e9hmh0m] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 4rem);
}

.menu__group[b-x75e9hmh0m] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 0.75rem;
    flex: 1;
    overflow-y: auto;
}

.menu__label[b-x75e9hmh0m] {
    margin: 14px 10px 4px;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.4);
}

.menu__label:first-child[b-x75e9hmh0m] { margin-top: 4px; }

.menu__group[b-x75e9hmh0m]  .menu__link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 14px;
    height: 44px;
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.78);
    text-decoration: none;
    font-size: 0.92rem;
    font-weight: 500;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.menu__group[b-x75e9hmh0m]  .menu__link .oi { font-size: 1rem; width: 1.25rem; text-align: center; }

.menu__group[b-x75e9hmh0m]  .menu__link:hover {
    background: rgba(255, 255, 255, 0.09);
    color: #fff;
}

.menu__group[b-x75e9hmh0m]  .menu__link.active {
    color: #fff;
    background: linear-gradient(135deg, rgba(230, 0, 0, 0.95), rgba(204, 15, 29, 0.9));
    box-shadow: 0 6px 16px rgba(204, 15, 29, 0.4);
}

/* Footer / user */
.menu__footer[b-x75e9hmh0m] {
    padding: 0.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.user[b-x75e9hmh0m] { display: flex; align-items: center; gap: 10px; }

.user__avatar[b-x75e9hmh0m] {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    font-weight: 700;
    color: #fff;
    background: rgba(255, 255, 255, 0.16);
}

.user__meta[b-x75e9hmh0m] { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.user__name[b-x75e9hmh0m] { color: #fff; font-weight: 600; font-size: 0.9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user__role[b-x75e9hmh0m] { color: rgba(255, 255, 255, 0.5); font-size: 0.72rem; }

.logout[b-x75e9hmh0m] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 9px 0;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease;
}
.logout:hover[b-x75e9hmh0m] { background: rgba(239, 68, 68, 0.85); border-color: transparent; }

@media (min-width: 641px) {
    .brand__toggle[b-x75e9hmh0m] { display: none; }
    .collapse[b-x75e9hmh0m] { display: flex; }
}

@media (max-width: 640.98px) {
    .menu[b-x75e9hmh0m] { height: auto; }
    .menu__group[b-x75e9hmh0m] { max-height: 60vh; }
}
/* /Shared/SortableList.razor.rz.scp.css */
/* 
  you need the ::deep identifier if you are using scoped styles like this
  because scoped styles are only applied to markup in the component, not
  to the markup inside the render fragment.
*/

[b-5t3c312fxu] .sortable-ghost {
    visibility: hidden;
}

[b-5t3c312fxu] .sortable-fallback {
    opacity: 1 !important
}


.item-container[b-5t3c312fxu] {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.draggable-con[b-5t3c312fxu] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    padding: 5px;
    outline: 1px black solid;
    border-radius: 5px;
    background-color: var(--LightColor);
}


.draggable-con[b-5t3c312fxu] {
    user-select: none; /* Prevents text selection */
    -webkit-user-select: none; /* For WebKit browsers (Chrome, Safari) */
    -moz-user-select: none; /* For Firefox */
    -ms-user-select: none; /* For Internet Explorer/Edge */
}


.drag-handle[b-5t3c312fxu] {
    background: white;
    padding: 0px 8px;
    color: var(--PrimaryColor);
    border-radius: 7px;
}

    .drag-handle .icon[b-5t3c312fxu] {
        font-size: 18px;
        /*margin-left: 5px;*/
    }

    .drag-handle .it[b-5t3c312fxu] {
        font-weight: bold;
        text-align: center;
        font-size: 1.1em;
    }

[b-5t3c312fxu] .sortable-chosen .drag-handle {
    background: var(--PrimaryColor);
    color: white;
}

[b-5t3c312fxu] .sortable-chosen {
    box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.3);
}