@charset "UTF-8";
@import url("zerocode_ext.css");

:root {
    --zv2-primary-rgb: 150, 118, 240;
    --zv2-secondary-rgb: 0, 212, 255;
    --zv2-warning-rgb: 255, 214, 0;
    --zv2-logo-violet-rgb: 176, 112, 239;
    --zv2-logo-blue-rgb: 141, 165, 241;
    --zv2-logo-cyan-rgb: 86, 218, 223;
    --zv2-structure-line: 1px solid rgba(var(--zv2-secondary-rgb), 0.18);

    --rz-form-field-filled-background-color: #0e192f;

    /* Light text on the translucent *-lighter tints (the zerocode_ext values are too dark for the navy background).
       Same colors as the .rz-color-on-*-lighter overrides below; also drives the hover of outlined buttons. */
    --rz-on-primary-lighter: #d4c4ff;
    --rz-on-secondary-lighter: #b3eef5;
    --rz-on-info-lighter: #b3dcff;
    --rz-on-success-lighter: #9ae6b4;
    --rz-on-warning-lighter: #ffe28a;
    --rz-on-danger-lighter: #ffb3b3;

    --rz-menu-item-hover-color: #e0d4ff;
    --rz-menu-item-icon-hover-color: #e0d4ff;
    --rz-menu-item-hover-background-color: rgba(var(--zv2-logo-violet-rgb), 0.22);
    --rz-menu-item-selected-color: #eae2ff;
    --rz-menu-item-selected-background-color: rgba(var(--zv2-logo-violet-rgb), 0.30);
    --rz-menu-top-item-hover-color: #c8f8ff;
    --rz-menu-top-item-icon-hover-color: #c8f8ff;
    --rz-menu-top-item-hover-background-color: rgba(var(--zv2-logo-cyan-rgb), 0.14);
    --rz-menu-top-item-selected-color: #d4faff;
    --rz-menu-top-item-selected-background-color: rgba(var(--zv2-logo-cyan-rgb), 0.20);
}

.fk-footertext {
    color: #42a5ab;
}

.rz-form-field.rz-variant-filled:not(.rz-state-disabled).rz-state-focused .rz-form-field-content,
.rz-form-field.rz-variant-filled:not(.rz-state-disabled).rz-state-focused:hover .rz-form-field-content {
    background-color: var(--rz-base-700);
}

/* Stronger gradient links, based on Zerocode colors */
.rz-link,
a.rz-link,
.goto-link,
.grid-goto-link {
    color: var(--rz-primary-light) !important;
    background-image: linear-gradient(135deg, var(--rz-primary-light) 0%, var(--rz-secondary-light) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-decoration-color: rgba(var(--zv2-primary-rgb), 0.45);
    transition: filter 0.25s ease, text-decoration-color 0.25s ease;
}

.rz-link:hover,
a.rz-link:hover,
.goto-link:hover,
.grid-goto-link:hover {
    filter: brightness(1.08);
    text-decoration-color: rgba(var(--zv2-secondary-rgb), 0.8);
}

/* Dark-Graf-like menu hover language, but in Zerocode palette */
.rz-menu:not(.rz-profile-menu):not(.grid-main-menu):not(.grid-side-menu) .rz-navigation-item-wrapper:hover,
.rz-menu:not(.rz-profile-menu):not(.grid-main-menu):not(.grid-side-menu) .rz-navigation-item-wrapper:has(> .active):hover,
.rz-menu:not(.rz-profile-menu):not(.grid-main-menu):not(.grid-side-menu) .rz-navigation-item-wrapper-active,
.rz-panel-menu .rz-navigation-item-wrapper:hover,
.rz-panel-menu .rz-navigation-item-wrapper-active,
.rz-panel-menu .rz-navigation-item-active {
    background-image: linear-gradient(
        135deg,
        rgba(var(--zv2-logo-violet-rgb), 0.35) 0%,
        rgba(var(--zv2-logo-blue-rgb), 0.26) 56%,
        rgba(var(--zv2-logo-cyan-rgb), 0.24) 100%
    ) !important;
}

.rz-panel-menu .rz-navigation-item-wrapper:hover,
.rz-panel-menu .rz-navigation-item-wrapper-active,
.rz-panel-menu .rz-navigation-item-active {
    box-shadow: inset 3px 0 0 rgb(var(--zv2-logo-violet-rgb)), 0 0 0 1px rgba(var(--zv2-logo-cyan-rgb), 0.24);
}

/* Grid menus stay clean and transparent */
.rz-menu.grid-main-menu .rz-navigation-item-wrapper:hover,
.rz-menu.grid-main-menu .rz-navigation-item-wrapper:has(> .active):hover,
.rz-menu.grid-side-menu .rz-navigation-item-wrapper:hover,
.rz-menu.grid-side-menu .rz-navigation-item-wrapper:has(> .active):hover {
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

.rz-row:has(.rz-menu.grid-main-menu):has(.rz-menu.grid-side-menu),
.rz-menu.grid-main-menu,
.rz-menu.grid-side-menu {
    background-color: transparent !important;
    background-image: none !important;
}

/* Active tab highlight for Zerocode V2 theme */
.rz-tabview-nav .rz-tabview-selected,
.rz-tabview-top > .rz-tabview-nav .rz-tabview-selected {
    background-color: #48a5b3bd !important;
}

.rz-sidebar-toggle {
    color: #f3f8ff !important;
}

.rz-sidebar-toggle .rzi {
    color: #f3f8ff !important;
}

.rz-sidebar-toggle:hover,
.rz-sidebar-toggle:focus-visible,
.rz-sidebar-toggle:hover .rzi,
.rz-sidebar-toggle:focus-visible .rzi {
    color: var(--rz-primary-light) !important;
}

.rz-selectable tbody tr.rz-data-row:hover:not(.rz-state-highlight) .rz-cell-data,
.rz-selectable tbody tr.rz-data-row:hover:not(.rz-state-highlight) .rz-cell-data a,
.rz-selectable tbody tr.rz-data-row:hover:not(.rz-state-highlight) .rz-cell-data .rz-link {
    color: var(--rz-primary-light) !important;
    -webkit-text-fill-color: currentColor;
    background-image: none;
}

.rz-button.rz-primary:not(.rz-variant-text):not(.rz-variant-outlined) {
    background-color: #7869c4 !important;
    background-image: linear-gradient(
        135deg,
        #7869c4 0%,
        #9587d0 56%,
        #94a3d8 100%
    ) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 3px 9px rgba(var(--zv2-primary-rgb), 0.18) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease, filter 0.3s ease !important;
}

.rz-button.rz-primary:not(.rz-variant-text):not(.rz-variant-outlined):not(.rz-state-disabled):not(:active):hover {
    transform: translateY(-1px);
    background-image: linear-gradient(
        135deg,
        #8270c8 0%,
        #9d8fd2 60%,
        #9caadb 100%
    ) !important;
    box-shadow: 0 5px 12px rgba(var(--zv2-primary-rgb), 0.22) !important;
}

.rz-button.rz-primary:not(.rz-variant-text):not(.rz-variant-outlined):not(.rz-state-disabled):active {
    transform: translateY(0);
    background-image: linear-gradient(
        135deg,
        #6e60b8 0%,
        #877dca 58%,
        #8fa1d2 100%
    ) !important;
    box-shadow: 0 2px 6px rgba(var(--zv2-primary-rgb), 0.18) !important;
}

/* Outlined Base buttons: subtle violet tint on hover instead of the theme's solid dark fill (--rz-base-darker). */
@media (hover: hover) and (pointer: fine) {
    .rz-button.rz-variant-outlined.rz-base:not(.rz-state-disabled):hover {
        background-color: rgba(var(--zv2-logo-violet-rgb), 0.18);
        color: var(--rz-text-color);
    }
}

.rz-button.rz-variant-outlined.rz-base:not(.rz-state-disabled):active {
    background-color: rgba(var(--zv2-logo-violet-rgb), 0.28);
    color: var(--rz-text-color);
}

.rz-button.rz-secondary:not(.rz-variant-text):not(.rz-variant-outlined) {
    background-color: #5cbac4 !important;
    background-image: linear-gradient(
        135deg,
        #5cbac4 0%,
        #6cc4c8 52%,
        #94a8d4 100%
    ) !important;
    border-color: rgba(var(--zv2-logo-cyan-rgb), 0.32) !important;
    color: #07101f !important;
    box-shadow: 0 5px 13px rgba(var(--zv2-logo-cyan-rgb), 0.18) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease, filter 0.3s ease !important;
}

.rz-button.rz-secondary:not(.rz-variant-text):not(.rz-variant-outlined):not(.rz-state-disabled):not(:active):hover {
    transform: translateY(-1px);
    background-image: linear-gradient(
        135deg,
        #6cc1cb 0%,
        #7ccacd 52%,
        #9eb1d8 100%
    ) !important;
    box-shadow: 0 8px 17px rgba(var(--zv2-logo-cyan-rgb), 0.24) !important;
}

.rz-button.rz-secondary:not(.rz-variant-text):not(.rz-variant-outlined):not(.rz-state-disabled):active {
    transform: translateY(0);
    background-image: linear-gradient(
        135deg,
        #4eaab4 0%,
        #61b5b9 54%,
        #8b9cce 100%
    ) !important;
    box-shadow: 0 3px 8px rgba(var(--zv2-logo-cyan-rgb), 0.16) !important;
}

span.rz-cell-data:focus-within:not(:has(.rz-chkbox)) {
    box-shadow: 0 0 0 2px rgba(var(--zv2-primary-rgb), 0.32), 0 0 18px rgba(var(--zv2-secondary-rgb), 0.2);
    box-sizing: border-box;
}

.rz-header {
    background: var(--rz-footer-background-color) !important;
    border-bottom: var(--zv2-structure-line);
    box-shadow: none;
}

/* Main menu (left sidebar): add a right divider like the header line */
.rz-sidebar.rz-sidebar-start,
.rz-sidebar.rz-sidebar-left,
.rz-layout > .rz-sidebar:first-of-type,
.rz-sidebar:not(.rz-sidebar-end):not(.rz-sidebar-right) {
    border-inline-end: var(--zv2-structure-line) !important;
}

/* Right sidebar: add the same divider on the left side */
.rz-sidebar.rz-sidebar-end,
.rz-sidebar.rz-sidebar-right {
    border-inline-start: var(--zv2-structure-line) !important;
}

/* Footer: same divider style, but on top */
.rz-footer {
    border-top: var(--zv2-structure-line) !important;
}

/* Site logo: subtle, slow pulse + shimmer sweep */
.headerLogo {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    animation: zerocodev2LogoPulse 8s ease-in-out infinite;
}

.headerLogo::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        108deg,
        transparent 0%,
        transparent 42%,
        rgba(255, 255, 255, 0.16) 50%,
        rgba(var(--zv2-logo-blue-rgb), 0.12) 57%,
        transparent 70%,
        transparent 100%
    );
    mix-blend-mode: screen;
    opacity: 0.24;
    transform: translateX(-145%);
    animation: zerocodev2LogoShimmer 16s ease-in-out infinite;
}

.rz-body {
    position: relative;
    background:
        radial-gradient(circle at 12% 78%, rgba(var(--zv2-logo-violet-rgb), 0.28) 0%, rgba(var(--zv2-logo-violet-rgb), 0) 44%),
        radial-gradient(circle at 82% 24%, rgba(var(--zv2-logo-blue-rgb), 0.24) 0%, rgba(var(--zv2-logo-blue-rgb), 0) 40%),
        radial-gradient(circle at 54% 96%, rgba(var(--zv2-logo-cyan-rgb), 0.2) 0%, rgba(var(--zv2-logo-cyan-rgb), 0) 32%),
        linear-gradient(128deg, #0a1222 0%, #0f1830 34%, #132347 63%, #0c152a 100%);
    background-size: 135% 135%, 125% 125%, 145% 145%, 100% 100%;
    background-position: 0% 72%, 100% 18%, 52% 100%, 0 0;
    background-attachment: fixed;
    background-repeat: no-repeat;
}
@keyframes zerocodev2LogoPulse {
    0% {
        filter:
            brightness(1.03)
            saturate(1.06)
            drop-shadow(0 0 6px rgba(var(--zv2-logo-cyan-rgb), 0.26))
            drop-shadow(0 0 4px rgba(var(--zv2-logo-violet-rgb), 0.2));
    }

    50% {
        filter:
            brightness(1.11)
            saturate(1.14)
            drop-shadow(0 0 14px rgba(var(--zv2-logo-cyan-rgb), 0.42))
            drop-shadow(0 0 10px rgba(var(--zv2-logo-violet-rgb), 0.28));
    }

    100% {
        filter:
            brightness(1.03)
            saturate(1.06)
            drop-shadow(0 0 6px rgba(var(--zv2-logo-cyan-rgb), 0.26))
            drop-shadow(0 0 4px rgba(var(--zv2-logo-violet-rgb), 0.2));
    }
}

@keyframes zerocodev2LogoShimmer {
    0% {
        transform: translateX(-145%);
    }

    80% {
        transform: translateX(-145%);
    }

    94% {
        transform: translateX(145%);
    }

    100% {
        transform: translateX(145%);
    }
}

.rz-dialog {
    border: 1px solid rgba(var(--zv2-secondary-rgb), 0.24);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.64), 0 0 0 1px rgba(255, 255, 255, 0.04) inset;
}

.rz-dialog-wrapper {
    background-color: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(3px) saturate(1.04);
}

.rz-dropdown-panel {
    border: 1px solid rgba(var(--zv2-secondary-rgb), 0.28);
    box-shadow:
        0 26px 64px rgba(0, 0, 0, 0.65),
        0 8px 22px rgba(0, 0, 0, 0.42),
        0 1px 0 rgba(255, 255, 255, 0.05) inset;
    transform: translateY(2px);
}

.rz-form-field.rz-state-focused {
    box-shadow: 0 0 0 1px rgba(var(--zv2-primary-rgb), 0.34), 0 0 14px rgba(var(--zv2-primary-rgb), 0.22);
}

/* ===== GenericTreeDropDown: light text for dark theme ===== */
.ggt-panel {
    color: #e8ecf2;
    border: 1px solid rgba(var(--zv2-secondary-rgb), 0.28);
    box-shadow:
        0 26px 64px rgba(0, 0, 0, 0.65),
        0 8px 22px rgba(0, 0, 0, 0.42),
        0 1px 0 rgba(255, 255, 255, 0.05) inset;
}

.ggt-panel .generic-group-tree .rz-treenode-label {
    color: #dce1ea;
}

.ggt-panel .generic-group-tree .rz-treenode-label:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #f0f3f8;
}

.ggt-panel .generic-group-tree .node-row.editing {
    background: rgba(255, 255, 255, 0.08);
    outline: 1px solid rgba(255, 255, 255, 0.12);
}

.ggt-panel .generic-group-tree .search-highlight {
    background-color: rgba(var(--zv2-logo-cyan-rgb), 0.35);
    color: #ffffff;
}

.ggt-panel .generic-group-tree .node-row.selected {
    background: rgba(var(--zv2-logo-cyan-rgb), 0.14);
    outline: 2px solid rgba(var(--zv2-logo-cyan-rgb), 0.4);
}

.ggt-panel .generic-group-tree.tree-select .rz-form-field {
    background: var(--rz-panel-background-color, #1a2236);
}
.plan-card-markdown code,
.plan-card-markdown code *,
.plan-card-markdown pre code,
.plan-card-markdown pre code *,
.plan-card-markdown a > code,
.plan-card-markdown a > code * {
    color: black !important;
    -webkit-text-fill-color: black !important;
}

/* Light alert/banner surfaces (rz-*-lighter): boost text contrast for the dark theme.
   Default Radzen on-*-lighter text is too dim against the tinted dark backgrounds. */
.rz-background-color-info-lighter.rz-color-on-info-lighter,
.rz-background-color-info-lighter .rz-color-on-info-lighter,
.rz-color-on-info-lighter {
    color: #b3dcff !important;
}

.rz-background-color-success-lighter.rz-color-on-success-lighter,
.rz-background-color-success-lighter .rz-color-on-success-lighter,
.rz-color-on-success-lighter {
    color: #9ae6b4 !important;
}

.rz-background-color-warning-lighter.rz-color-on-warning-lighter,
.rz-background-color-warning-lighter .rz-color-on-warning-lighter,
.rz-color-on-warning-lighter {
    color: #ffe28a !important;
}

.rz-background-color-danger-lighter.rz-color-on-danger-lighter,
.rz-background-color-danger-lighter .rz-color-on-danger-lighter,
.rz-color-on-danger-lighter {
    color: #ffb3b3 !important;
}

.rz-background-color-primary-lighter.rz-color-on-primary-lighter,
.rz-background-color-primary-lighter .rz-color-on-primary-lighter,
.rz-color-on-primary-lighter {
    color: #d4c4ff !important;
}

.rz-background-color-secondary-lighter.rz-color-on-secondary-lighter,
.rz-background-color-secondary-lighter .rz-color-on-secondary-lighter,
.rz-color-on-secondary-lighter {
    color: #b3eef5 !important;
}

/* Panel menu depth differentiation (Zerocode V2):
   Each `.rz-navigation-item` repetition in the selector represents one nesting level.
   The wrapper's own LI counts, so N chained `.rz-navigation-item` selectors match
   level N+ (cumulative — deeper rules win via specificity).
     N=2 → L2+   N=3 → L3+   N=4 → L4+
   Goal: keep L1/L2 untouched, give L3 a quiet base tint and L4 a stronger tint
   plus an accent rail, all within the violet/blue theme palette. */
.rz-panel-menu .rz-navigation-item .rz-navigation-item .rz-navigation-item .rz-navigation-item-wrapper {
    background-color: rgba(var(--zv2-logo-violet-rgb), 0.06);
}

.rz-panel-menu .rz-navigation-item .rz-navigation-item .rz-navigation-item .rz-navigation-item .rz-navigation-item-wrapper {
    background-color: rgba(var(--zv2-logo-blue-rgb), 0.14);
    box-shadow: inset 3px 0 0 rgba(var(--zv2-logo-blue-rgb), 0.6);
}

/* Preserve the L4 accent rail when the global hover/active gradient overlays the
   wrapper, so the depth cue does not disappear on selection. */
.rz-panel-menu .rz-navigation-item .rz-navigation-item .rz-navigation-item .rz-navigation-item .rz-navigation-item-wrapper:hover,
.rz-panel-menu .rz-navigation-item .rz-navigation-item .rz-navigation-item .rz-navigation-item .rz-navigation-item-wrapper-active,
.rz-panel-menu .rz-navigation-item .rz-navigation-item .rz-navigation-item .rz-navigation-item .rz-navigation-item-active {
    box-shadow: inset 3px 0 0 rgb(var(--zv2-logo-blue-rgb)), 0 0 0 1px rgba(var(--zv2-logo-blue-rgb), 0.32);
}
