@zolomedia/bifrost-client 1.7.75 → 1.7.77

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14,12 +14,8 @@
14
14
  * Philosophy:
15
15
  * - Semantic hierarchy (h0-h6 for document structure)
16
16
  * - Block-level text (paragraphs)
17
- * - NO styling, NO classes (dress up later)
18
- * - zReboot.css provides baseline (margins, font-sizes, line-height)
19
- *
20
- * zReboot Defaults (from zTheme):
21
- * - Headings: margin-top: 0, margin-bottom: 0.5rem, font-weight: 500, line-height: 1.2
22
- * - Paragraph: margin-top: 0, margin-bottom: 1rem
17
+ * - NO styling, NO classes here zbase.css owns the heading/paragraph baseline
18
+ * (sizes, weights, margins). These factories emit bare elements only.
23
19
  *
24
20
  * Dependencies:
25
21
  * - utils/dom_utils.js (createElement, setAttributes)
@@ -68,14 +64,9 @@ import { createElement, setAttributes } from '../../../zSys/dom/dom_utils.js';
68
64
  * - h3: Subsections
69
65
  * - h4-h6: Further nested subsections
70
66
  *
71
- * zReboot Defaults:
72
- * - h0: Custom zOS element (36-56px)
73
- * - h1: 2.5rem (40px)
74
- * - h2: 2rem (32px)
75
- * - h3: 1.75rem (28px)
76
- * - h4: 1.5rem (24px)
77
- * - h5: 1.25rem (20px)
78
- * - h6: 1rem (16px)
67
+ * Sizes (owned by zbase.css, not here):
68
+ * - h0: clamp(2.5rem, 5vw, 4rem) — zOS hero
69
+ * - h1: 2.5rem h2: 2rem h3: 1.75rem h4: 1.5rem h5: 1.25rem h6: 1rem
79
70
  *
80
71
  * @param {number} [level=1] - Heading level (0-6), enforced and capped
81
72
  * @param {Object} [attributes={}] - HTML attributes (id, class, data-*, etc.)
@@ -135,10 +126,7 @@ export function createHeading(level = 1, attributes = {}) {
135
126
  *
136
127
  * Used for blocks of text content (body copy, descriptions, etc.).
137
128
  * The most common text container in web documents.
138
- *
139
- * zReboot Defaults:
140
- * - margin-top: 0
141
- * - margin-bottom: 1rem
129
+ * Spacing/baseline owned by zbase.css; this factory emits a bare <p>.
142
130
  *
143
131
  * @param {Object} [attributes={}] - HTML attributes (id, class, data-*, etc.)
144
132
  * @returns {HTMLParagraphElement} The created paragraph element
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zolomedia/bifrost-client",
3
- "version": "1.7.75",
3
+ "version": "1.7.77",
4
4
  "description": "Browser client for zBifrost — the WebSocket bridge that turns JSON events from a zOS server into live DOM. Thin bootstrap + server-controlled core.",
5
5
  "homepage": "https://github.com/ZoloAi/zbifrost-client#readme",
6
6
  "repository": {
@@ -13,7 +13,7 @@
13
13
  * Philosophy:
14
14
  * - "Spacing first" - Rhythm and breathing room for all layouts
15
15
  * - Pure functions (input → output, no side effects)
16
- * - Uses zTheme spacing scale exclusively (0-5, auto, negative)
16
+ * - Uses zTheme spacing scale exclusively (0-5, plus zmx-auto for centering)
17
17
  * - Generates class names programmatically (no hardcoded strings)
18
18
  *
19
19
  * zTheme Spacing Scale:
@@ -23,8 +23,7 @@
23
23
  * - 3: 1rem (16px) Base unit
24
24
  * - 4: 1.5rem (24px)
25
25
  * - 5: 3rem (48px)
26
- * - auto: Auto (for centering)
27
- * - n1-n5: Negative margins (pull elements closer)
26
+ * - auto: horizontal centering only (zmx-auto)
28
27
  *
29
28
  * Dependencies:
30
29
  * - None (pure utility, no imports needed)
@@ -54,26 +53,26 @@
54
53
  /**
55
54
  * Generate margin class name (zTheme: zm-, zmt-, zmb-, zms-, zme-, zmx-, zmy-)
56
55
  *
57
- * Supports all zTheme margin patterns:
58
- * - All sides: zm-{0-5|auto}
59
- * - Top: zmt-{0-5|auto}
60
- * - Bottom: zmb-{0-5} (no auto)
61
- * - Start (left in LTR): zms-{0-5} (no auto)
62
- * - End (right in LTR): zme-{0-5|auto}
63
- * - X-axis (left + right): zmx-{0-5|auto}
64
- * - Y-axis (top + bottom): zmy-{0-5|auto}
65
- * - Negative: zm-n{1-5}, zmt-n{1-5}, zmb-n{1-5}, zms-n{1-5}, zme-n{1-5}, zmx-n{1-5}, zmy-n{1-5}
56
+ * Supports the zTheme margin patterns defined in zbase.css:
57
+ * - All sides: zm-{0-5}
58
+ * - Top: zmt-{0-5}
59
+ * - Bottom: zmb-{0-5}
60
+ * - Start (left in LTR): zms-{0-5}
61
+ * - End (right in LTR): zme-{0-5}
62
+ * - X-axis (left + right): zmx-{0-5} | zmx-auto
63
+ * - Y-axis (top + bottom): zmy-{0-5}
66
64
  *
67
- * @param {number|string|null} size - Size (0-5) or 'auto' or negative (e.g., -2)
65
+ * Note: 'auto' is supported only on the x-axis (zmx-auto, horizontal centering).
66
+ * Negative margins are not part of zbase and return null.
67
+ *
68
+ * @param {number|string|null} size - Size (0-5) or 'auto' (x-axis only)
68
69
  * @param {string} [side=''] - Side ('top', 'bottom', 'start', 'end', 'x', 'y', or '' for all)
69
70
  * @returns {string|null} Class name or null if invalid
70
71
  *
71
72
  * @example
72
73
  * getMarginClass(3); // 'zm-3' (all sides)
73
74
  * getMarginClass(4, 'top'); // 'zmt-4'
74
- * getMarginClass('auto'); // 'zm-auto'
75
75
  * getMarginClass('auto', 'x'); // 'zmx-auto' (horizontal centering)
76
- * getMarginClass(-2, 'top'); // 'zmt-n2' (negative margin, pull up)
77
76
  */
78
77
  export function getMarginClass(size, side = '') {
79
78
  // Handle null/undefined
@@ -93,22 +92,11 @@ export function getMarginClass(size, side = '') {
93
92
  };
94
93
  const sideSuffix = sideMap[side] || '';
95
94
 
96
- // Handle auto
95
+ // Handle auto — only zmx-auto exists in zbase (horizontal centering).
96
+ // Negative margins and other -auto sides were removed: nothing emitted them and
97
+ // zbase never defined the classes (they'd be silent no-ops).
97
98
  if (size === 'auto') {
98
- // Only these sides support auto in zTheme
99
- if (sideSuffix === '' || sideSuffix === 't' || sideSuffix === 'e' || sideSuffix === 'x' || sideSuffix === 'y') {
100
- return `zm${sideSuffix}-auto`;
101
- }
102
- return null; // zmb-auto and zms-auto don't exist
103
- }
104
-
105
- // Handle negative margins
106
- if (typeof size === 'number' && size < 0) {
107
- const absSize = Math.abs(size);
108
- if (absSize >= 1 && absSize <= 5) {
109
- return `zm${sideSuffix}-n${absSize}`;
110
- }
111
- return null;
99
+ return sideSuffix === 'x' ? 'zmx-auto' : null;
112
100
  }
113
101
 
114
102
  // Handle positive sizes (0-5)
@@ -9,8 +9,8 @@
9
9
  * Sections:
10
10
  * 0. Base color tokens (SSOT — --color-*)
11
11
  * 1. Reset
12
- * 2. Grid (zRow / zCol-* / zCol-auto, responsive xs→xl)
13
- * 3. Gutters (zG-0 … zG-5)
12
+ * 2. Grid (zRow / zCol / zCol-auto — minimal, used by zDash)
13
+ * 3. Gutters (zG-0 only)
14
14
  * 4. Flex utilities
15
15
  * 5. Display helpers (.zD-flex, .zD-block, etc.)
16
16
  * 6. Spacing helpers (.zm-*, .zp-*, .zme-*, .zms-*)
@@ -69,8 +69,17 @@ zvaf,
69
69
  zNavBar,
70
70
  zBifrostBadge { display: block; }
71
71
 
72
- /* ─── zOS heading extensions ──────────────────────────────────────────────── */
73
- /* h0: zOS system/hero heading not in HTML5 spec, used for page-level titles */
72
+ /* ─── zOS heading scale (zH0–zH6) ──────────────────────────────────────────── */
73
+ /* Bifrost owns the heading baseline so a bare <h1>…<h6> renders deliberately,
74
+ * identical to zCLI, with no app CSS. Apps re-skin via _zClass — they never
75
+ * SUPPLY the scale. h0 is the zOS system/hero heading (not in HTML5). */
76
+
77
+ h0, h1, h2, h3, h4, h5, h6 {
78
+ margin-top: 0;
79
+ margin-bottom: 0.5rem;
80
+ font-weight: 600;
81
+ line-height: 1.2;
82
+ }
74
83
 
75
84
  h0 {
76
85
  display: block;
@@ -78,10 +87,27 @@ h0 {
78
87
  font-weight: 800;
79
88
  line-height: 1.1;
80
89
  letter-spacing: -0.02em;
90
+ }
91
+
92
+ h1 { font-size: 2.5rem; font-weight: 700; line-height: 1.15; letter-spacing: -0.02em; }
93
+ h2 { font-size: 2rem; font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; }
94
+ h3 { font-size: 1.75rem; }
95
+ h4 { font-size: 1.5rem; }
96
+ h5 { font-size: 1.25rem; }
97
+ h6 { font-size: 1rem; }
98
+
99
+ /* ─── Paragraph (zText default) ────────────────────────────────────────────── */
100
+ /* Bifrost owns the <p> baseline so a bare zText carries deliberate vertical
101
+ * rhythm with no app CSS. Apps re-skin via _zClass — they never SUPPLY it. */
102
+
103
+ p {
81
104
  margin-top: 0;
82
- margin-bottom: 0.5rem;
105
+ margin-bottom: 1rem;
106
+ line-height: 1.5;
83
107
  }
84
108
 
109
+ p:last-child { margin-bottom: 0; }
110
+
85
111
  /* ─── zTheme semantic text colors — zCLI parity ───────────────────────────── */
86
112
  /* The client maps a header/text `color:` token → `.zText-<token>`. These are
87
113
  * the zOS defaults so `color: PRIMARY` paints in Bifrost without any _zClass,
@@ -128,6 +154,25 @@ blockquote {
128
154
 
129
155
  blockquote > p { margin: 0; }
130
156
 
157
+ /* ─── Preformatted block (zText semantic: pre) ─────────────────────────────── */
158
+ /* Plain <pre> baseline — bifrost-owned so a raw preformatted block renders
159
+ * deliberately. Language-tagged pre (pre-zolo, pre-js…) routes through Prism
160
+ * and is left alone. Apps re-skin via _zClass. */
161
+
162
+ pre {
163
+ margin: 0.75rem 0;
164
+ padding: 0.75rem 1rem;
165
+ font-family: 'SF Mono', 'Monaco', 'Courier New', monospace;
166
+ font-size: 0.88em;
167
+ line-height: 1.5;
168
+ color: inherit;
169
+ background: color-mix(in srgb, var(--color-code, #5CA9FF) 8%, transparent);
170
+ border: 1px solid color-mix(in srgb, var(--color-code, #5CA9FF) 22%, transparent);
171
+ border-radius: 8px;
172
+ overflow-x: auto;
173
+ white-space: pre;
174
+ }
175
+
131
176
  /* ─── Form controls — canonical field base (Bootstrap-like) ────────────────── */
132
177
  /* The client emits a real field as `.zForm-control` (default) or `.zInput`
133
178
  * (input-groups / explicit). Style BOTH so a field on ANY page — not just
@@ -720,107 +765,20 @@ zNavBar .zNav-link.active {
720
765
  .zCol { flex: 1 0 0%; }
721
766
  .zCol-auto { flex: 0 0 auto; width: auto; }
722
767
 
723
- .zCol-1 { flex: 0 0 auto; width: 8.33333333%; }
724
- .zCol-2 { flex: 0 0 auto; width: 16.66666667%; }
725
- .zCol-3 { flex: 0 0 auto; width: 25%; }
726
- .zCol-4 { flex: 0 0 auto; width: 33.33333333%; }
727
- .zCol-5 { flex: 0 0 auto; width: 41.66666667%; }
728
- .zCol-6 { flex: 0 0 auto; width: 50%; }
729
- .zCol-7 { flex: 0 0 auto; width: 58.33333333%; }
730
- .zCol-8 { flex: 0 0 auto; width: 66.66666667%; }
731
- .zCol-9 { flex: 0 0 auto; width: 75%; }
732
- .zCol-10 { flex: 0 0 auto; width: 83.33333333%; }
733
- .zCol-11 { flex: 0 0 auto; width: 91.66666667%; }
734
- .zCol-12 { flex: 0 0 auto; width: 100%; }
735
-
736
- @media (min-width: 576px) {
737
- .zCol-sm { flex: 1 0 0%; }
738
- .zCol-sm-auto { flex: 0 0 auto; width: auto; }
739
- .zCol-sm-1 { flex: 0 0 auto; width: 8.33333333%; }
740
- .zCol-sm-2 { flex: 0 0 auto; width: 16.66666667%; }
741
- .zCol-sm-3 { flex: 0 0 auto; width: 25%; }
742
- .zCol-sm-4 { flex: 0 0 auto; width: 33.33333333%; }
743
- .zCol-sm-5 { flex: 0 0 auto; width: 41.66666667%; }
744
- .zCol-sm-6 { flex: 0 0 auto; width: 50%; }
745
- .zCol-sm-7 { flex: 0 0 auto; width: 58.33333333%; }
746
- .zCol-sm-8 { flex: 0 0 auto; width: 66.66666667%; }
747
- .zCol-sm-9 { flex: 0 0 auto; width: 75%; }
748
- .zCol-sm-10 { flex: 0 0 auto; width: 83.33333333%; }
749
- .zCol-sm-11 { flex: 0 0 auto; width: 91.66666667%; }
750
- .zCol-sm-12 { flex: 0 0 auto; width: 100%; }
751
- }
752
-
753
- @media (min-width: 768px) {
754
- .zCol-md { flex: 1 0 0%; }
755
- .zCol-md-auto { flex: 0 0 auto; width: auto; }
756
- .zCol-md-1 { flex: 0 0 auto; width: 8.33333333%; }
757
- .zCol-md-2 { flex: 0 0 auto; width: 16.66666667%; }
758
- .zCol-md-3 { flex: 0 0 auto; width: 25%; }
759
- .zCol-md-4 { flex: 0 0 auto; width: 33.33333333%; }
760
- .zCol-md-5 { flex: 0 0 auto; width: 41.66666667%; }
761
- .zCol-md-6 { flex: 0 0 auto; width: 50%; }
762
- .zCol-md-7 { flex: 0 0 auto; width: 58.33333333%; }
763
- .zCol-md-8 { flex: 0 0 auto; width: 66.66666667%; }
764
- .zCol-md-9 { flex: 0 0 auto; width: 75%; }
765
- .zCol-md-10 { flex: 0 0 auto; width: 83.33333333%; }
766
- .zCol-md-11 { flex: 0 0 auto; width: 91.66666667%; }
767
- .zCol-md-12 { flex: 0 0 auto; width: 100%; }
768
- }
769
-
770
- @media (min-width: 992px) {
771
- .zCol-lg { flex: 1 0 0%; }
772
- .zCol-lg-auto { flex: 0 0 auto; width: auto; }
773
- .zCol-lg-1 { flex: 0 0 auto; width: 8.33333333%; }
774
- .zCol-lg-2 { flex: 0 0 auto; width: 16.66666667%; }
775
- .zCol-lg-3 { flex: 0 0 auto; width: 25%; }
776
- .zCol-lg-4 { flex: 0 0 auto; width: 33.33333333%; }
777
- .zCol-lg-5 { flex: 0 0 auto; width: 41.66666667%; }
778
- .zCol-lg-6 { flex: 0 0 auto; width: 50%; }
779
- .zCol-lg-7 { flex: 0 0 auto; width: 58.33333333%; }
780
- .zCol-lg-8 { flex: 0 0 auto; width: 66.66666667%; }
781
- .zCol-lg-9 { flex: 0 0 auto; width: 75%; }
782
- .zCol-lg-10 { flex: 0 0 auto; width: 83.33333333%; }
783
- .zCol-lg-11 { flex: 0 0 auto; width: 91.66666667%; }
784
- .zCol-lg-12 { flex: 0 0 auto; width: 100%; }
785
- }
786
-
787
- @media (min-width: 1200px) {
788
- .zCol-xl { flex: 1 0 0%; }
789
- .zCol-xl-auto { flex: 0 0 auto; width: auto; }
790
- .zCol-xl-1 { flex: 0 0 auto; width: 8.33333333%; }
791
- .zCol-xl-2 { flex: 0 0 auto; width: 16.66666667%; }
792
- .zCol-xl-3 { flex: 0 0 auto; width: 25%; }
793
- .zCol-xl-4 { flex: 0 0 auto; width: 33.33333333%; }
794
- .zCol-xl-5 { flex: 0 0 auto; width: 41.66666667%; }
795
- .zCol-xl-6 { flex: 0 0 auto; width: 50%; }
796
- .zCol-xl-7 { flex: 0 0 auto; width: 58.33333333%; }
797
- .zCol-xl-8 { flex: 0 0 auto; width: 66.66666667%; }
798
- .zCol-xl-9 { flex: 0 0 auto; width: 75%; }
799
- .zCol-xl-10 { flex: 0 0 auto; width: 83.33333333%; }
800
- .zCol-xl-11 { flex: 0 0 auto; width: 91.66666667%; }
801
- .zCol-xl-12 { flex: 0 0 auto; width: 100%; }
802
- }
768
+ /* zbase ships ONLY the minimal grid the renderer emits (zRow / zCol / zCol-auto
769
+ * used by zDash). The full 12-column matrix and responsive breakpoint variants
770
+ * (zCol-1..12, zCol-{sm,md,lg,xl}-*) were evicted: zOS is not a CSS framework.
771
+ * An app that wants a column grid brings its own stylesheet. Strip, don't compile —
772
+ * it's CSS, trivially re-added if a real zOS event ever needs it. */
803
773
 
804
774
  /* ─── 3. Gutters ───────────────────────────────────────────────────────────── */
805
775
 
776
+ /* Only zG-0 is kept — zDash builds its sidebar/content row with `.zRow.zG-0`
777
+ * (zero gutters). The zG-1..5 gutter scale was a framework convenience nothing
778
+ * emits; evicted with the 12-col grid above. */
806
779
  .zRow.zG-0 { margin-right: 0; margin-left: 0; }
807
780
  .zRow.zG-0 > [class*="zCol"] { padding-right: 0; padding-left: 0; }
808
781
 
809
- .zRow.zG-1 { margin-right: -0.25rem; margin-left: -0.25rem; }
810
- .zRow.zG-1 > [class*="zCol"] { padding-right: 0.25rem; padding-left: 0.25rem; }
811
-
812
- .zRow.zG-2 { margin-right: -0.5rem; margin-left: -0.5rem; }
813
- .zRow.zG-2 > [class*="zCol"] { padding-right: 0.5rem; padding-left: 0.5rem; }
814
-
815
- .zRow.zG-3 { margin-right: -0.75rem; margin-left: -0.75rem; }
816
- .zRow.zG-3 > [class*="zCol"] { padding-right: 0.75rem; padding-left: 0.75rem; }
817
-
818
- .zRow.zG-4 { margin-right: -1rem; margin-left: -1rem; }
819
- .zRow.zG-4 > [class*="zCol"] { padding-right: 1rem; padding-left: 1rem; }
820
-
821
- .zRow.zG-5 { margin-right: -1.5rem; margin-left: -1.5rem; }
822
- .zRow.zG-5 > [class*="zCol"] { padding-right: 1.5rem; padding-left: 1.5rem; }
823
-
824
782
  /* ─── 4. Flex utilities ────────────────────────────────────────────────────── */
825
783
 
826
784
  .zFlex-row { flex-direction: row !important; }
@@ -844,13 +802,9 @@ zNavBar .zNav-link.active {
844
802
  .zFlex-items-stretch { align-items: stretch !important; }
845
803
  .zFlex-items-baseline { align-items: baseline !important; }
846
804
 
847
- .zFlex-fill { flex: 1 1 auto !important; }
848
- .zFlex-1 { flex: 1 !important; }
849
- .zFlex-grow-0 { flex-grow: 0 !important; }
850
- .zFlex-grow-1 { flex-grow: 1 !important; }
851
- .zFlex-shrink-0 { flex-shrink: 0 !important; }
852
- .zFlex-shrink-1 { flex-shrink: 1 !important; }
853
-
805
+ /* grow/shrink/fill helpers evicted not in the _GUI container mapper
806
+ * (container_utils.js) and never emitted. Re-add only if a real zOS event needs
807
+ * flex grow/shrink. */
854
808
  .zGap-0 { gap: 0 !important; }
855
809
  .zGap-1 { gap: 0.25rem !important; }
856
810
  .zGap-2 { gap: 0.5rem !important; }
@@ -904,6 +858,22 @@ zNavBar .zNav-link.active {
904
858
  .zme-4 { margin-right: 1rem !important; }
905
859
  .zme-5 { margin-right: 1.5rem !important; }
906
860
 
861
+ /* axis margins — emitted by spacing_utils (getMarginClass side 'x'/'y'). zmx-auto
862
+ * (centering) lives in the misc helpers section. */
863
+ .zmx-0 { margin-left: 0 !important; margin-right: 0 !important; }
864
+ .zmx-1 { margin-left: 0.25rem !important; margin-right: 0.25rem !important; }
865
+ .zmx-2 { margin-left: 0.5rem !important; margin-right: 0.5rem !important; }
866
+ .zmx-3 { margin-left: 0.75rem !important; margin-right: 0.75rem !important; }
867
+ .zmx-4 { margin-left: 1rem !important; margin-right: 1rem !important; }
868
+ .zmx-5 { margin-left: 1.5rem !important; margin-right: 1.5rem !important; }
869
+
870
+ .zmy-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
871
+ .zmy-1 { margin-top: 0.25rem !important; margin-bottom: 0.25rem !important; }
872
+ .zmy-2 { margin-top: 0.5rem !important; margin-bottom: 0.5rem !important; }
873
+ .zmy-3 { margin-top: 0.75rem !important; margin-bottom: 0.75rem !important; }
874
+ .zmy-4 { margin-top: 1rem !important; margin-bottom: 1rem !important; }
875
+ .zmy-5 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }
876
+
907
877
  .zp-0 { padding: 0 !important; }
908
878
  .zp-1 { padding: 0.25rem !important; }
909
879
  .zp-2 { padding: 0.5rem !important; }
@@ -939,6 +909,21 @@ zNavBar .zNav-link.active {
939
909
  .zpe-4 { padding-right: 1rem !important; }
940
910
  .zpe-5 { padding-right: 1.5rem !important; }
941
911
 
912
+ /* axis padding — emitted by spacing_utils (getPaddingClass side 'x'/'y'). */
913
+ .zpx-0 { padding-left: 0 !important; padding-right: 0 !important; }
914
+ .zpx-1 { padding-left: 0.25rem !important; padding-right: 0.25rem !important; }
915
+ .zpx-2 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
916
+ .zpx-3 { padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
917
+ .zpx-4 { padding-left: 1rem !important; padding-right: 1rem !important; }
918
+ .zpx-5 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
919
+
920
+ .zpy-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
921
+ .zpy-1 { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; }
922
+ .zpy-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
923
+ .zpy-3 { padding-top: 0.75rem !important; padding-bottom: 0.75rem !important; }
924
+ .zpy-4 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
925
+ .zpy-5 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
926
+
942
927
  /* ─── 7. Tabs ──────────────────────────────────────────────────────────────── */
943
928
 
944
929
  .zTab-content > .zTab-pane { display: none; }