/* Copyright (c) Zhmara X. All rights reserved.
   Proprietary and confidential. Unauthorized copying of this file, via any medium, is prohibited. See LICENSE.txt. */

/* Stacking layers (z-index) for the whole app, in one place. Loaded last on every page (LTR and RTL), after the
   theme, Bootstrap and Radzen. Anything that floats over the page takes its number from here, never from a page.

   Order, bottom to top:
     page content and sticky bars ....... small local numbers in their own CSS (1-30)
     theme header 999, sidebar 995 / 1041 (mobile), sidebar toggle 1002 (theme style.css)
     page pop-ups ......................... 1030  (search lists that open under a field on a page)
     theme settings panel ................. 9999  (theme style.css)
     modal backdrop / modal ............... 10000 / 10010  (Bootstrap modals and the app's own modals)
     dialog mask / dialog ................. 10100 / 10110  (Radzen dialogs: delete confirm, negative cash...)
     floating pop-ups ..................... 10200 (date pickers, dropdown lists, tooltips) - above modals and dialogs
     "please wait" overlay ................ 10250 (BLoader, also while a modal saves)
     notifications ........................ 10300 (Radzen toasts)
     Blazor error bar ..................... 10400 ("An unhandled error has occurred. Reload")
     page loader .......................... 999999 (theme global loader)

   Left in their own CSS on purpose: small local layers inside one section (sticky toolbar 20 and its tips,
   help and pricing pages), the mobile top bar 999 (theme header level) and the floating Home button 1000. */
:root {
    --zx-z-page-popup: 1030;
    --zx-z-modal-backdrop: 10000;
    --zx-z-modal: 10010;
    --zx-z-dialog-mask: 10100;
    --zx-z-dialog: 10110;
    --zx-z-popup: 10200;
    --zx-z-busy: 10250;
    --zx-z-toast: 10300;
    --zx-z-error: 10400;

    /* Radzen dialogs read these. */
    --rz-dialog-mask-zindex: var(--zx-z-dialog-mask);
    --rz-dialog-zindex: var(--zx-z-dialog);
}

/* Bootstrap modals: above the theme's header, sidebar and settings panel. */
.modal {
    --bs-modal-zindex: var(--zx-z-modal);
    z-index: var(--zx-z-modal);
}

.modal-backdrop {
    --bs-backdrop-zindex: var(--zx-z-modal-backdrop);
    z-index: var(--zx-z-modal-backdrop);
}

/* App modals built without Bootstrap (LineStockPicker "New batch"). */
.lp-modal-backdrop { z-index: var(--zx-z-modal-backdrop); }
.lp-modal { z-index: var(--zx-z-modal); }

/* Radzen pop-ups: Radzen writes z-index 2000 on the element itself when it opens one, so this needs !important.
   Date and time pickers, dropdown and autocomplete lists, overlay panels and tooltips open above any modal or
   dialog, so a date box inside the Financial Year form or a dialog works. */
.rz-popup,
.rz-datepicker-popup-container,
.rz-timespanpicker-popup-container,
.rz-dropdown-panel,
.rz-autocomplete-panel,
.rz-overlaypanel,
.rz-tooltip,
.rz-context-menu {
    z-index: var(--zx-z-popup) !important;
}

/* "Please wait" overlay (BLoader): covers modals, dialogs and pop-ups while something saves or loads. */
.loading-container {
    z-index: var(--zx-z-busy);
}

/* Radzen toasts: always on top, also over modals and dialogs. */
.rz-notification {
    z-index: var(--zx-z-toast) !important;
}

/* Blazor error bar: always visible, even over modals and dialogs. */
#blazor-error-ui {
    z-index: var(--zx-z-error);
}

/* Search lists that open under a field on a page (items, accounts): over the page and its sticky toolbar, under
   modals. */
.options-container {
    z-index: var(--zx-z-page-popup);
}