@sava-info-systems/api-maker-with-extensions 2.2.1 → 3.0.0

package/dist/assets/styles/colors-light.scss

@@ -1,22 +1,466 @@
 @import "variables";
 
+// =====================================================================
+// LIGHT THEME — brand parity with the dark theme.
+// Surfaces are white / cool-grey; accents are brand blue (#0C53A4) + green (#00893F).
+// Text is dark for readability. Mirrors the dark-theme brand overrides.
+// =====================================================================
 html.LIGHT {
-    $default-font-color: #525252;
-    scrollbar-color: #bec1c5 #fff; // firefox scrollbar
-    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAxMC8yOS8xMiKqq3kAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzVxteM2AAABHklEQVRIib2Vyw6EIAxFW5idr///Qx9sfG3pLEyJ3tAwi5EmBqRo7vHawiEEERHS6x7MTMxMVv6+z3tPMUYSkfTM/R0fEaG2bbMv+Gc4nZzn+dN4HAcREa3r+hi3bcuu68jLskhVIlW073tWaYlQ9+F9IpqmSfq+fwskhdO/AwmUTJXrOuaRQNeRkOd5lq7rXmS5InmERKoER/QMvUAPlZDHcZRhGN4CSeGY+aHMqgcks5RrHv/eeh455x5KrMq2yHQdibDO6ncG/KZWL7M8xDyS1/MIO0NJqdULLS81X6/X6aR0nqBSJcPeZnlZrzN477NKURn2Nus8sjzmEII0TfMiyxUuxphVWjpJkbx0btUnshRihVv70Bv8ItXq6Asoi/ZiCbU6YgAAAABJRU5ErkJggg==) !important;
+    $default-font-color: #2b3340;
+    scrollbar-color: #9bb8d8 #e6ebf2; // firefox scrollbar (soft brand-blue thumb on light track)
 
-    a {
+    // Light brand background: soft blue (top-left) -> white -> green (bottom-right) + faint streaks.
+    background-color: #eef2f7;
+    background-image:
+        repeating-linear-gradient(135deg, transparent 0 140px, rgba(12, 83, 164, 0.03) 140px 141px, transparent 141px 320px),
+        radial-gradient(120% 110% at 100% 100%, rgba(0, 137, 63, 0.10) 0%, rgba(0, 137, 63, 0) 55%),
+        radial-gradient(120% 110% at 0% 0%, rgba(12, 83, 164, 0.12) 0%, rgba(12, 83, 164, 0) 55%),
+        linear-gradient(135deg, #eef3f9 0%, #f4f6f9 45%, #eef5f0 100%);
+    background-repeat: no-repeat;
+    background-attachment: fixed;
+    background-size: cover;
+    color: $default-font-color;
+
+    a { color: #0C53A4; }
+
+    // Square-box grid overlay (behind everything, like dark theme).
+    body::before {
+        content: "";
+        position: fixed;
+        inset: 0;
+        pointer-events: none;
+        z-index: -1;
+        background-image:
+            linear-gradient(to right, rgba(12, 83, 164, 0.07) 1px, transparent 1px),
+            linear-gradient(to bottom, rgba(12, 83, 164, 0.07) 1px, transparent 1px);
+        background-size: 56px 56px;
+        -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 78%);
+        mask-image: radial-gradient(ellipse at center, black 30%, transparent 78%);
+    }
+
+    /* Scrollbar — muted brand gradient (light track) */
+    ::-webkit-scrollbar-track { background: #e6ebf2 !important; }
+    ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #aebfd6 0%, #9ec3b5 100%) !important; }
+    ::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #6f96c4 0%, #5fa98c 100%) !important; }
+
+    // Cards / modals — clean white surface, brand-blue tinted border.
+    .modal-body, .modal-footer, .card {
+        background-color: #ffffff;
+        background-image: none;   // was a #ffffff->#f5f8fc gradient that read as a grey tint
         color: $default-font-color;
     }
+    // Visible brand-blue divider between the body and the footer (Close/Save bar).
+    .modal-footer { border-top: 1px solid rgba(12, 83, 164, 0.15); }
+    .card { border: 1px solid rgba(12, 83, 164, 0.18); }
+
+    // Card / modal header — subtle brand wash.
+    .modal-header, .card-header {
+        background-color: #eef3fa;
+        background-image:
+            linear-gradient(90deg, rgba(12, 83, 164, 0.12) 0%, rgba(12, 83, 164, 0.04) 45%, rgba(0, 137, 63, 0.04) 70%, rgba(0, 137, 63, 0.10) 100%),
+            linear-gradient(180deg, #f3f7fc 0%, #e9eff6 100%);
+        border-bottom: 1px solid rgba(12, 83, 164, 0.18);
+        color: #1b2330;
+    }
+
+    // Round close button (light) — white surface + brand-blue hairline; danger wash on hover.
+    .modal-header .close,
+    .modal-content > .close {
+        background-color: rgba(255, 255, 255, 0.75);
+        border: 1px solid rgba(12, 83, 164, 0.22);
+        color: #5a6a82;
+        text-shadow: none;
+    }
+    .modal-header .close:hover,
+    .modal-content > .close:hover {
+        background-color: rgba(192, 57, 43, 0.12);
+        border-color: rgba(192, 57, 43, 0.45);
+        color: #c0392b;
+    }
+    .modal-header .close:focus,
+    .modal-content > .close:focus {
+        border-color: rgba(12, 83, 164, 0.5);
+        box-shadow: 0 0 0 0.2rem rgba(12, 83, 164, 0.18);
+    }
+
+    // Header action info/help glyph — brand blue (not the harsh Bootstrap cyan).
+    .modal-header > .float-right > span,
+    .modal-header > .float-right > span i.text-info {
+        color: #0C53A4 !important;
+    }
+    .modal-header > .float-right > span:hover i { color: #0a4585 !important; }
 
+    // Top nav bar — light brand wash.
     .navbar {
-        background: linear-gradient(to bottom, #ffffff 0%, #e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
-        border-bottom: 1px solid #cdcdcd;
+        background-color: #ffffff;
+        background-image:
+            linear-gradient(90deg, rgba(12, 83, 164, 0.10) 0%, rgba(12, 83, 164, 0) 38%, rgba(0, 137, 63, 0) 70%, rgba(0, 137, 63, 0.10) 100%),
+            linear-gradient(180deg, #ffffff 0%, #eef1f5 100%);
+        border-bottom: 1px solid #cdd6e2;
+    }
+    // Navbar menu text + icons must be dark on the light navbar (dark theme made them light/white).
+    .navbar .nav-link,
+    .navbar .navbar-nav .nav-link,
+    .navbar .nav-link .text-white,
+    .navbar .nav-link.text-white {
+        color: #1b2330;
+    }
+    // brand-blue dropdown-toggle menu labels
+    .navbar-nav .nav-item.dropdown > .nav-link.dropdown-toggle { color: #0C53A4; }
+
+    // Separator between the logo and the first menu item (Dashboard) — light mode.
+    .navbar .navbar-brand {
+        border-right: 1px solid rgba(12, 83, 164, 0.20);
+        //margin-right: 0.75rem !important;
+    }
+
+    // Vertical separator between top-level navbar menu items (light mode).
+    // Applies to menu items that have a dropdown; skips the .ml-auto spacers and the first item.
+    // Drawn as a short, vertically-centered line (via ::before) instead of a full-height border.
+    .navbar-nav > .nav-item.dropdown:not(.ml-auto) + .nav-item.dropdown:not(.ml-auto) {
+        position: relative;
+    }
+    .navbar-nav > .nav-item.dropdown:not(.ml-auto) + .nav-item.dropdown:not(.ml-auto)::before {
+        content: "";
+        position: absolute;
+        left: 0;
+        top: 50%;
+        transform: translateY(-50%);
+        height: 22px;
+        width: 1px;
+        background: rgba(12, 83, 164, 0.20);
+    }
+    //.navbar-nav > .nav-item.dropdown:not(.ml-auto) + .nav-item.dropdown:not(.ml-auto) > .nav-link {
+    //    margin-left: 2px;
+    //}
+
+    // Targeted vertical separators on the right side (left of the moon toggle, and before the Admin menu).
+    // Drawn as a short, vertically-centered line (via ::before) instead of a full-height
+    // border so the divider doesn't span the whole navbar height.
+    .navbar-nav > .nav-item.nav-divider-left {
+        position: relative;
+    }
+    .navbar-nav > .nav-item.nav-divider-left::before {
+        content: "";
+        position: absolute;
+        left: 0;
+        top: 50%;
+        transform: translateY(-50%);
+        height: 22px;
+        width: 1px;
+        background: rgba(12, 83, 164, 0.20);
+    }
+    .navbar-nav > .nav-item.nav-divider-left > .nav-link { padding-left: 0.85rem !important; }
+
+    // Separator between each right-side icon button (consecutive plain .nav-item, not dropdown/spacer).
+    // Keep the icon padding identical to dark (global 1rem) so icon widths match across themes —
+    // the divider is drawn without shrinking the icon's left padding.
+    .navbar-nav > .nav-item:not(.dropdown):not(.ml-auto) + .nav-item:not(.dropdown):not(.ml-auto) {
+        position: relative;
+    }
+    .navbar-nav > .nav-item:not(.dropdown):not(.ml-auto) + .nav-item:not(.dropdown):not(.ml-auto)::before {
+        content: "";
+        position: absolute;
+        left: 0;
+        top: 50%;
+        transform: translateY(-50%);
+        height: 20px;
+        width: 1px;
+        background: rgba(12, 83, 164, 0.16);
+    }
+
+    .navbar-nav .nav-link:hover {
+        background-image: linear-gradient(135deg, rgba(12, 83, 164, 0.14) 0%, rgba(0, 137, 63, 0.10) 100%);
+        border-radius: 2px;
+        color: #0C53A4;
+    }
+    .navbar-nav .nav-item.active > .nav-link,
+    .navbar-nav .nav-item.show > .nav-link,
+    .navbar-nav .nav-link.active,
+    .navbar-nav .nav-link.show {
+        background-image: linear-gradient(135deg, rgba(12, 83, 164, 0.32) 0%, rgba(10, 106, 95, 0.24) 55%, rgba(0, 137, 63, 0.26) 100%);
+        border-radius: 2px;
+        color: #0C53A4;
+        //box-shadow: inset 0 -2px 0 #0C53A4;
+    }
+
+    // Dropdown menu — light glass, brand-blue border.
+    // Frosted-glass menu popup — clearly translucent white so the blurred page
+    // shows through (a higher alpha just looked like flat white).
+    .dropdown-menu {
+        background: linear-gradient(160deg, rgba(255, 255, 255, 0.45) 0%, rgba(238, 243, 250, 0.38) 100%);
+        backdrop-filter: blur(22px) saturate(140%);
+        -webkit-backdrop-filter: blur(22px) saturate(140%);
+        border: 1px solid rgba(12, 83, 164, 0.22);
+        border-radius: 10px;
+        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9),
+                    0 12px 32px rgba(12, 30, 60, 0.14);
+    }
+    .dropdown-divider { border-top: 1px solid rgba(12, 83, 164, 0.18); }
+    .dropdown-item { color: #2b3340; border-radius: 2px; }
+    // Reduced-intensity brand wash on hover/active (was a full solid gradient).
+    .dropdown-item:hover, .dropdown-item:focus {
+        color: #0b2e5c !important;
+        background-color: transparent !important;
+        background-image: linear-gradient(135deg, rgba(12, 83, 164, 0.18) 0%, rgba(0, 137, 63, 0.12) 100%) !important;
+    }
+    .dropdown-item.active, .dropdown-item:active {
+        background-color: transparent !important;
+        background-image: linear-gradient(135deg, rgba(12, 83, 164, 0.24) 0%, rgba(0, 137, 63, 0.16) 100%) !important;
+        border: 1px solid rgba(12, 83, 164, 0.30) !important;
+        color: #0b2e5c !important;
+    }
+
+    // Inputs — white, brand-blue border + focus.
+    .form-control {
+        background-color: #ffffff;
+        border: 1px solid rgba(12, 83, 164, 0.25);
+        color: #2b3340;
+    }
+
+    // Input-group prefix/suffix boxes (e.g. an "Every" prefix before a dropdown) — white
+    // surface + brand-blue border matching the adjacent .form-control (was light/grey default).
+    .input-group-text {
+        background: #ffffff;
+        border: 1px solid rgba(12, 83, 164, 0.25);
+        color: #2b3340;
+    }
+
+    // Password show/hide toggle — light surface + brand-blue hairline matching
+    // the adjacent .form-control (was flat grey).
+    .input-group-text.input-pwd-toggle {
+        background: #f3f7fc;
+        border: 1px solid rgba(12, 83, 164, 0.25);
+        color: #4a5563;
+        transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
+    }
+    .input-group-text.input-pwd-toggle:hover {
+        background: rgba(12, 83, 164, 0.10);
+        border-color: rgba(12, 83, 164, 0.45);
+        color: #0C53A4;
+    }
+    .form-control:focus {
+        background-color: #ffffff;
+        border: 1px solid rgba(12, 83, 164, 0.6);
+        box-shadow: 0 0 0 0.2rem rgba(12, 83, 164, 0.18);
+    }
+
+    // Utility / structural borders.
+    .border, .border-left, .border-right, .border-top, .border-bottom {
+        border-color: rgba(12, 83, 164, 0.22) !important;
+    }
+    hr { border-top: 1px solid rgba(12, 83, 164, 0.15); }
+    .table-bordered th, .table-bordered td { border: 1px solid rgba(12, 83, 164, 0.15); }
+    .modal-content {
+        background-color: #ffffff;     // was inheriting the bootswatch cerulean shade (lavender-grey seam)
+        border-color: rgba(12, 83, 164, 0.20);
+    }
+
+    // Heading standard — brand blue (readable on the light surface).
+    h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: #0C53A4; }
+
+    // Buttons — brand blue->green gradient primary, brand green success, neutral secondary.
+    .btn-primary { background-color: #0C53A4; background-image: linear-gradient(135deg, #0C53A4 0%, #0a6a5f 55%, #00893F 100%); border: 1px solid rgba(12, 83, 164, 0.55); color: #fff; }
+    .btn-primary:not([disabled]):not(.disabled):hover,
+    .btn-primary:not([disabled]):not(.disabled):focus,
+    .btn-primary:not([disabled]):not(.disabled):active {
+        background-image: linear-gradient(135deg, #0e5fbd 0%, #0b7a6c 55%, #00a04a 100%); border-color: rgba(12, 83, 164, 0.7);
+    }
+    .btn-success { background-color: #00893F; background-image: linear-gradient(135deg, #00A04A 0%, #00893F 60%, #006e32 100%); border: 1px solid rgba(0, 137, 63, 0.6); color: #fff; }
+    // SEND button (api-testing filter-section) — brand blue -> green standard gradient.
+    .send-request-btn.btn-success { background-color: #0C53A4; background-image: linear-gradient(135deg, #0C53A4 0%, #0a6a5f 55%, #00893F 100%); border: 1px solid rgba(12, 83, 164, 0.55); color: #fff; }
+    .send-request-btn.btn-success:not([disabled]):not(.disabled):hover,
+    .send-request-btn.btn-success:not([disabled]):not(.disabled):focus,
+    .send-request-btn.btn-success:not([disabled]):not(.disabled):active {
+        background-image: linear-gradient(135deg, #0e5fbd 0%, #0b7a6c 55%, #00a04a 100%); border-color: rgba(12, 83, 164, 0.7);
+    }
+    .btn-secondary {
+        background-color: #eef2f7;
+        background-image: linear-gradient(180deg, #f4f7fb 0%, #e6ecf4 100%);
+        border: 1px solid rgba(12, 83, 164, 0.25);
+        color: #2b3340;
+    }
+    .btn-secondary:not([disabled]):not(.disabled):hover,
+    .btn-secondary:not([disabled]):not(.disabled):focus,
+    .btn-secondary:not([disabled]):not(.disabled):active {
+        background-image: linear-gradient(180deg, #e6ecf4 0%, #d9e2ee 100%);
+        border-color: rgba(12, 83, 164, 0.4);
+        color: #1b2330;
+        filter: none;
+    }
+
+    // Outline buttons — proper colored border + matching text on a transparent/white bg (light mode).
+    .btn-outline-primary {
+        color: #0C53A4 !important;
+        border: 1px solid #0C53A4 !important;
+        background-color: transparent !important; background-image: none !important;
+    }
+    .btn-outline-primary:not([disabled]):not(.disabled):hover,
+    .btn-outline-primary:not([disabled]):not(.disabled):focus,
+    .btn-outline-primary:not([disabled]):not(.disabled):active {
+        color: #fff !important;
+        background-color: #0C53A4 !important; background-image: none !important;
+        border-color: #0C53A4 !important;
+    }
+    .btn-outline-warning {
+        color: #b06a00 !important;
+        border: 1px solid #d99a07 !important;
+        background-color: transparent !important; background-image: none !important;
+    }
+    .btn-outline-warning:not([disabled]):not(.disabled):hover,
+    .btn-outline-warning:not([disabled]):not(.disabled):focus,
+    .btn-outline-warning:not([disabled]):not(.disabled):active {
+        color: #fff !important;
+        background-color: #d99a07 !important; background-image: none !important;
+        border-color: #d99a07 !important;
+    }
+    .btn-outline-danger {
+        color: #c0392b !important;
+        border: 1px solid #c0392b !important;
+        background-color: transparent !important; background-image: none !important;
+    }
+    .btn-outline-danger:not([disabled]):not(.disabled):hover,
+    .btn-outline-danger:not([disabled]):not(.disabled):focus,
+    .btn-outline-danger:not([disabled]):not(.disabled):active {
+        color: #fff !important;
+        background-color: #c0392b !important; background-image: none !important;
+        border-color: #c0392b !important;
+    }
+    .btn-outline-secondary {
+        color: #4a5563 !important;
+        border: 1px solid rgba(12, 83, 164, 0.30) !important;
+        background-color: transparent !important; background-image: none !important;
+    }
+    .btn-outline-secondary:not([disabled]):not(.disabled):hover,
+    .btn-outline-secondary:not([disabled]):not(.disabled):focus,
+    .btn-outline-secondary:not([disabled]):not(.disabled):active {
+        color: #1b2330 !important;
+        background-color: #e6ecf4 !important; background-image: none !important;
+        border-color: rgba(12, 83, 164, 0.45) !important;
+    }
+    .btn-outline-info {
+        color: #0C53A4 !important; border: 1px solid #0C53A4 !important;
+        background-color: transparent !important; background-image: none !important;
+    }
+    .btn-outline-info:not([disabled]):not(.disabled):hover,
+    .btn-outline-info:not([disabled]):not(.disabled):focus,
+    .btn-outline-info:not([disabled]):not(.disabled):active {
+        color: #fff !important; background-color: #0C53A4 !important; background-image: none !important; border-color: #0C53A4 !important;
+    }
+    .btn-outline-success {
+        color: #1a7a44 !important; border: 1px solid #00893F !important;
+        background-color: transparent !important; background-image: none !important;
+    }
+    .btn-outline-success:not([disabled]):not(.disabled):hover,
+    .btn-outline-success:not([disabled]):not(.disabled):focus,
+    .btn-outline-success:not([disabled]):not(.disabled):active {
+        color: #fff !important; background-color: #00893F !important; background-image: none !important; border-color: #00893F !important;
+    }
+    .btn-outline-light {
+        color: #4a5563 !important; border: 1px solid rgba(12, 83, 164, 0.25) !important;
+        background-color: transparent !important; background-image: none !important;
+    }
+    .btn-outline-light:not([disabled]):not(.disabled):hover,
+    .btn-outline-light:not([disabled]):not(.disabled):focus,
+    .btn-outline-light:not([disabled]):not(.disabled):active {
+        color: #1b2330 !important; background-color: #eef2f7 !important; background-image: none !important; border-color: rgba(12, 83, 164, 0.4) !important;
     }
 
     .footer {
-        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);
-        color: var(--dark-content-secondary--shade--three);
-        background: var(--content-primary--shade--one);
+        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .15);
+        color: #4a5563;
+        background: #eef2f7;
+    }
+
+    // Bright text-* utility colors that are unreadable on white → darker variants for light mode.
+    .text-yellow { color: #b8860b !important; }   // bright yellow #dbdb37 -> dark gold
+    .text-warning { color: #b8860b !important; }
+    .text-white, .text-light { color: #1b2330 !important; }   // white/light text -> dark on light surfaces
+    .text-muted { color: #6b7585 !important; }
+
+    // Request-method labels (GET/POST/PUT/DELETE) — darker, readable variants on white. Applies everywhere.
+    .get { color: #1a7a44 !important; }     // green  (was #26B47F)
+    .post { color: #b06a00 !important; }    // amber  (was #FFB400 — too light on white)
+    .put { color: #0C53A4 !important; }     // blue   (was #097BED)
+    .delete { color: #c0392b !important; }  // red    (was #ED4B48)
+    .patch { color: #7c3aed !important; }   // purple
+
+    // ALL white Font Awesome icons -> black/dark in light mode (via inline style OR .text-white/.text-light class).
+    i.fa, i.fas, i.far, i.fab, i.fa-solid, i.fa-regular, i.fa-brands,
+    .fa, .fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands {
+        &[style*="color: #fff"], &[style*="color:#fff"],
+        &[style*="color: white"], &[style*="color:white"],
+        &[style*="color: #FFF"], &[style*="color:#FFF"],
+        &[style*="color: #ffffff"], &[style*="color:#ffffff"],
+        &[style*="color: #FFFFFF"], &[style*="color:#FFFFFF"],
+        &.text-white, &.text-light {
+            color: #1b2330 !important;
+        }
+    }
+
+    // ...but FA icons INSIDE buttons / colored badges (brand gradient/colored bg) must stay WHITE.
+    .btn-primary, .btn-success, .btn-danger, .btn-info,
+    .p-button:not(.p-button-text):not(.p-button-outlined),
+    .badge, .p-tag, .login-submit-btn {
+        i.fa, i.fas, i.far, i.fab, .text-white, .text-light { color: #ffffff !important; }
+        color: #ffffff !important;
+    }
+    // outline buttons keep white icons only when filled (hover/focus/active).
+    // secondary & light fill with a LIGHT color, so their icons stay dark — excluded here.
+    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active,
+    .btn-outline-warning:hover, .btn-outline-warning:focus, .btn-outline-warning:active,
+    .btn-outline-danger:hover, .btn-outline-danger:focus, .btn-outline-danger:active,
+    .btn-outline-info:hover, .btn-outline-info:focus, .btn-outline-info:active,
+    .btn-outline-success:hover, .btn-outline-success:focus, .btn-outline-success:active {
+        i.fa, i.fas, i.far, i.fab { color: #ffffff !important; }
+    }
+
+    // ===== Prism.js code blocks — light theme =====
+    // index.html globally loads the dark "okaidia" Prism theme, so highlighted code
+    // (e.g. /utility/code-finder) stays dark even in light mode. Override the okaidia
+    // surface + token colors with a readable light scheme when the app is in light mode.
+    code[class*="language-"],
+    pre[class*="language-"] {
+        color: #2b3340 !important;
+        text-shadow: none !important;
+    }
+    // A <code> INSIDE a <pre> must stay transparent — only the <pre> carries the surface
+    // colour. Otherwise the inline <code> paints light boxes behind each text line, which
+    // show up as an unwanted highlight (esp. over the selected blue->green wash).
+    pre[class*="language-"] > code[class*="language-"] {
+        background: transparent !important;
+    }
+    :not(pre) > code[class*="language-"],
+    pre[class*="language-"] {
+        background: #f3f7fc !important;
+        border: 1px solid rgba(12, 83, 164, 0.15);
+    }
+    // Tokens — a calm light palette (brand-leaning) readable on the light surface.
+    .token.comment, .token.prolog, .token.doctype, .token.cdata { color: #7a869a !important; }
+    .token.punctuation { color: #5a6677 !important; }
+    .token.namespace { opacity: .7; }
+    .token.property, .token.tag, .token.constant, .token.symbol, .token.deleted { color: #b5316b !important; }
+    .token.boolean, .token.number { color: #9023a8 !important; }
+    .token.selector, .token.attr-name, .token.string, .token.char, .token.builtin, .token.inserted { color: #00893F !important; }
+    .token.operator, .token.entity, .token.url,
+    .language-css .token.string, .style .token.string, .token.variable { color: #5a6677 !important; }
+    .token.atrule, .token.attr-value, .token.function, .token.class-name { color: #b06a00 !important; }
+    .token.keyword { color: #0C53A4 !important; }
+    .token.regex, .token.important { color: #c45100 !important; }
+
+    // ===== Code-finder clickable Prism blocks — hover + selected (light) =====
+    pre.language-javascript {
+        border-radius: 8px;
+        transition: background-color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
+    }
+    pre.language-javascript:hover {
+        border-color: rgba(12, 83, 164, 0.30) !important;
+        box-shadow: 0 0 0 1px rgba(12, 83, 164, 0.12) inset;
+    }
+    pre.language-javascript.bg-primary {
+        background-image: linear-gradient(135deg, rgba(12, 83, 164, 0.16) 0%, rgba(0, 137, 63, 0.10) 100%) !important;
+        background-color: #dbe8fa !important;
+        border-color: rgba(12, 83, 164, 0.35) !important;
+        box-shadow: inset 3px 0 0 #0C53A4 !important;
     }
 }

package/dist/assets/styles/out/styles.css.map

@@ -1 +1 @@
-{"version":3,"sources":["variables.scss","styles.css","styles.scss"],"names":[],"mappings":"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","file":"styles.css","sourcesContent":["//$primary-color: #007bff;\n$min-width: 1349px;\n$primary-color: #7157cb;\n$primary-color-font: #eeeeee;\n$font-size: 0.875rem;\n$font-size-small: 0.775rem;\n//$shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075) !important; // it is bootstrap standard shadow-sm\n//$border-style: 1px solid #dee2e6;\n\n@font-face {\n    font-family: 'Verdana';\n    src: url('../fonts/Verdana.ttf');\n}\n\n@font-face {\n    font-family: 'JetBrains Mono';\n    src: url('../fonts/JetBrainsMonoRegular.ttf');\n}\n","/* You can add global styles to this file, and also import other style files */\n@font-face {\n  font-family: \"Verdana\";\n  src: url(\"../fonts/Verdana.ttf\");\n}\n@font-face {\n  font-family: \"JetBrains Mono\";\n  src: url(\"../fonts/JetBrainsMonoRegular.ttf\");\n}\nbody {\n  min-width: 1349px;\n}\n\n::-moz-selection {\n  /* Code for Firefox */\n}\n\n::-webkit-scrollbar {\n  width: 7px;\n  height: 7px;\n}\n\n/* Track */\n::-webkit-scrollbar-track {\n  background: transparent;\n  border-radius: 8px;\n}\n\n/* Handle */\n::-webkit-scrollbar-thumb {\n  background: #5b5b5b;\n  border-radius: 10px;\n}\n\n/* Handle on hover */\n::-webkit-scrollbar-thumb:hover {\n  background: #5b5b5b;\n}\n\n/* Hide HTML5 Up and Down arrows. */\ninput[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\ninput[type=number] {\n  -moz-appearance: textfield;\n}\n\n@keyframes fadein {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.cursor-pointer {\n  cursor: pointer;\n}\n\n.text-v-small {\n  font-size: 70%;\n}\n\n.mt-1px {\n  margin-top: 1px;\n}\n\n.mt--1px {\n  margin-top: -1px;\n}\n\n.mt--2px {\n  margin-top: -2px;\n}\n\n.dialog-text {\n  margin: 30px;\n  text-align: center;\n}\n\n.full-body {\n  height: calc(100vh - 56px);\n}\n\n.line-height-1-3 {\n  line-height: 1.3rem;\n}\n\n.line-height-1 {\n  line-height: 1rem;\n}\n\n.line-height-1-plain {\n  line-height: 1;\n}\n\n.icon-inside-table-cell {\n  text-align: center !important;\n  padding: 0 !important;\n  vertical-align: middle !important;\n  height: 30px;\n  width: 30px;\n}\n.icon-inside-table-cell img {\n  height: 20px;\n  width: 20px;\n}\n\n.font-monospaced {\n  font-family: \"JetBrains Mono\", SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n.font-verdana {\n  font-family: \"Verdana\", sans-serif;\n}\n\n.font-jetbrains-mono {\n  font-family: \"JetBrains Mono\", Monaco, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n.text-overflow-ellipsis {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.italic {\n  font-style: italic;\n}\n\n.w-10-nowrap {\n  width: 10px;\n  white-space: nowrap;\n}\n\n.btn-xsm-custom {\n  width: 30px;\n  height: 23px;\n  padding: 0;\n  line-height: 0.5;\n}\n\n.text-yellow {\n  color: #dbdb37;\n}\n\ntextarea {\n  resize: none;\n}\n\n.request-cancel-button {\n  position: absolute;\n  top: calc(50% + 40px);\n  left: calc(50% - 50px);\n  width: 100px;\n  margin: 0;\n  z-index: 2;\n  text-transform: uppercase;\n}\n\n.maximize-testing-tab {\n  position: absolute;\n  top: 0;\n  width: 100%;\n  left: 0;\n  height: calc(100vh - 26px);\n}\n\n.maximize-testing-panel {\n  position: absolute;\n  width: 100%;\n  top: 0;\n  border: 0;\n}\n\n.panel-body-h {\n  height: calc(100vh - 75px);\n}\n\n.tab-content-h {\n  height: calc(100vh - 80px);\n}\n\n.tab-content-h-maximize {\n  height: calc(100vh - 64px);\n}\n.tab-content-h-maximize .monaco-code-h {\n  height: calc(100vh - 100px) !important;\n}\n\n.api-list .monaco-code-h {\n  height: calc(100vh - 238px);\n}\n.api-list .index-maker-db-calls {\n  height: calc(100vh - 260px);\n}\n\n.api-list-test-hook .monaco-code-h {\n  height: calc(100vh - 312px - 48px);\n}\n\n.modal-full {\n  max-width: calc(100vw - 100px);\n}\n\n.table-no-padding td {\n  height: 30px;\n  padding: 0;\n}\n.table-no-padding td div {\n  min-height: 30px;\n  padding: 0.2rem 0.75rem;\n}\n.table-no-padding td div.selected-row {\n  background-color: rgba(47, 100, 115, 0.3411764706);\n}\n\n.font-label {\n  font-size: 0.875rem;\n}\n\n.highlightMatchedWord {\n  background: yellow !important;\n  color: black !important;\n  font-weight: bold !important;\n}\n\n.highlightLineHavingError {\n  border-bottom: 1px dashed red;\n}\n\n.parent-notes-modal .child-notes-grid {\n  height: calc(100% - 10px) !important;\n}\n\n.prevent-text-selection {\n  user-select: none;\n}\n\n.logs-collapse-div {\n  background: #3d3d3d;\n  height: 25px;\n}\n\n.p-tooltip-word-break-all .p-tooltip-text {\n  word-break: break-all;\n}\n\n.preHookCounter {\n  position: absolute;\n  right: 0.5em;\n  rotate: 270deg;\n  border-radius: 0.8em;\n  background-color: grey;\n  color: white;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 0.8em;\n  height: 1.5em;\n  min-width: 1.5em;\n}\n\n.postHookCounter {\n  position: absolute;\n  right: -0.5em;\n  rotate: 90deg;\n  border-radius: 0.8em;\n  background-color: grey;\n  color: white;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 0.8em;\n  height: 1.5em;\n  min-width: 1.5em;\n}\n\ndiv.delta-to-html .ql-size-huge {\n  font-size: xx-large;\n}\ndiv.delta-to-html pre {\n  display: block;\n  font-size: 87.5%;\n  color: inherit;\n  background: #1d1d1d;\n  padding: 10px;\n}\ndiv.delta-to-html table, div.delta-to-html td, div.delta-to-html th {\n  border: 1px solid grey;\n  text-align: left;\n}\ndiv.delta-to-html table {\n  border-collapse: collapse;\n  width: 100%;\n  display: table;\n  box-sizing: border-box;\n  text-indent: initial;\n  border-spacing: 2px;\n  background: #3b3b3b;\n  border-color: grey;\n}\ndiv.delta-to-html th, div.delta-to-html td {\n  padding: 6px;\n}\ndiv.delta-to-html tr:nth-of-type(odd) {\n  background: rgba(40, 40, 40, 0.7803921569);\n}\n\napp-fun-man-layout .custom-api-grid-height {\n  height: calc(100vh - 82px);\n}\n\napp-db-cell-layout app-w-instances .instance-grid-height {\n  height: calc(100vh - 94px);\n}\napp-db-cell-layout app-w-databases .database-grid-height {\n  height: calc(50vh - 68px);\n}\napp-db-cell-layout app-w-collections .collection-grid-height {\n  height: calc(50vh - 68px);\n}\n\napp-system-api-layout app-system-api-w .system-api-grid-height {\n  height: calc(100vh - 82px);\n}\n\napp-tp-api-layout app-w-supported-tp-api .system-api-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-event-man-layout app-events-grid .events-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-scheduler-man-layout app-scheduler-man-w .schedulers-grid-height {\n  height: calc(100vh - 82px);\n}\n\napp-web-socket-events-layout-grid app-web-socket-events-grid .ws-events-grid-height {\n  height: calc(100vh - 82px);\n}\n\napp-logprofile-layout app-w-logprofiles .log-profile-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-scanning-periods-layout app-w-scanning-periods .scanning-period-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-utility-classes-layout app-utility-classes-list .utility-classes-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-notes-layout app-notes-list .notes-grid-height {\n  height: calc(100vh - 86px);\n}\napp-notes-layout app-notes-form .notes-form-height {\n  height: calc(100vh - 94px);\n}\n\napp-notes-modal app-notes-list .notes-grid-height {\n  height: calc(100vh - 102px);\n}\napp-notes-modal app-notes-form .notes-form-height {\n  height: calc(100vh - 94px);\n}\n\napp-code-finder-modal app-code-finder-w .code-finder-height {\n  height: calc(100vh - 72px) !important;\n}\n\napp-root app-code-finder-w .code-finder-height {\n  height: calc(100vh - 52px);\n}\n\n.dropdown-menu {\n  z-index: 1051;\n}\n\na {\n  color: #aaa;\n}\n\n.p-tree-empty-message {\n  position: absolute;\n  width: 100%;\n  text-align: center;\n  padding-top: 20px;\n}\n\n.json-key {\n  color: #9d74af;\n}\n\n.json-val {\n  color: #6aab73;\n}\n\n#svgContainerId svg {\n  height: calc(100vh - 88px);\n  width: calc(100vw - 20px);\n}\n#svgContainerId rect, #svgContainerId text {\n  cursor: grab;\n}\n\n.p-datatable-header {\n  padding: 0 !important;\n}\n\n.width-300 {\n  width: 300px;\n}\n\n.width-50p {\n  width: 50%;\n}\n\n.p-datatable.p-datatable-hoverable-rows .p-datatable-tbody > tr:not(.p-highlight):hover {\n  background: none !important;\n  color: inherit !important;\n}\n\np-radioButton.inline-small-radio .p-radiobutton-label {\n  margin-bottom: 0 !important;\n}\n\n.word-break-all {\n  word-break: break-all;\n}\n\ndiv.p-datepicker.p-component {\n  z-index: 1052 !important;\n}\n\np-calendar.w-100 span.p-calendar {\n  width: 100%;\n}\np-calendar.w-100 span.p-calendar input {\n  background-color: #464646;\n}\n\np-calendar.form-control-sm {\n  padding-left: 0;\n}\np-calendar.form-control-sm input, p-calendar.form-control-sm button {\n  height: calc(1.5em + 0.5rem + 2px);\n  padding: 0.25rem 0.5rem;\n  font-size: 0.8203125rem;\n  line-height: 1.5;\n  border-radius: 0.2rem;\n}\np-calendar.form-control-sm input {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\np-calendar.form-control-sm button {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n\n#id_api_maker_deploy_file_upload .p-fileupload-content {\n  padding: 10px 0;\n  text-align: left;\n}\n#id_api_maker_deploy_file_upload .p-fileupload-content .p-fileupload-row div:nth-of-type(1) {\n  display: none;\n}\n#id_api_maker_deploy_file_upload .p-fileupload-content .p-fileupload-row div:nth-of-type(2) {\n  width: 75%;\n  padding: 0 0 0 10px;\n}\n#id_api_maker_deploy_file_upload .p-fileupload-content .p-fileupload-row div:nth-of-type(3) {\n  padding: 0;\n  text-align: center;\n}\n#id_api_maker_deploy_file_upload .p-fileupload-content .p-fileupload-row div:nth-of-type(4) {\n  padding: 0 10px 0 0;\n  width: 74px;\n}\n\n.id_ptree_db_master_config_outline .p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler {\n  margin-right: 0;\n  width: 1.5rem;\n  height: 1.5rem;\n}\n.id_ptree_db_master_config_outline .tree-width {\n  width: auto;\n}\n.id_ptree_db_master_config_outline .tree-width .p-tree-container {\n  display: table;\n}\n\np-dropdown .fix-height-issue {\n  height: 29px;\n}\n\n.grid-pill-custom-api {\n  font-size: x-small;\n  padding: 2px 5px;\n  border-radius: 3px;\n}\n\n.width-160 {\n  width: 160px;\n}\n\n.custom-dropdown-panel {\n  width: 400px;\n}","/* You can add global styles to this file, and also import other style files */\n@import \"variables\";\n@import \"monaco-editor-overrides.scss\";\n\nbody {\n    min-width: $min-width;\n    //font-family: 'PT Sans', sans-serif;\n}\n\n::-moz-selection { /* Code for Firefox */\n    //color: white;\n    //background: $primary-color;\n}\n\n::selection {\n    //color: white;\n    //background: $primary-color;\n}\n\n::-webkit-scrollbar { width: 7px; height: 7px; }\n\n/* Track */\n::-webkit-scrollbar-track {\n    background: transparent; border-radius: 8px;\n    //box-shadow: inset 0 0 5px gray;\n}\n\n/* Handle */\n::-webkit-scrollbar-thumb { background: #5b5b5b; border-radius: 10px; }\n\n/* Handle on hover */\n::-webkit-scrollbar-thumb:hover { background: #5b5b5b; }\n\n/* Hide HTML5 Up and Down arrows. */\ninput[type=\"number\"]::-webkit-outer-spin-button, input[type=\"number\"]::-webkit-inner-spin-button {\n    -webkit-appearance: none; margin: 0;\n}\n\n// Hide up & down arrows for number in firefox\ninput[type=\"number\"] { -moz-appearance: textfield; }\n\n// ==== animations ====\n@keyframes fadein { from { opacity: 0} to { opacity: 1} }\n\n\n// ==== common classes ====\n.cursor-pointer { cursor: pointer;}\n.text-v-small {font-size: 70%;}\n.mt-1px { margin-top: 1px }\n.mt--1px { margin-top: -1px; }\n.mt--2px { margin-top: -2px; }\n.dialog-text { margin: 30px;text-align: center;}\n.full-body { height: calc(100vh - 56px); } // 50 is giving scroll in log profile, 56 is working fine.\n.line-height-1-3 { line-height: 1.3rem;}\n.line-height-1 { line-height: 1rem;}\n.line-height-1-plain { line-height: 1;}\n\n.icon-inside-table-cell { text-align: center !important; padding: 0 !important; vertical-align: middle !important; height: 30px; width: 30px;\n    img {height: 20px; width: 20px;}\n}\n\n.font-monospaced { font-family: \"JetBrains Mono\", SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace}\n.font-verdana { font-family: 'Verdana', sans-serif; }\n.font-jetbrains-mono { font-family: \"JetBrains Mono\", Monaco, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", \"Courier New\", monospace;}\n\n.text-overflow-ellipsis {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n.italic { font-style: italic; }\n\n.w-10-nowrap {width: 10px; white-space: nowrap;}\n\n.btn-xsm-custom {\n    width: 30px;\n    height: 23px;\n    padding: 0;\n    line-height: 0.5;\n}\n\n.text-yellow { color: #dbdb37; }\n\ntextarea { resize: none; }\n\n.request-cancel-button { position: absolute; top: calc(50% + 40px); left: calc(50% - 50px); width: 100px; margin: 0; z-index: 2;\n    text-transform: uppercase; // if we remove this text is not showing.\n}\n.maximize-testing-tab { position: absolute; top: 0; width: 100%; left: 0; height: calc(100vh - 26px); }\n.maximize-testing-panel { position: absolute; width: 100%; top: 0; border: 0; }\n\n// API Testing page related styles\n.panel-body-h { height: calc(100vh - 75px); }\n.tab-content-h { height: calc(100vh - 80px); }\n.tab-content-h-maximize {\n    height: calc(100vh - 64px);\n    .monaco-code-h { height: calc(100vh - 100px) !important; }\n}\n.api-list {\n    .monaco-code-h { height: calc(100vh - 238px); }\n    .index-maker-db-calls { height: calc(100vh - 260px); }\n}\n.api-list-test-hook {\n    .monaco-code-h { height: calc(100vh - 312px - 48px); }\n}\n.modal-full { max-width: calc(100vw - 100px); }\n\n.table-no-padding {\n    td {\n        height: 30px;\n        padding: 0;\n        div { min-height: 30px; padding: .2rem .75rem; }\n        div.selected-row { background-color: #2f647357; }\n    }\n}\n.font-label { font-size: .875rem; }\n\n// monaco editor error highlight classes\n.highlightMatchedWord { background: yellow !important; color: black !important; font-weight: bold !important; }\n.highlightLineHavingError { border-bottom: 1px dashed red; }\n.parent-notes-modal .child-notes-grid { height: calc(100% - 10px) !important; }\n.prevent-text-selection { user-select: none; }\n\n.logs-collapse-div { background: #3d3d3d; height: 25px; }\n\n.p-tooltip-word-break-all .p-tooltip-text { word-break: break-all; }\n\n.preHookCounter {\n    position: absolute;\n    right: 0.5em;\n    //top: -16px !important;\n    rotate: 270deg;\n    border-radius: 0.8em;\n    background-color: grey;\n    color: white;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    font-size: 0.8em;\n    height: 1.5em;\n    min-width: 1.5em;\n}\n\n.postHookCounter {\n    position: absolute;\n    right: -0.5em;\n    //top: 13px !important;\n    rotate: 90deg;\n    border-radius: 0.8em;\n    background-color: grey;\n    color: white;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    font-size: 0.8em;\n    height: 1.5em;\n    min-width: 1.5em;\n}\n\n\n// delta to html override css\ndiv.delta-to-html {\n    .ql-size-huge {\n        font-size: xx-large;\n    }\n    pre {\n        display: block;\n        font-size: 87.5%;\n        color: inherit;\n        background: #1d1d1d;\n        padding: 10px;\n    }\n\n    table, td, th {\n        border: 1px solid grey;\n        text-align: left;\n    }\n\n    table {\n        border-collapse: collapse;\n        width: 100%;\n        display: table;\n        box-sizing: border-box;\n        text-indent: initial;\n        border-spacing: 2px;\n        background: #3b3b3b;\n        border-color: grey;\n    }\n\n    th, td {\n        padding: 6px;\n    }\n    tr:nth-of-type(odd) {\n        background: #282828c7;\n    }\n}\n\napp-fun-man-layout {\n    .custom-api-grid-height {\n        height: calc(100vh - 82px);\n    }\n}\n\napp-db-cell-layout {\n    app-w-instances {\n        .instance-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n\n    app-w-databases {\n        .database-grid-height {\n            height: calc(50vh - 68px);\n        }\n    }\n\n    app-w-collections {\n        .collection-grid-height {\n            height: calc(50vh - 68px);\n        }\n    }\n}\n\napp-system-api-layout {\n    app-system-api-w {\n        .system-api-grid-height {\n            height: calc(100vh - 82px);\n        }\n    }\n}\n\napp-tp-api-layout {\n    app-w-supported-tp-api {\n        .system-api-grid-height {\n            height: calc(100vh - 94px)\n        }\n    }\n}\n\napp-event-man-layout {\n    app-events-grid {\n        .events-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\n\napp-scheduler-man-layout {\n    app-scheduler-man-w {\n        .schedulers-grid-height {\n            height: calc(100vh - 82px);\n        }\n    }\n}\n\napp-web-socket-events-layout-grid {\n    app-web-socket-events-grid {\n        .ws-events-grid-height {\n            height: calc(100vh - 82px);\n        }\n    }\n}\n\napp-logprofile-layout {\n    app-w-logprofiles {\n        .log-profile-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\napp-scanning-periods-layout {\n    app-w-scanning-periods {\n        .scanning-period-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\napp-utility-classes-layout {\n    app-utility-classes-list {\n        .utility-classes-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\napp-notes-layout {\n    app-notes-list {\n        .notes-grid-height {\n            height: calc(100vh - 86px);\n        }\n    }\n    app-notes-form {\n        .notes-form-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\napp-notes-modal {\n    app-notes-list {\n        .notes-grid-height {\n            height: calc(100vh - 102px);\n        }\n    }\n    app-notes-form {\n        .notes-form-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\n\n\napp-code-finder-modal {\n    app-code-finder-w {\n        .code-finder-height {\n            height: calc(100vh - 72px) !important;\n        }\n    }\n}\n\napp-root {\n    app-code-finder-w {\n        .code-finder-height {\n            height: calc(100vh - 52px);\n        }\n    }\n}\n\n.dropdown-menu { z-index: 1051; }\na { color: #aaa; }\n\n.p-tree-empty-message {\n    position: absolute;\n    width: 100%;\n    text-align: center;\n    padding-top: 20px;\n}\n\n.json-key {\n    color: #9d74af;\n}\n\n.json-val {\n    color: #6aab73;\n}\n\n#svgContainerId {\n    svg {\n        height: calc(100vh - 88px);\n        width: calc(100vw - 20px);\n    }\n    rect, text { cursor: grab; }\n}\n\n.p-datatable-header { padding: 0 !important; }\n\n.width-300 { width: 300px; }\n.width-50p { width: 50%; }\n\n.p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):hover {\n    background: none !important;\n    color: inherit !important;\n}\n\np-radioButton.inline-small-radio {\n    .p-radiobutton-label { margin-bottom: 0 !important; }\n}\n\n.word-break-all { word-break: break-all; }\ndiv.p-datepicker.p-component { z-index: 1052 !important; }\np-calendar.w-100 {\n    span.p-calendar {\n        width: 100%;\n        input { background-color: #464646; }\n    }\n}\n\n\np-calendar.form-control-sm {\n    padding-left: 0;\n    input, button {\n        height: calc(1.5em + 0.5rem + 2px);\n        padding: 0.25rem 0.5rem;\n        font-size: 0.8203125rem;\n        line-height: 1.5;\n        border-radius: 0.2rem;\n    }\n    input {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n    button {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n}\n\n#id_api_maker_deploy_file_upload {\n    .p-fileupload-content {\n        padding: 10px 0;\n        text-align: left;\n\n        .p-fileupload-row {\n            div:nth-of-type(1) { display: none; }\n            div:nth-of-type(2) { width: 75%; padding: 0 0 0 10px; }\n            div:nth-of-type(3) { padding: 0; text-align: center; }\n            div:nth-of-type(4) { padding: 0 10px 0 0; width: 74px; }\n        }\n    }\n}\n\n.id_ptree_db_master_config_outline {\n    .p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler {\n        margin-right: 0;\n        width: 1.5rem;\n        height: 1.5rem;\n    }\n\n    .tree-width {\n        width: auto;\n        .p-tree-container { display: table; } // It expands red highlight of tree item otherwise it doesn't fully expand.\n    }\n}\n\np-dropdown .fix-height-issue { height: 29px; }\n.grid-pill-custom-api { font-size: x-small; padding: 2px 5px; border-radius: 3px; }\n.width-160 { width: 160px; }\n.custom-dropdown-panel { width: 400px; }"]}
+{"version":3,"sources":["variables.scss","styles.css","styles.scss"],"names":[],"mappings":"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","file":"styles.css","sourcesContent":["//$primary-color: #007bff;\n$min-width: 1349px;\n$primary-color: #7157cb;\n$primary-color-font: #eeeeee;\n$font-size: 0.875rem;\n$font-size-small: 0.775rem;\n//$shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075) !important; // it is bootstrap standard shadow-sm\n//$border-style: 1px solid #dee2e6;\n\n@font-face {\n    font-family: 'Verdana';\n    src: url('../fonts/Verdana.ttf');\n}\n\n@font-face {\n    font-family: 'JetBrains Mono';\n    src: url('../fonts/JetBrainsMonoRegular.ttf');\n}\n","/* You can add global styles to this file, and also import other style files */\n@font-face {\n  font-family: \"Verdana\";\n  src: url(\"../fonts/Verdana.ttf\");\n}\n@font-face {\n  font-family: \"JetBrains Mono\";\n  src: url(\"../fonts/JetBrainsMonoRegular.ttf\");\n}\nbody {\n  min-width: 1349px;\n}\n\n::-moz-selection {\n  /* Code for Firefox */\n}\n\n::-webkit-scrollbar {\n  width: 7px;\n  height: 7px;\n}\n\n/* Track */\n::-webkit-scrollbar-track {\n  background: transparent;\n  border-radius: 8px;\n}\n\n/* Handle */\n::-webkit-scrollbar-thumb {\n  background: #5b5b5b;\n  border-radius: 10px;\n}\n\n/* Handle on hover */\n::-webkit-scrollbar-thumb:hover {\n  background: #5b5b5b;\n}\n\n/* Hide HTML5 Up and Down arrows. */\ninput[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\ninput[type=number] {\n  -moz-appearance: textfield;\n}\n\n@keyframes fadein {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.cursor-pointer {\n  cursor: pointer;\n}\n\n.text-v-small {\n  font-size: 70%;\n}\n\n.mt-1px {\n  margin-top: 1px;\n}\n\n.mt--1px {\n  margin-top: -1px;\n}\n\n.mt--2px {\n  margin-top: -2px;\n}\n\n.dialog-text {\n  margin: 30px;\n  text-align: center;\n}\n\n.full-body {\n  height: calc(100vh - 56px);\n}\n\n.line-height-1-3 {\n  line-height: 1.3rem;\n}\n\n.line-height-1 {\n  line-height: 1rem;\n}\n\n.line-height-1-plain {\n  line-height: 1;\n}\n\n.icon-inside-table-cell {\n  text-align: center !important;\n  padding: 0 !important;\n  vertical-align: middle !important;\n  height: 30px;\n  width: 30px;\n}\n.icon-inside-table-cell img {\n  height: 20px;\n  width: 20px;\n}\n\n.font-monospaced {\n  font-family: \"JetBrains Mono\", SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n.font-verdana {\n  font-family: \"Verdana\", sans-serif;\n}\n\n.font-jetbrains-mono {\n  font-family: \"JetBrains Mono\", Monaco, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n.text-overflow-ellipsis {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.italic {\n  font-style: italic;\n}\n\n.w-10-nowrap {\n  width: 10px;\n  white-space: nowrap;\n}\n\n.btn-xsm-custom {\n  width: 30px;\n  height: 23px;\n  padding: 0;\n  line-height: 0.5;\n}\n\n.text-yellow {\n  color: #dbdb37;\n}\n\ntextarea {\n  resize: none;\n}\n\n.request-cancel-button {\n  position: absolute;\n  top: calc(50% + 40px);\n  left: calc(50% - 50px);\n  width: 100px;\n  margin: 0;\n  z-index: 2;\n  text-transform: uppercase;\n}\n\n.maximize-testing-tab {\n  position: absolute;\n  top: 0;\n  width: 100%;\n  left: 0;\n  height: calc(100vh - 26px);\n}\n\n.maximize-testing-panel {\n  position: absolute;\n  width: 100%;\n  top: 0;\n  border: 0;\n}\n\n.panel-body-h {\n  height: calc(100vh - 75px);\n}\n\n.tab-content-h {\n  height: calc(100vh - 80px);\n}\n\n.tab-content-h-maximize {\n  height: calc(100vh - 64px);\n}\n.tab-content-h-maximize .monaco-code-h {\n  height: calc(100vh - 100px) !important;\n}\n\n.api-list .monaco-code-h {\n  height: calc(100vh - 238px);\n}\n.api-list .index-maker-db-calls {\n  height: calc(100vh - 260px);\n}\n\n.api-list-test-hook .monaco-code-h {\n  height: calc(100vh - 312px - 48px);\n}\n\n.modal-full {\n  max-width: calc(100vw - 100px);\n}\n\n.table-no-padding td {\n  height: 30px;\n  padding: 0;\n}\n.table-no-padding td div {\n  min-height: 30px;\n  padding: 0.2rem 0.75rem;\n}\n.table-no-padding td div.selected-row {\n  background-color: rgba(47, 100, 115, 0.3411764706);\n}\n\n.font-label {\n  font-size: 0.875rem;\n}\n\n.highlightMatchedWord {\n  background: yellow !important;\n  color: black !important;\n  font-weight: bold !important;\n}\n\n.highlightLineHavingError {\n  border-bottom: 1px dashed red;\n}\n\n.parent-notes-modal .child-notes-grid {\n  height: calc(100% - 10px) !important;\n}\n\n.prevent-text-selection {\n  user-select: none;\n}\n\n.logs-collapse-div {\n  background: #3d3d3d;\n  height: 25px;\n}\n\n.p-tooltip-word-break-all .p-tooltip-text {\n  word-break: break-all;\n}\n\n.preHookCounter {\n  position: absolute;\n  right: 0.5em;\n  rotate: 270deg;\n  border-radius: 0.8em;\n  background-color: grey;\n  color: white;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 0.8em;\n  height: 1.5em;\n  min-width: 1.5em;\n}\n\n.postHookCounter {\n  position: absolute;\n  right: -0.5em;\n  rotate: 90deg;\n  border-radius: 0.8em;\n  background-color: grey;\n  color: white;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 0.8em;\n  height: 1.5em;\n  min-width: 1.5em;\n}\n\ndiv.delta-to-html .ql-size-huge {\n  font-size: xx-large;\n}\ndiv.delta-to-html pre {\n  display: block;\n  font-size: 87.5%;\n  color: inherit;\n  background: #1d1d1d;\n  padding: 10px;\n}\ndiv.delta-to-html table, div.delta-to-html td, div.delta-to-html th {\n  border: 1px solid grey;\n  text-align: left;\n}\ndiv.delta-to-html table {\n  border-collapse: collapse;\n  width: 100%;\n  display: table;\n  box-sizing: border-box;\n  text-indent: initial;\n  border-spacing: 2px;\n  background: #3b3b3b;\n  border-color: grey;\n}\ndiv.delta-to-html th, div.delta-to-html td {\n  padding: 6px;\n}\ndiv.delta-to-html tr:nth-of-type(odd) {\n  background: rgba(40, 40, 40, 0.7803921569);\n}\n\napp-fun-man-layout .custom-api-grid-height {\n  height: calc(100vh - 82px);\n}\n\napp-db-cell-layout app-w-instances .instance-grid-height {\n  height: calc(100vh - 94px);\n}\napp-db-cell-layout app-w-databases .database-grid-height {\n  height: calc(50vh - 68px);\n}\napp-db-cell-layout app-w-collections .collection-grid-height {\n  height: calc(50vh - 68px);\n}\n\napp-system-api-layout app-system-api-w .system-api-grid-height {\n  height: calc(100vh - 82px);\n}\n\napp-tp-api-layout app-w-supported-tp-api .system-api-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-event-man-layout app-events-grid .events-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-scheduler-man-layout app-scheduler-man-w .schedulers-grid-height {\n  height: calc(100vh - 82px);\n}\n\napp-web-socket-events-layout-grid app-web-socket-events-grid .ws-events-grid-height {\n  height: calc(100vh - 82px);\n}\n\napp-logprofile-layout app-w-logprofiles .log-profile-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-scanning-periods-layout app-w-scanning-periods .scanning-period-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-utility-classes-layout app-utility-classes-list .utility-classes-grid-height {\n  height: calc(100vh - 94px);\n}\n\napp-notes-layout app-notes-list .notes-grid-height {\n  height: calc(100vh - 86px);\n}\napp-notes-layout app-notes-form .notes-form-height {\n  height: calc(100vh - 94px);\n}\n\napp-notes-modal app-notes-list .notes-grid-height {\n  height: calc(100vh - 102px);\n}\napp-notes-modal app-notes-form .notes-form-height {\n  height: calc(100vh - 94px);\n}\n\napp-code-finder-modal app-code-finder-w .code-finder-height {\n  height: calc(100vh - 72px) !important;\n}\n\napp-root app-code-finder-w .code-finder-height {\n  height: calc(100vh - 52px);\n}\n\n.dropdown-menu {\n  z-index: 1051;\n}\n\na {\n  color: #aaa;\n}\n\n.p-tree-empty-message {\n  position: absolute;\n  width: 100%;\n  text-align: center;\n  padding-top: 20px;\n}\n\n.json-key {\n  color: #9d74af;\n}\n\n.json-val {\n  color: #6aab73;\n}\n\n#svgContainerId svg {\n  height: calc(100vh - 88px);\n  width: calc(100vw - 20px);\n}\n#svgContainerId rect, #svgContainerId text {\n  cursor: grab;\n}\n\n.p-datatable-header {\n  padding: 0 !important;\n}\n\n.width-300 {\n  width: 300px;\n}\n\n.width-50p {\n  width: 50%;\n}\n\n.p-datatable.p-datatable-hoverable-rows .p-datatable-tbody > tr:not(.p-highlight):hover {\n  background: none !important;\n  color: inherit !important;\n}\n\n.hook-count-cell .hook-add-icon {\n  opacity: 0;\n  font-size: 10px;\n  transition: opacity 0.15s;\n}\n\ntr:hover .hook-count-cell .hook-add-icon {\n  opacity: 1;\n}\n\np-radioButton.inline-small-radio .p-radiobutton-label {\n  margin-bottom: 0 !important;\n}\n\n.word-break-all {\n  word-break: break-all;\n}\n\ndiv.p-datepicker.p-component {\n  z-index: 1052 !important;\n}\n\np-calendar.w-100 span.p-calendar {\n  width: 100%;\n}\np-calendar.w-100 span.p-calendar input {\n  background-color: #464646;\n}\n\np-calendar.form-control-sm {\n  padding-left: 0;\n}\np-calendar.form-control-sm input, p-calendar.form-control-sm button {\n  height: calc(1.5em + 0.5rem + 2px);\n  padding: 0.25rem 0.5rem;\n  font-size: 0.8203125rem;\n  line-height: 1.5;\n  border-radius: 0.2rem;\n}\np-calendar.form-control-sm input {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\np-calendar.form-control-sm button {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n\n#id_api_maker_deploy_file_upload .p-fileupload-content {\n  padding: 10px 0;\n  text-align: left;\n}\n#id_api_maker_deploy_file_upload .p-fileupload-content .p-fileupload-row div:nth-of-type(1) {\n  display: none;\n}\n#id_api_maker_deploy_file_upload .p-fileupload-content .p-fileupload-row div:nth-of-type(2) {\n  width: 75%;\n  padding: 0 0 0 10px;\n}\n#id_api_maker_deploy_file_upload .p-fileupload-content .p-fileupload-row div:nth-of-type(3) {\n  padding: 0;\n  text-align: center;\n}\n#id_api_maker_deploy_file_upload .p-fileupload-content .p-fileupload-row div:nth-of-type(4) {\n  padding: 0 10px 0 0;\n  width: 74px;\n}\n\n.id_ptree_db_master_config_outline .p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler {\n  margin-right: 0;\n  width: 1.5rem;\n  height: 1.5rem;\n}\n.id_ptree_db_master_config_outline .tree-width {\n  width: auto;\n}\n.id_ptree_db_master_config_outline .tree-width .p-tree-container {\n  display: table;\n}\n\np-dropdown .fix-height-issue {\n  height: 29px;\n}\n\n.grid-pill-custom-api {\n  font-size: x-small;\n  padding: 2px 5px;\n  border-radius: 3px;\n}\n\n.width-160 {\n  width: 160px;\n}\n\n.custom-dropdown-panel {\n  width: 400px;\n}\n\n.tv-zoom-toolbar {\n  position: absolute;\n  top: 4px;\n  right: 0;\n  z-index: 10;\n  pointer-events: auto;\n}\n\n.tv-zoom-btn {\n  width: 2rem;\n  height: 22px;\n  border: 1px solid hsl(0deg, 0%, 30.59%);\n  border-radius: 3px;\n  background: rgb(64, 64, 64);\n  color: #f0f0f0;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;\n  font-size: 12px;\n}\n.tv-zoom-btn:hover {\n  background: rgba(52, 58, 64, 0.96);\n  border-color: rgba(255, 255, 255, 0.4);\n  color: #ffffff;\n  transform: translateY(-1px);\n}\n.tv-zoom-btn:focus {\n  outline: none;\n  box-shadow: 0 0 0 0.15rem rgba(0, 123, 255, 0.35);\n}\n\n.table-viewer-shell--zoomed {\n  position: fixed !important;\n  inset: 0;\n  width: 100%;\n  height: 100% !important;\n  max-height: 100%;\n  z-index: 1080;\n  overflow: hidden;\n}\n.table-viewer-shell--zoomed .tv-zoom-toolbar {\n  top: 4px;\n  right: 0;\n}\n.table-viewer-shell--zoomed iframe {\n  width: 100%;\n  height: 100%;\n}\n\n.table-viewer-loader {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: rgba(30, 30, 30, 0.85);\n  z-index: 10;\n  pointer-events: none;\n}\n.table-viewer-loader__spinner {\n  width: 28px;\n  height: 28px;\n  border: 3px solid rgba(255, 255, 255, 0.15);\n  border-top-color: #097BED;\n  border-radius: 50%;\n  animation: table-viewer-spin 0.7s linear infinite;\n}\n\n@keyframes table-viewer-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}","/* You can add global styles to this file, and also import other style files */\n@import \"variables\";\n@import \"monaco-editor-overrides.scss\";\n\nbody {\n    min-width: $min-width;\n    //font-family: 'PT Sans', sans-serif;\n}\n\n::-moz-selection { /* Code for Firefox */\n    //color: white;\n    //background: $primary-color;\n}\n\n::selection {\n    //color: white;\n    //background: $primary-color;\n}\n\n::-webkit-scrollbar { width: 7px; height: 7px; }\n\n/* Track */\n::-webkit-scrollbar-track {\n    background: transparent; border-radius: 8px;\n    //box-shadow: inset 0 0 5px gray;\n}\n\n/* Handle */\n::-webkit-scrollbar-thumb { background: #5b5b5b; border-radius: 10px; }\n\n/* Handle on hover */\n::-webkit-scrollbar-thumb:hover { background: #5b5b5b; }\n\n/* Hide HTML5 Up and Down arrows. */\ninput[type=\"number\"]::-webkit-outer-spin-button, input[type=\"number\"]::-webkit-inner-spin-button {\n    -webkit-appearance: none; margin: 0;\n}\n\n// Hide up & down arrows for number in firefox\ninput[type=\"number\"] { -moz-appearance: textfield; }\n\n// ==== animations ====\n@keyframes fadein { from { opacity: 0} to { opacity: 1} }\n\n\n// ==== common classes ====\n.cursor-pointer { cursor: pointer;}\n.text-v-small {font-size: 70%;}\n.mt-1px { margin-top: 1px }\n.mt--1px { margin-top: -1px; }\n.mt--2px { margin-top: -2px; }\n.dialog-text { margin: 30px;text-align: center;}\n.full-body { height: calc(100vh - 56px); } // 50 is giving scroll in log profile, 56 is working fine.\n.line-height-1-3 { line-height: 1.3rem;}\n.line-height-1 { line-height: 1rem;}\n.line-height-1-plain { line-height: 1;}\n\n.icon-inside-table-cell { text-align: center !important; padding: 0 !important; vertical-align: middle !important; height: 30px; width: 30px;\n    img {height: 20px; width: 20px;}\n}\n\n.font-monospaced { font-family: \"JetBrains Mono\", SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace}\n.font-verdana { font-family: 'Verdana', sans-serif; }\n.font-jetbrains-mono { font-family: \"JetBrains Mono\", Monaco, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", \"Courier New\", monospace;}\n\n.text-overflow-ellipsis {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n.italic { font-style: italic; }\n\n.w-10-nowrap {width: 10px; white-space: nowrap;}\n\n.btn-xsm-custom {\n    width: 30px;\n    height: 23px;\n    padding: 0;\n    line-height: 0.5;\n}\n\n.text-yellow { color: #dbdb37; }\n\ntextarea { resize: none; }\n\n.request-cancel-button { position: absolute; top: calc(50% + 40px); left: calc(50% - 50px); width: 100px; margin: 0; z-index: 2;\n    text-transform: uppercase; // if we remove this text is not showing.\n}\n.maximize-testing-tab { position: absolute; top: 0; width: 100%; left: 0; height: calc(100vh - 26px); }\n.maximize-testing-panel { position: absolute; width: 100%; top: 0; border: 0; }\n\n// API Testing page related styles\n.panel-body-h { height: calc(100vh - 75px); }\n.tab-content-h { height: calc(100vh - 80px); }\n.tab-content-h-maximize {\n    height: calc(100vh - 64px);\n    .monaco-code-h { height: calc(100vh - 100px) !important; }\n}\n.api-list {\n    .monaco-code-h { height: calc(100vh - 238px); }\n    .index-maker-db-calls { height: calc(100vh - 260px); }\n}\n.api-list-test-hook {\n    .monaco-code-h { height: calc(100vh - 312px - 48px); }\n}\n.modal-full { max-width: calc(100vw - 100px); }\n\n.table-no-padding {\n    td {\n        height: 30px;\n        padding: 0;\n        div { min-height: 30px; padding: .2rem .75rem; }\n        div.selected-row { background-color: #2f647357; }\n    }\n}\n.font-label { font-size: .875rem; }\n\n// monaco editor error highlight classes\n.highlightMatchedWord { background: yellow !important; color: black !important; font-weight: bold !important; }\n.highlightLineHavingError { border-bottom: 1px dashed red; }\n.parent-notes-modal .child-notes-grid { height: calc(100% - 10px) !important; }\n.prevent-text-selection { user-select: none; }\n\n.logs-collapse-div { background: #3d3d3d; height: 25px; }\n\n.p-tooltip-word-break-all .p-tooltip-text { word-break: break-all; }\n\n.preHookCounter {\n    position: absolute;\n    right: 0.5em;\n    //top: -16px !important;\n    rotate: 270deg;\n    border-radius: 0.8em;\n    background-color: grey;\n    color: white;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    font-size: 0.8em;\n    height: 1.5em;\n    min-width: 1.5em;\n}\n\n.postHookCounter {\n    position: absolute;\n    right: -0.5em;\n    //top: 13px !important;\n    rotate: 90deg;\n    border-radius: 0.8em;\n    background-color: grey;\n    color: white;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    font-size: 0.8em;\n    height: 1.5em;\n    min-width: 1.5em;\n}\n\n\n// delta to html override css\ndiv.delta-to-html {\n    .ql-size-huge {\n        font-size: xx-large;\n    }\n    pre {\n        display: block;\n        font-size: 87.5%;\n        color: inherit;\n        background: #1d1d1d;\n        padding: 10px;\n    }\n\n    table, td, th {\n        border: 1px solid grey;\n        text-align: left;\n    }\n\n    table {\n        border-collapse: collapse;\n        width: 100%;\n        display: table;\n        box-sizing: border-box;\n        text-indent: initial;\n        border-spacing: 2px;\n        background: #3b3b3b;\n        border-color: grey;\n    }\n\n    th, td {\n        padding: 6px;\n    }\n    tr:nth-of-type(odd) {\n        background: #282828c7;\n    }\n}\n\napp-fun-man-layout {\n    .custom-api-grid-height {\n        height: calc(100vh - 82px);\n    }\n}\n\napp-db-cell-layout {\n    app-w-instances {\n        .instance-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n\n    app-w-databases {\n        .database-grid-height {\n            height: calc(50vh - 68px);\n        }\n    }\n\n    app-w-collections {\n        .collection-grid-height {\n            height: calc(50vh - 68px);\n        }\n    }\n}\n\napp-system-api-layout {\n    app-system-api-w {\n        .system-api-grid-height {\n            height: calc(100vh - 82px);\n        }\n    }\n}\n\napp-tp-api-layout {\n    app-w-supported-tp-api {\n        .system-api-grid-height {\n            height: calc(100vh - 94px)\n        }\n    }\n}\n\napp-event-man-layout {\n    app-events-grid {\n        .events-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\n\napp-scheduler-man-layout {\n    app-scheduler-man-w {\n        .schedulers-grid-height {\n            height: calc(100vh - 82px);\n        }\n    }\n}\n\napp-web-socket-events-layout-grid {\n    app-web-socket-events-grid {\n        .ws-events-grid-height {\n            height: calc(100vh - 82px);\n        }\n    }\n}\n\napp-logprofile-layout {\n    app-w-logprofiles {\n        .log-profile-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\napp-scanning-periods-layout {\n    app-w-scanning-periods {\n        .scanning-period-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\napp-utility-classes-layout {\n    app-utility-classes-list {\n        .utility-classes-grid-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\napp-notes-layout {\n    app-notes-list {\n        .notes-grid-height {\n            height: calc(100vh - 86px);\n        }\n    }\n    app-notes-form {\n        .notes-form-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\napp-notes-modal {\n    app-notes-list {\n        .notes-grid-height {\n            height: calc(100vh - 102px);\n        }\n    }\n    app-notes-form {\n        .notes-form-height {\n            height: calc(100vh - 94px);\n        }\n    }\n}\n\n\n\napp-code-finder-modal {\n    app-code-finder-w {\n        .code-finder-height {\n            height: calc(100vh - 72px) !important;\n        }\n    }\n}\n\napp-root {\n    app-code-finder-w {\n        .code-finder-height {\n            height: calc(100vh - 52px);\n        }\n    }\n}\n\n.dropdown-menu { z-index: 1051; }\na { color: #aaa; }\n\n.p-tree-empty-message {\n    position: absolute;\n    width: 100%;\n    text-align: center;\n    padding-top: 20px;\n}\n\n.json-key {\n    color: #9d74af;\n}\n\n.json-val {\n    color: #6aab73;\n}\n\n#svgContainerId {\n    svg {\n        height: calc(100vh - 88px);\n        width: calc(100vw - 20px);\n    }\n    rect, text { cursor: grab; }\n}\n\n.p-datatable-header { padding: 0 !important; }\n\n.width-300 { width: 300px; }\n.width-50p { width: 50%; }\n\n.p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):hover {\n    background: none !important;\n    color: inherit !important;\n}\n\n.hook-count-cell .hook-add-icon { opacity: 0; font-size: 10px; transition: opacity 0.15s; }\ntr:hover .hook-count-cell .hook-add-icon { opacity: 1; }\n\np-radioButton.inline-small-radio {\n    .p-radiobutton-label { margin-bottom: 0 !important; }\n}\n\n.word-break-all { word-break: break-all; }\ndiv.p-datepicker.p-component { z-index: 1052 !important; }\np-calendar.w-100 {\n    span.p-calendar {\n        width: 100%;\n        input { background-color: #464646; }\n    }\n}\n\n\np-calendar.form-control-sm {\n    padding-left: 0;\n    input, button {\n        height: calc(1.5em + 0.5rem + 2px);\n        padding: 0.25rem 0.5rem;\n        font-size: 0.8203125rem;\n        line-height: 1.5;\n        border-radius: 0.2rem;\n    }\n    input {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n    button {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n}\n\n#id_api_maker_deploy_file_upload {\n    .p-fileupload-content {\n        padding: 10px 0;\n        text-align: left;\n\n        .p-fileupload-row {\n            div:nth-of-type(1) { display: none; }\n            div:nth-of-type(2) { width: 75%; padding: 0 0 0 10px; }\n            div:nth-of-type(3) { padding: 0; text-align: center; }\n            div:nth-of-type(4) { padding: 0 10px 0 0; width: 74px; }\n        }\n    }\n}\n\n.id_ptree_db_master_config_outline {\n    .p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler {\n        margin-right: 0;\n        width: 1.5rem;\n        height: 1.5rem;\n    }\n\n    .tree-width {\n        width: auto;\n        .p-tree-container { display: table; } // It expands red highlight of tree item otherwise it doesn't fully expand.\n    }\n}\n\np-dropdown .fix-height-issue { height: 29px; }\n.grid-pill-custom-api { font-size: x-small; padding: 2px 5px; border-radius: 3px; }\n.width-160 { width: 160px; }\n.custom-dropdown-panel { width: 400px; }\n\n// ── Table viewer (iframe-based grid) ─────────────────────────────────────────\n// Fullscreen-zoom toggle button — absolutely positioned inside the container\n.tv-zoom-toolbar {\n    position: absolute;\n    top: 4px;\n    right: 0;\n    z-index: 10;\n    pointer-events: auto;\n}\n\n.tv-zoom-btn {\n    width: 2rem;\n    height: 22px;\n    border: 1px solid hsl(0deg 0% 30.59%);\n    //border-radius: 999px;\n    border-radius: 3px;\n    background: rgb(64 64 64);\n    color: #f0f0f0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;\n    font-size: 12px;\n\n    &:hover {\n        background: rgba(52, 58, 64, 0.96);\n        border-color: rgba(255, 255, 255, 0.4);\n        color: #ffffff;\n        transform: translateY(-1px);\n    }\n\n    &:focus {\n        outline: none;\n        box-shadow: 0 0 0 0.15rem rgba(0, 123, 255, 0.35);\n    }\n}\n\n// Zoomed state: shell covers entire viewport; toolbar stays absolutely positioned\n// inside the fixed shell so it anchors to the viewport corner.\n.table-viewer-shell--zoomed {\n    position: fixed !important;\n    inset: 0;\n    width: 100%;\n    height: 100% !important;\n    max-height: 100%;\n    z-index: 1080;\n    overflow: hidden;\n\n    .tv-zoom-toolbar {\n        top: 4px;\n        right: 0;\n    }\n\n    iframe {\n        width: 100%;\n        height: 100%;\n    }\n}\n\n.table-viewer-loader {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: rgba(30, 30, 30, 0.85);\n    z-index: 10;\n    pointer-events: none;\n\n    &__spinner {\n        width: 28px;\n        height: 28px;\n        border: 3px solid rgba(255, 255, 255, 0.15);\n        border-top-color: #097BED;\n        border-radius: 50%;\n        animation: table-viewer-spin 0.7s linear infinite;\n    }\n}\n\n@keyframes table-viewer-spin { to { transform: rotate(360deg); } }\n"]}