@font-face {
  font-family: "Cases Emoji Embedded";
  src: url("assets/fonts/NotoColorEmoji.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  unicode-range: U+a9, U+ae, U+200d, U+203c, U+2049, U+20e3, U+2122, U+2139, U+2194-2199, U+21a9-21aa, U+231a-231b, U+2328, U+23cf, U+23e9-23f3, U+23f8-23fa, U+24c2, U+25aa-25ab, U+25b6, U+25c0, U+25fb-25fe, U+2600-2604, U+260e, U+2611, U+2614-2615, U+2618, U+261d, U+2620, U+2622-2623, U+2626, U+262a, U+262e-262f, U+2638-263a, U+2640, U+2642, U+2648-2653, U+265f-2660, U+2663, U+2665-2666, U+2668, U+267b, U+267e-267f, U+2692-2697, U+2699, U+269b-269c, U+26a0-26a1, U+26a7, U+26aa-26ab, U+26b0-26b1, U+26bd-26be, U+26c4-26c5, U+26c8, U+26ce-26cf, U+26d1, U+26d3-26d4, U+26e9-26ea, U+26f0-26f5, U+26f7-26fa, U+26fd, U+2702, U+2705, U+2708-270d, U+270f, U+2712, U+2714, U+2716, U+271d, U+2721, U+2728, U+2733-2734, U+2744, U+2747, U+274c, U+274e, U+2753-2755, U+2757, U+2763-2764, U+2795-2797, U+27a1, U+27b0, U+27bf, U+2934-2935, U+2b05-2b07, U+2b1b-2b1c, U+2b50, U+2b55, U+3030, U+303d, U+3297, U+3299, U+fe0f, U+1f004, U+1f0cf, U+1f170-1f171, U+1f17e-1f17f, U+1f18e, U+1f191-1f19a, U+1f1e6-1f1ff, U+1f201-1f202, U+1f21a, U+1f22f, U+1f232-1f23a, U+1f250-1f251, U+1f300-1f321, U+1f324-1f393, U+1f396-1f397, U+1f399-1f39b, U+1f39e-1f3f0, U+1f3f3-1f3f5, U+1f3f7-1f469, U+1f46b-1f4fd, U+1f4ff-1f53d, U+1f549-1f54e, U+1f550-1f567, U+1f56f-1f570, U+1f573-1f57a, U+1f587, U+1f58a-1f58d, U+1f590, U+1f595-1f596, U+1f5a4-1f5a5, U+1f5a8, U+1f5b1-1f5b2, U+1f5bc, U+1f5c2-1f5c4, U+1f5d1-1f5d3, U+1f5dc-1f5de, U+1f5e1, U+1f5e3, U+1f5e8, U+1f5ef, U+1f5f3, U+1f5fa-1f64f, U+1f680-1f6c5, U+1f6cb-1f6d2, U+1f6d5-1f6d9, U+1f6dc-1f6e5, U+1f6e9, U+1f6eb-1f6ec, U+1f6f0, U+1f6f3-1f6fc, U+1f7e0-1f7eb, U+1f7f0, U+1f90c-1f93a, U+1f93c-1f945, U+1f947-1f9ff, U+1fa70-1fa7c, U+1fa80-1fac6, U+1fac8, U+1facc-1fadd, U+1fadf-1faeb, U+1faef-1fafa, U+e0062-e0063, U+e0065, U+e0067, U+e006c, U+e006e, U+e0073-e0074, U+e0077, U+e007f;
}

@font-face {
  font-family: "Cases Inter Embedded";
  src: url("assets/fonts/Inter-Variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Cases Noto Sans Georgian Embedded";
  src: url("assets/fonts/NotoSansGeorgian-Variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62.5% 100%;
  font-display: swap;
}

@font-face {
  font-family: "Cases Aquire Embedded";
  src: url("assets/fonts/AquireLight-YzE0o.otf") format("opentype");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: "Cases Aquire Embedded";
  src: url("assets/fonts/Aquire-BW0ox.otf") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Cases Aquire Embedded";
  src: url("assets/fonts/AquireBold-8Ma60.otf") format("opentype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-0.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+1f1e6-1f1ff;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-1.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+200d, U+2620, U+26a7, U+fe0f, U+1f308, U+1f38c, U+1f3c1, U+1f3f3-1f3f4, U+1f6a9, U+e0062-e0063, U+e0065, U+e0067, U+e006c, U+e006e, U+e0073-e0074, U+e0077, U+e007f;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-2.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+a9, U+ae, U+200d, U+203c, U+2049, U+20e3, U+2122, U+2139, U+2194-2199, U+21a9-21aa, U+23cf, U+23e9-23ef, U+23f8-23fa, U+24c2, U+25aa-25ab, U+25b6, U+25c0, U+25fb-25fe, U+2611, U+2622-2623, U+2626, U+262a, U+262e-262f, U+2638, U+2640, U+2642, U+2648-2653, U+2660, U+2663, U+2665-2666, U+2668, U+267b, U+267e-267f, U+2695, U+269b-269c, U+26a0, U+26a7, U+26aa-26ab, U+26ce, U+26d4, U+2705, U+2714, U+2716, U+271d, U+2721, U+2733-2734, U+2747, U+274c, U+274e, U+2753-2755, U+2757, U+2764, U+2795-2797, U+27a1, U+27b0, U+27bf, U+2934-2935, U+2b05-2b07, U+2b1b-2b1c, U+2b55, U+3030, U+303d, U+3297, U+3299, U+fe0f, U+1f170-1f171, U+1f17e-1f17f, U+1f18e, U+1f191-1f19a, U+1f201-1f202, U+1f21a, U+1f22f, U+1f232-1f23a, U+1f250-1f251, U+1f310, U+1f3a6, U+1f3b5-1f3b6, U+1f3bc, U+1f3e7, U+1f441, U+1f499-1f49c, U+1f49f-1f4a0, U+1f4ac-1f4ad, U+1f4b1-1f4b2, U+1f4b9, U+1f4db, U+1f4f2-1f4f6, U+1f500-1f507, U+1f515, U+1f518-1f524, U+1f52f-1f53d, U+1f549, U+1f54e, U+1f5a4, U+1f5e8, U+1f5ef, U+1f6ab, U+1f6ad-1f6b1, U+1f6b3, U+1f6b7-1f6bc, U+1f6be, U+1f6c2-1f6c5, U+1f6d0-1f6d1, U+1f6d7, U+1f6dc, U+1f7e0-1f7eb, U+1f7f0, U+1f90d-1f90e, U+1f9d1-1f9d2, U+1f9e1, U+1fa75-1fa77, U+1faaf;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-3.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+200d, U+231a-231b, U+2328, U+23f0-23f3, U+2602, U+260e, U+2692, U+2694, U+2696-2697, U+2699, U+26b0-26b1, U+26cf, U+26d1, U+26d3, U+2702, U+2709, U+270f, U+2712, U+fe0f, U+1f302, U+1f321, U+1f392-1f393, U+1f3a9, U+1f3bd, U+1f3ee, U+1f3f7, U+1f3fa, U+1f451-1f462, U+1f484, U+1f489-1f48a, U+1f48c-1f48e, U+1f4a1, U+1f4a3, U+1f4a5, U+1f4b0, U+1f4b3-1f4b8, U+1f4bb-1f4da, U+1f4dc-1f4f1, U+1f4ff, U+1f508-1f514, U+1f516-1f517, U+1f526-1f529, U+1f52c-1f52e, U+1f550-1f567, U+1f56f-1f570, U+1f576, U+1f587, U+1f58a-1f58d, U+1f5a5, U+1f5a8, U+1f5b1-1f5b2, U+1f5c2-1f5c4, U+1f5d1-1f5d3, U+1f5dc-1f5de, U+1f5e1, U+1f5f3, U+1f6aa, U+1f6ac, U+1f6bd, U+1f6bf, U+1f6c1, U+1f6cb, U+1f6cd-1f6cf, U+1f6d2, U+1f6e0-1f6e1, U+1f6f0, U+1f97b-1f97f, U+1f9af, U+1f9ba, U+1f9e2-1f9e6, U+1f9ea-1f9ec, U+1f9ee-1f9f4, U+1f9f7-1f9ff, U+1fa71-1fa74, U+1fa79-1fa7b, U+1fa86, U+1fa8e-1fa8f, U+1fa91-1fa93, U+1fa96, U+1fa99-1faa0, U+1faa2-1faa7, U+1faaa-1faae;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-4.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+265f, U+26bd-26be, U+26f3, U+26f8, U+fe0f, U+1f004, U+1f0cf, U+1f380-1f384, U+1f386-1f38b, U+1f38d-1f391, U+1f396-1f397, U+1f399-1f39b, U+1f39e-1f39f, U+1f3a3-1f3a5, U+1f3a7-1f3a9, U+1f3ab-1f3b4, U+1f3b7-1f3bb, U+1f3bd-1f3c0, U+1f3c5-1f3c6, U+1f3c8-1f3c9, U+1f3cf-1f3d3, U+1f3f8-1f3f9, U+1f47e, U+1f4e2, U+1f4f7-1f4fd, U+1f52b, U+1f579, U+1f58c-1f58d, U+1f5bc, U+1f6f7, U+1f6f9, U+1f6fc, U+1f93f, U+1f941, U+1f945, U+1f947-1f94f, U+1f9e7-1f9e9, U+1f9f5-1f9f6, U+1fa70-1fa71, U+1fa80-1fa81, U+1fa83-1fa85, U+1fa87-1fa8a, U+1fa94-1fa95, U+1fa97-1fa98, U+1faa1, U+1faa9, U+1fadf;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-5.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+2693, U+26e9-26ea, U+26f1-26f2, U+26f4-26f5, U+26fa, U+26fd, U+2708, U+fe0f, U+1f301, U+1f303, U+1f306-1f307, U+1f309, U+1f310, U+1f3a0-1f3a2, U+1f3aa, U+1f3cd-1f3ce, U+1f3d5, U+1f3d7-1f3db, U+1f3df-1f3e6, U+1f3e8-1f3ed, U+1f3ef-1f3f0, U+1f488, U+1f492, U+1f4ba, U+1f54b-1f54d, U+1f5fa-1f5ff, U+1f680-1f6a2, U+1f6a4-1f6a8, U+1f6b2, U+1f6d1, U+1f6d5-1f6d6, U+1f6dd-1f6df, U+1f6e2-1f6e5, U+1f6e9, U+1f6eb-1f6ec, U+1f6f3-1f6f6, U+1f6f8, U+1f6fa-1f6fb, U+1f9bc-1f9bd, U+1f9ed, U+1f9f3, U+1fa7c;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-6.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+200d, U+2615, U+fe0f, U+1f32d-1f330, U+1f336, U+1f33d, U+1f344-1f37f, U+1f382, U+1f52a, U+1f7e9, U+1f7eb, U+1f942-1f944, U+1f950-1f96f, U+1f99e, U+1f9aa, U+1f9c0-1f9cb, U+1fad0-1fadc;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-7.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+200d, U+2600-2601, U+2603-2604, U+2614, U+2618, U+26a1, U+26c4-26c5, U+26c8, U+26f0, U+2728, U+2744, U+2b1b, U+2b50, U+fe0f, U+1f300, U+1f304-1f305, U+1f308, U+1f30a-1f30f, U+1f311-1f321, U+1f324-1f32c, U+1f331-1f335, U+1f337-1f33c, U+1f33e-1f344, U+1f3d4, U+1f3d6, U+1f3dc-1f3de, U+1f3f5, U+1f400-1f43f, U+1f490, U+1f4a7, U+1f4ae, U+1f525, U+1f54a, U+1f573, U+1f577-1f578, U+1f648-1f64a, U+1f6d8, U+1f940, U+1f980-1f9ae, U+1f9ba, U+1fa90, U+1faa8, U+1fab0-1fabf, U+1facd-1facf, U+1fae7;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-8.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+200d, U+2640, U+2642, U+2695-2696, U+26f7, U+26f9, U+2708, U+2764, U+27a1, U+fe0f, U+1f33e, U+1f373, U+1f37c, U+1f384-1f385, U+1f393, U+1f3a4, U+1f3a8, U+1f3c2-1f3c4, U+1f3c7, U+1f3ca-1f3cc, U+1f3eb, U+1f3ed, U+1f3fb-1f3ff, U+1f430, U+1f466-1f469, U+1f46b-1f478, U+1f47c, U+1f481-1f483, U+1f486-1f487, U+1f48b, U+1f48f, U+1f491, U+1f4bb-1f4bc, U+1f527, U+1f52c, U+1f574-1f575, U+1f57a, U+1f645-1f647, U+1f64b, U+1f64d-1f64e, U+1f680, U+1f692, U+1f6a3, U+1f6b4-1f6b6, U+1f6c0, U+1f6cc, U+1f91d, U+1f926, U+1f930-1f931, U+1f934-1f93a, U+1f93c-1f93e, U+1f977, U+1f9af-1f9b3, U+1f9b8-1f9b9, U+1f9bc-1f9bd, U+1f9cc-1f9cf, U+1f9d1-1f9df, U+1fa70, U+1fa82, U+1fac3-1fac5, U+1fac8, U+1faef;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-9.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+200d, U+2194-2195, U+2603, U+261d, U+2620, U+2639-263a, U+2665, U+26a1, U+26c4, U+270a-270d, U+2728, U+2763-2764, U+2b50, U+fe0f, U+1f31a-1f31f, U+1f32b, U+1f389-1f38a, U+1f3fb-1f3ff, U+1f440-1f450, U+1f463-1f465, U+1f479-1f47b, U+1f47d-1f480, U+1f485, U+1f48b-1f48c, U+1f493-1f49f, U+1f4a2, U+1f4a4-1f4a6, U+1f4a8-1f4ab, U+1f4af, U+1f525, U+1f573, U+1f590, U+1f595-1f596, U+1f5a4, U+1f5e3, U+1f600-1f644, U+1f648-1f64a, U+1f64c, U+1f64f, U+1f90c-1f925, U+1f927-1f92f, U+1f932-1f933, U+1f970-1f976, U+1f978-1f97a, U+1f9a0, U+1f9b4-1f9b7, U+1f9bb, U+1f9be-1f9bf, U+1f9d0, U+1f9e0-1f9e1, U+1fa75-1fa79, U+1fac0-1fac2, U+1fac6, U+1fae0-1fae6, U+1fae8-1faea, U+1faef-1fafa;
}

@font-face {
  font-family: "Cases Emoji Mono";
  src: url("assets/fonts/emoji/NotoEmojiMono-10.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  unicode-range: U+1f6d9, U+1fa8b-1fa8d, U+1facc, U+1fadd, U+1faeb;
}

@font-face {
  font-family: "Cases Emoji Twemoji";
  src: url("assets/fonts/emoji/Twemoji.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  unicode-range: U+a9, U+ae, U+200d, U+203c, U+2049, U+20e3, U+2122, U+2139, U+2194-2199, U+21a9-21aa, U+231a-231b, U+2328, U+23cf, U+23e9-23f3, U+23f8-23fa, U+24c2, U+25aa-25ab, U+25b6, U+25c0, U+25fb-25fe, U+2600-2604, U+260e, U+2611, U+2614-2615, U+2618, U+261d, U+2620, U+2622-2623, U+2626, U+262a, U+262e-262f, U+2638-263a, U+2640, U+2642, U+2648-2653, U+265f-2660, U+2663, U+2665-2666, U+2668, U+267b, U+267e-267f, U+2692-2697, U+2699, U+269b-269c, U+26a0-26a1, U+26a7, U+26aa-26ab, U+26b0-26b1, U+26bd-26be, U+26c4-26c5, U+26c8, U+26ce-26cf, U+26d1, U+26d3-26d4, U+26e9-26ea, U+26f0-26f5, U+26f7-26fa, U+26fd, U+2702, U+2705, U+2708-270d, U+270f, U+2712, U+2714, U+2716, U+271d, U+2721, U+2728, U+2733-2734, U+2744, U+2747, U+274c, U+274e, U+2753-2755, U+2757, U+2763-2764, U+2795-2797, U+27a1, U+27b0, U+27bf, U+2934-2935, U+2b05-2b07, U+2b1b-2b1c, U+2b50, U+2b55, U+3030, U+303d, U+3297, U+3299, U+fe0f, U+1f004, U+1f0cf, U+1f170-1f171, U+1f17e-1f17f, U+1f18e, U+1f191-1f19a, U+1f1e6-1f1ff, U+1f201-1f202, U+1f21a, U+1f22f, U+1f232-1f23a, U+1f250-1f251, U+1f300-1f321, U+1f324-1f393, U+1f396-1f397, U+1f399-1f39b, U+1f39e-1f3f0, U+1f3f3-1f3f5, U+1f3f7-1f469, U+1f46b-1f4fd, U+1f4ff-1f53d, U+1f549-1f54e, U+1f550-1f567, U+1f56f-1f570, U+1f573-1f57a, U+1f587, U+1f58a-1f58d, U+1f590, U+1f595-1f596, U+1f5a4-1f5a5, U+1f5a8, U+1f5b1-1f5b2, U+1f5bc, U+1f5c2-1f5c4, U+1f5d1-1f5d3, U+1f5dc-1f5de, U+1f5e1, U+1f5e3, U+1f5e8, U+1f5ef, U+1f5f3, U+1f5fa-1f64f, U+1f680-1f6c5, U+1f6cb-1f6d2, U+1f6d5-1f6d9, U+1f6dc-1f6e5, U+1f6e9, U+1f6eb-1f6ec, U+1f6f0, U+1f6f3-1f6fc, U+1f7e0-1f7eb, U+1f7f0, U+1f90c-1f93a, U+1f93c-1f945, U+1f947-1f9ff, U+1fa70-1fa7c, U+1fa80-1fac6, U+1fac8, U+1facc-1fadd, U+1fadf-1faeb, U+1faef-1fafa, U+e0062-e0063, U+e0065, U+e0067, U+e006c, U+e006e, U+e0073-e0074, U+e0077, U+e007f;
}

@font-face {
  font-family: "Cases Emoji Flags";
  src: url("assets/fonts/emoji/Twemoji.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  unicode-range: U+1f1e6-1f1ff, U+1f3f4, U+e0060-e007f;
}

:root { --cases-emoji-stack: "Cases Emoji Embedded"; }
:root[data-emoji-style="noto-flags"] { --cases-emoji-stack: "Cases Emoji Flags", "Cases Emoji Embedded"; }
:root[data-emoji-style="twemoji"] { --cases-emoji-stack: "Cases Emoji Twemoji"; }
:root[data-emoji-style="mono"] { --cases-emoji-stack: "Cases Emoji Flags", "Cases Emoji Mono"; }

/* The program's text font (Settings > Appearance, data-ui-font on <html>); every choice has Georgian. */
:root { --cases-ui-font: "Cases Inter Embedded", "Cases Noto Sans Georgian Embedded", var(--cases-emoji-stack), "Segoe UI", Arial, sans-serif; }
:root[data-ui-font="noto"] { --cases-ui-font: "Cases Noto Sans Georgian Embedded", "Cases Inter Embedded", var(--cases-emoji-stack), "Segoe UI", Arial, sans-serif; }
:root[data-ui-font="custom"] { --cases-ui-font: var(--cases-ui-font-custom); }

:root {
  --surface-soft: #f8fbff;
  --sidebar-deep: #0b1736;
  --ink: #0f172a;
  --text: #1f2937;
  --muted: #64748b;
  --muted-2: #94a3b8;
  --line: #dbe7f3;
  --line-strong: #bfd7ee;
  --primary: #0284c7;
  --primary-strong: #075985;
  --primary-soft: #e0f2fe;
  --amber: #b45309;
  --red: #b91c1c;
  --shadow-soft: 0 12px 28px rgba(15, 23, 42, .07);
  --shadow-card: 0 8px 18px rgba(2, 132, 199, .06);
  --radius-lg: 18px;
  --radius-md: 12px;
  --radius-sm: 10px;
  --control-h: 38px;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  font-family: var(--cases-ui-font);
  font-size: var(--type-body);
  line-height: 1.35;
  background:
    radial-gradient(circle at 18% 0%, rgba(224, 242, 254, .80), transparent 32%),
    radial-gradient(circle at 94% 18%, rgba(186, 230, 253, .55), transparent 28%),
    linear-gradient(135deg, #f8fbff 0%, #eef6fd 48%, #f7fbff 100%);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .30;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900' preserveAspectRatio='none'%3E%3Crect width='1600' height='900' fill='%23f8fbff'/%3E%3Cpolygon points='0,0 260,0 170,110 0,120' fill='%230ea5e9' opacity='.28'/%3E%3Cpolygon points='180,0 520,0 360,118 170,110' fill='%2338bdf8' opacity='.24'/%3E%3Cpolygon points='480,0 850,0 640,118 360,118' fill='%23bae6fd' opacity='.54'/%3E%3Cpolygon points='0,900 450,720 810,900' fill='%2322d3ee' opacity='.13'/%3E%3Cpolygon points='900,900 1600,660 1600,900' fill='%230ea5e9' opacity='.10'/%3E%3C/svg%3E") center/cover no-repeat;
}

button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }

.app-frame {
  height: 100vh;
  display: grid;
  grid-template-columns: var(--cases-sidebar-w, calc(var(--cases-nav-w, 176px) + 2 * var(--ui-divider-frame-gap, 24px))) minmax(0, 1fr);
  gap: 0;
}

.sidebar {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 18px 14px;
  color: #fff;
  overflow: hidden;
  background: var(--sidebar-deep);
  box-shadow: inset -1px 0 rgba(255, 255, 255, .24), 1px 0 0 rgba(15, 23, 42, .04);
}

.sidebar::before,
.sidebar::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}



.brand{ position: relative; z-index: 1; }












.main-shell::-webkit-scrollbar,
.table-wrap::-webkit-scrollbar{ width: 9px; height: 9px; }
.main-shell::-webkit-scrollbar-thumb,
.table-wrap::-webkit-scrollbar-thumb{ border-radius: 999px; background: rgba(2, 132, 199, .25); }
















.main-shell {
  min-width: 0;
  overflow: auto;
  padding: 12px 22px 32px;
}

.titlebar {
  position: sticky;
  top: 0;
  z-index: 40;
  height: 28px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin: -6px -8px 8px;
  -webkit-app-region: drag;
}
.drag-region { flex: 1; height: 100%; }
.window-controls {
  -webkit-app-region: no-drag;
  display: flex;
  gap: 8px;
  padding: 0 6px;
}
.window-controls button {
  width: 12px;
  height: 12px;
  min-height: 12px;
  padding: 0;
  border: 1px solid rgba(0,0,0,.13);
  border-radius: 50%;
  color: transparent;
  font-size: 0;
  line-height: 0;
  background: #febc2e;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.50), 0 0 0 1px rgba(255,255,255,.28);
}
.window-controls button:nth-child(2) { background: #28c840; }
.window-controls .close { background: #ff5f57; }
.window-controls button:hover { filter: brightness(.96); }

















.header-actions {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 172px 190px 128px auto;
  gap: 9px;
  align-items: end;
}










.panel{
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.94);
  box-shadow: var(--shadow-card);
}















.form-section {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
  margin-bottom: 12px;
  background: var(--surface-soft);
}

.card-main-section {
  display: grid;
  gap: 12px;
}


.card-field-row {
  display: grid;
  gap: 10px;
  align-items: end;
  min-width: 0;
}





























label {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: #334155;
  font-size: var(--type-caption);
  font-weight: 400;
}

input, select, textarea {
  width: 100%;
  min-width: 0;
  min-height: var(--control-h);
  border: 1px solid #cfddea;
  border-radius: var(--radius-sm);
  padding: 0 10px;
  color: var(--ink);
  background: #fff;
  outline: none;
  box-shadow: inset 0 1px 1px rgba(15, 23, 42, .025);
  font-size: var(--type-body);
  font-weight: 400;
  transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
textarea {
  min-height: 72px;
  padding: 10px;
  resize: vertical;
  line-height: 1.45;
}
select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 34px;
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7l4 4 4-4' fill='none' stroke='%2364748b' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 18px 18px;
}
input:focus, select:focus, textarea:focus {
  border-color: #38bdf8;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, .18), inset 0 1px 1px rgba(15, 23, 42, .025);
}
input::placeholder, textarea::placeholder { color: var(--muted-2); }









.secondary-btn{
  min-height: var(--control-h);
  border-radius: var(--radius-sm);
  padding: 0 14px;
  font-size: var(--type-body);
  font-weight: 400;
  transition: transform .12s ease, filter .12s ease, background .12s ease, border-color .12s ease;
}

.secondary-btn {
  border: 1px solid var(--line-strong);
  color: var(--primary-strong);
  background: #fff;
}

.secondary-btn:hover{ transform: translateY(-1px); filter: brightness(1.015); }
.secondary-btn:hover { border-color: #7dd3fc; background: #f8fbff; }
.secondary-btn:active{ transform: translateY(0); }
.small {
  min-height: 30px;
  padding: 0 10px;
  font-size: var(--type-caption);
}




summary{
  color: var(--ink);
  font-size: var(--type-body);
  font-weight: 500;
}
summary {
  cursor: pointer;
  list-style: none;
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
summary::-webkit-details-marker { display: none; }
summary::after {
  content: "";
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  opacity: .72;
  background: currentColor;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7l4 4 4-4'/%3E%3C/svg%3E") center/18px 18px no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7l4 4 4-4'/%3E%3C/svg%3E") center/18px 18px no-repeat;
}
details[open] summary::after { transform: rotate(180deg); }
summary span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 3px 8px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: var(--type-caption);
}

.line-list { display: grid; gap: 8px; }
.line-row {
  display: grid;
  gap: 8px;
  align-items: end;
  min-width: 0;
}




.line-row button {
  height: 32px;
  min-height: 32px;
  border: 1px solid #fecaca;
  border-radius: 9px;
  color: var(--red);
  background: #fff5f5;
  font-weight: 400;
}
.line-row button:hover { border-color: #fca5a5; background: #fff1f2; }





.empty {
  padding: 22px;
  color: var(--muted);
  text-align: center;
  font-size: var(--type-body);
}
.empty.compact {
  padding: 10px;
  border: 1px dashed var(--line-strong);
  border-radius: 10px;
  background: var(--surface-soft);
}







.table-wrap {
  max-height: 480px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}

table {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: var(--type-body);
}
th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  color: #334155;
  background: #f0f9ff;
  font-size: var(--type-caption);
  font-weight: 500;
  white-space: nowrap;
}
td {
  padding: 10px 12px;
  border-bottom: 1px solid #edf4fb;
  vertical-align: middle;
  background: #fff;
}
tbody tr:hover td { background: #f8fbff; }
td strong { display: block; color: var(--ink); font-weight: 500; }
td span { display: block; margin-top: 2px; color: var(--muted); font-size: var(--type-caption); }
.num { text-align: right; font-variant-numeric: tabular-nums; }







.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: var(--type-caption);
  font-weight: 400;
  white-space: nowrap;
}
.status-pill.open { color: #1d4ed8; background: #eff6ff; }
.status-pill.warning { color: var(--amber); background: #fef3c7; }
.status-pill.overdue { color: var(--red); background: #ffe4e6; }


.status-pill.invalid{ color: #475467; background: #eef2f6; }





@media (max-width: 1460px) {
  .app-frame { grid-template-columns: 274px minmax(0, 1fr); }
  
  .header-actions { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1280px) {
  
  
  
  
  
  
}

@media (max-width: 980px) {
  body { overflow: auto; }
  .app-frame { height: auto; min-height: 100vh; grid-template-columns: 1fr; }
  .sidebar { min-height: 260px; }
  .main-shell { overflow: visible; }
  
  .header-actions{ grid-template-columns: 1fr; }
  
  
}

/* Provided Pactum logo lockups */










@media (max-width: 740px) {
  
}

/* Sidebar logo readability update: light background, no logo card */






























/* Page navigation model */
.sidebar-nav {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 7px;
  min-height: 0;
  overflow: auto;
  padding: 8px 2px 10px;
}

.sidebar-nav::-webkit-scrollbar { width: 7px; }
.sidebar-nav::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(14, 165, 233, .22); }

.nav-item {
  width: 100%;
  min-height: 42px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(191, 215, 238, .88);
  border-radius: 13px;
  padding: 8px 11px 8px 8px;
  color: #18324a;
  background: rgba(255, 255, 255, .60);
  text-align: left;
  font-size: var(--type-body);
  font-weight: 400;
  line-height: 1.2;
  box-shadow: 0 5px 14px rgba(15, 23, 42, .035), inset 0 1px 0 rgba(255,255,255,.72);
  transition: transform .14s ease, border-color .14s ease, background .14s ease, color .14s ease, box-shadow .14s ease;
}

.nav-item:hover {
  transform: translateY(-1px);
  border-color: rgba(14, 165, 233, .48);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 8px 18px rgba(14, 165, 233, .10);
}

.nav-item.active {
  color: #ffffff;
  border-color: rgba(14, 116, 233, .72);
  background: linear-gradient(135deg, #0ea5e9, #075985);
  box-shadow: 0 12px 24px rgba(14, 116, 233, .22), inset 0 1px 0 rgba(255,255,255,.30);
}


.nav-icon {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #075985;
  background: rgba(224, 242, 254, .86);
  border: 1px solid rgba(186, 230, 253, .88);
  font-size: var(--type-heading);
  font-weight: 400;
  line-height: 1;
}

.nav-item.active .nav-icon {
  color: #075985;
  background: #ffffff;
  border-color: rgba(255,255,255,.82);
}

.page-section { display: none !important; }
.page-section.active { display: block !important; }

























@media (max-width: 1100px) {
  
  
}

@media (max-width: 740px) {
  .sidebar-nav { grid-template-columns: 1fr; }
  
}

/* Sidebar navigation refinement: grouped layout + clean line pictograms */
.sidebar-nav {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow: hidden;
  padding: 10px 2px 2px;
}

.nav-main-group,
.nav-bottom-group {
  display: grid;
  gap: 7px;
  position: relative;
  z-index: 1;
}

.nav-main-group {
  min-height: 0;
  overflow: auto;
  padding-right: 2px;
}

.nav-bottom-group {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid rgba(148, 163, 184, .28);
}

.nav-main-group::-webkit-scrollbar { width: 7px; }
.nav-main-group::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(14, 165, 233, .22); }


.nav-icon {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  font-size: 0;
}

.nav-icon svg {
  width: 18px;
  height: 18px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* Bases page */
















@media (max-width: 1100px) {
  
}

/* Visual cleanup pass */
:root {
  --surface-soft: #f8fafc;
  --line: #d9e3ee;
  --line-strong: #bfd2e4;
  --radius-lg: 12px;
  --radius-md: 8px;
  --radius-sm: 7px;
  --shadow-soft: 0 10px 24px rgba(15, 23, 42, .06);
  --shadow-card: 0 6px 16px rgba(15, 23, 42, .045);
}

body {
  background: linear-gradient(135deg, #f8fbff 0%, #eef5fb 52%, #f9fbfd 100%);
}

body::before {
  display: none;
}


.sidebar::before {
  display: none;
}









.nav-item {
  position: relative;
  min-height: 38px;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 8px;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 7px 9px 7px 7px;
  color: #334155;
  background: transparent;
  box-shadow: none;
}

.nav-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: transparent;
}

.nav-item:hover {
  transform: none;
  border-color: rgba(191, 215, 238, .58);
  color: #075985;
  background: rgba(255, 255, 255, .72);
  box-shadow: none;
}

.nav-item.active {
  color: #063457;
  border-color: rgba(125, 211, 252, .36);
  background: rgba(224, 242, 254, .66);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72);
}

.nav-item.active::before {
  background: #0284c7;
}

.nav-icon,
.nav-item.active .nav-icon {
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 0;
  color: #64748b;
  background: transparent;
}

.nav-item:hover .nav-icon,
.nav-item.active .nav-icon {
  color: #0284c7;
}

.nav-icon svg {
  width: 19px;
  height: 19px;
  stroke-width: 1.85;
}

.nav-item.nav-exit {
  color: #9f1239;
}

.nav-item.nav-exit:hover {
  border-color: rgba(244, 63, 94, .22);
  color: #be123c;
  background: rgba(255, 241, 242, .68);
}

.nav-item.nav-exit:hover .nav-icon {
  color: #be123c;
}







.panel{
  border-radius: 10px;
}

.form-section,
.table-wrap{
  border-radius: 8px;
}

.secondary-btn,
.line-row button{
  border-radius: 7px;
}

/* Table alignment cleanup */

table td { line-height: 1.35; }





.table-wrap td.num{ text-align: right; font-variant-numeric: tabular-nums; }
.table-wrap th, .table-wrap td { overflow: hidden; text-overflow: ellipsis; }

/* Balance readability: show debt and overpayment as separate accounting values */




/* Wider contract tables now include debt and overpayment columns */







/* Accounting layout v2: compact tables without horizontal scroll */
.table-wrap {
  overflow-x: hidden;
  overflow-y: auto;
}
.table-wrap table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}













/* Accounting summary in card: compact, readable, no report tables inside the card */










/* Reports: tables live here, card only shows totals */




.report-note {
  color: var(--muted);
  font-size: var(--type-caption);
  line-height: 1.35;
  text-align: right;
  max-width: 360px;
}




















@media (max-width: 1180px) {
  
}
@media (max-width: 760px) {
  
  
  .report-note { text-align: left; max-width: none; }
}


/* Settings reference data manager */
.settings-layout {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 14px;
  margin-top: 14px;
  min-height: 0;
}















.reference-add-row input:focus{
  border-color: rgba(14, 165, 233, .46);
  box-shadow: 0 0 0 4px rgba(14, 165, 233, .10);
}









.reference-add-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 94px;
  gap: 8px;
}

.reference-add-row input {
  width: 100%;
  min-width: 0;
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 0 10px;
  background: #fff;
  color: var(--ink);
  font-family: inherit;
  font-size: var(--type-body);
  outline: none;
}

.reference-add-row .secondary-btn.small {
  height: 36px;
  min-height: 36px;
  padding: 0 10px;
}











@media (max-width: 1180px) {
  
  
}

/* UI systematic typography and card header cleanup */
:root {
  --fs-micro: 10.5px;
  --fs-xs: var(--type-caption);
  --fs-sm: var(--type-body);
  --fs-base: var(--type-body);
  --fs-md: var(--type-title);
  --fs-title: var(--type-heading);
  --fw-regular: 400;
  --fw-medium: 500;
}
body,
button,
input,
select,
textarea,
table {
  font-size: var(--fs-base);
  font-weight: var(--fw-regular);
}

label,
th,
td,
button,
input,
select,
textarea,
.nav-item,
.small {
  font-size: var(--fs-sm);
}






.form-header-actions {
  display: grid;
  grid-template-columns: minmax(185px, 220px) 38px 38px;
  align-items: end;
  gap: 8px;
}

.icon-action {
  width: 38px;
  height: 38px;
  min-height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 10px;
  background: #fff;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.icon-action svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.icon-action:hover { transform: translateY(-1px); }
.save-action {
  border: 1px solid #7dd3fc;
  color: var(--primary-strong);
}
.save-action:hover { background: #effaff; }
.delete-action {
  border: 1px solid #fecaca;
  color: var(--red);
}
.delete-action:hover { background: #fff5f5; }


.optional-entry-section {
  padding: 0;
  background: transparent;
  border: 0;
}









input::placeholder,
textarea::placeholder {
  color: transparent;
}



@media (max-width: 1480px) {
  
}
@media (max-width: 980px) {
  
  .form-header-actions { grid-template-columns: 1fr 38px 38px; width: 100%; }
  
  
}

/* Refined sticky card header: rounded, integrated, content scrolls underneath */













.icon-action {
  border-radius: 12px;
  background: rgba(255,255,255,.78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
}

@media (max-width: 980px) {
  
  
}

/* Clean integrated sticky header: single frame, compact controls */





















.icon-action {
  width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
}


/* keep content visually underneath the opaque sticky header while scrolling */




@media (max-width: 980px) {
  
  .form-header-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

/* Final clean card header fix: single frame, no lower stripe, strict one-line actions */

























.icon-action::before {
  content: "";
  width: 18px;
  height: 18px;
  display: block;
  background: currentColor;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
}

.save-action {
  border: 1px solid rgba(14, 165, 233, .42) !important;
  color: #0369a1 !important;
}


.save-action:hover {
  background: #effaff !important;
  border-color: rgba(14, 165, 233, .70) !important;
}

.delete-action {
  border: 1px solid rgba(239, 68, 68, .34) !important;
  color: #dc2626 !important;
}


.delete-action:hover {
  background: #fff5f5 !important;
  border-color: rgba(239, 68, 68, .62) !important;
}



/* header remains the visual mask; sections must never paint over it while scrolling */




@media (max-width: 980px) {
  
  
}

/* FINAL OVERRIDE — clean card editor layout, shared block system, fixed sticky header */
.titlebar {
  z-index: 300 !important;
  background: linear-gradient(180deg, rgba(245, 248, 252, .98), rgba(245, 248, 252, .94)) !important;
  margin-bottom: 8px !important;
}













.form-header-actions {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}











.icon-action {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  display: inline-grid !important;
  place-items: center !important;
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.icon-action svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.icon-action::before { content: none !important; display: none !important; }

.save-action {
  border: 1px solid rgba(14, 165, 233, .45) !important;
  color: #0369a1 !important;
}
.save-action:hover {
  background: #f0f9ff !important;
  border-color: rgba(14, 165, 233, .75) !important;
}
.delete-action {
  border: 1px solid rgba(239, 68, 68, .38) !important;
  color: #dc2626 !important;
}
.delete-action:hover {
  background: #fff5f5 !important;
  border-color: rgba(239, 68, 68, .70) !important;
}










.notes-section textarea {
  min-height: 74px !important;
  resize: vertical !important;
}






















@media (max-width: 1320px) {
  
  
  
  
}

@media (max-width: 980px) {
  
  .form-header-actions {
    width: 100% !important;
    justify-content: flex-start !important;
  }
  
}

/* FINAL FIX 2026-07-03 — editor scroll is clipped inside the card, no content escapes above the sticky header */

















.row-icon-action {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  align-self: end !important;
  display: inline-grid !important;
  place-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

.row-icon-action svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.row-icon-action::before,
.row-icon-action::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 980px) {
  
  
}


/* PATCH 2026-07-03 — cleaner optional sections, accounting padding, row actions, calc label */




















.line-row .row-icon-action,
.row-icon-action {
  width: 38px !important;
  min-width: 38px !important;
  height: var(--control-h, 40px) !important;
  min-height: var(--control-h, 40px) !important;
  max-height: var(--control-h, 40px) !important;
  align-self: end !important;
  border-radius: 11px !important;
}






@media (max-width: 1320px) {
  
}

/* PATCH 2026-07-04 — typography normalization and vertical alignment */

/* Header: label, date input and buttons on one vertical axis; more distance from calendar field */








/* All card block titles must use the same size/weight as the Data block */


/* Uniform field subtitles inside Data block — same size as start date row */


/* Vertical consistency in page blocks */



/* Keep add/delete controls equal to field height and visually centered */


/* Slightly cleaner vertical rhythm inside blocks */




/* PATCH 2026-07-04 — typography and vertical alignment hardening */

/* Header: keep calculation label same size as section titles and align controls on one center line */












/* All editor block titles use the same typographic level as „მონაცემები“ */


/* Form labels inside data and repeated rows stay uniform */


/* Section header rows and action buttons: strict vertical center */










/* FINAL PATCH 2026-07-04 — action colors, money fields, and strict vertical alignment */

/* Header: all controls sit on the same center axis */
















/* Action icon colors */
















/* Block titles and title+button rows: strict vertical center */






/* Repeated rows: fields and delete buttons share the same control height */






/* FINAL MICRO-PATCH 2026-07-04 — equal vertical padding in action sections + unclipped calc calendar */
/* Payment / contract-change blocks: title row must sit exactly in the vertical middle of the block when empty. */








/* Header calculation field: give the green calendar button enough physical width so its right side does not get clipped. */












/* PATCH 2026-07-04 — center header calendar icon and calculation date text */











/* LUCIDE ICON SYSTEM PATCH — unified SVG line icons + colorful sidebar trial */
.lucide,
.nav-icon svg,
.icon-action svg,
.row-icon-action svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  flex: 0 0 auto;
}

.nav-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid currentColor !important;
  box-shadow: none !important;
}
.nav-icon svg { width: 19px !important; height: 19px !important; }
.nav-item.active .nav-icon { color: #ffffff !important; border-color: transparent !important; }

/* Color-coded sidebar icons. Text remains neutral; only pictograms get color. */
.nav-main-group .nav-item:nth-child(1) .nav-icon { color: #2563eb !important; background: #eff6ff !important; }
.nav-main-group .nav-item:nth-child(2) .nav-icon { color: #0891b2 !important; background: #ecfeff !important; }
.nav-main-group .nav-item:nth-child(3) .nav-icon { color: #16a34a !important; background: #f0fdf4 !important; }
.nav-main-group .nav-item:nth-child(4) .nav-icon { color: #f97316 !important; background: #fff7ed !important; }
.nav-main-group .nav-item:nth-child(5) .nav-icon { color: #64748b !important; background: #f8fafc !important; }
.nav-main-group .nav-item:nth-child(6) .nav-icon { color: #7c3aed !important; background: #f5f3ff !important; }
.nav-main-group .nav-item:nth-child(7) .nav-icon { color: #0f766e !important; background: #f0fdfa !important; }
.nav-bottom-group .nav-item:nth-child(1) .nav-icon { color: #334155 !important; background: #f1f5f9 !important; }
.nav-bottom-group .nav-item:nth-child(2) .nav-icon { color: #0284c7 !important; background: #f0f9ff !important; }
.nav-bottom-group .nav-item:nth-child(3) .nav-icon { color: #dc2626 !important; background: #fef2f2 !important; }

.nav-main-group .nav-item.active:nth-child(1) .nav-icon { background: #2563eb !important; }
.nav-main-group .nav-item.active:nth-child(2) .nav-icon { background: #0891b2 !important; }
.nav-main-group .nav-item.active:nth-child(3) .nav-icon { background: #16a34a !important; }
.nav-main-group .nav-item.active:nth-child(4) .nav-icon { background: #f97316 !important; }
.nav-main-group .nav-item.active:nth-child(5) .nav-icon { background: #64748b !important; }
.nav-main-group .nav-item.active:nth-child(6) .nav-icon { background: #7c3aed !important; }
.nav-main-group .nav-item.active:nth-child(7) .nav-icon { background: #0f766e !important; }
.nav-bottom-group .nav-item.active:nth-child(1) .nav-icon { background: #334155 !important; }
.nav-bottom-group .nav-item.active:nth-child(2) .nav-icon { background: #0284c7 !important; }
.nav-bottom-group .nav-item.active:nth-child(3) .nav-icon { background: #dc2626 !important; }

.icon-action,
.row-icon-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.save-action { color: #2563eb !important; }
.delete-action,
.row-icon-action { color: #dc2626 !important; }
.delete-action svg,
.row-icon-action svg { stroke: #dc2626 !important; }

/* Replace native-looking calendar indicator with one Lucide-style calendar glyph. */







/* PATCH — Lucide-consistent traffic lights, sidebar spacing/active icon visibility, calendar de-duplication */

.window-controls button {
  width: 14px !important;
  height: 14px !important;
  min-width: 14px !important;
  min-height: 14px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  color: rgba(15, 23, 42, .78) !important;
  line-height: 1 !important;
  font-size: 0 !important;
}
.window-controls .traffic-icon {
  width: 9px !important;
  height: 9px !important;
  stroke-width: 2.6 !important;
  opacity: .78;
}
.window-controls button:hover .traffic-icon { opacity: 1; }

.sidebar-nav .nav-icon {
  flex: 0 0 36px !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 12px !important;
  border: 1px solid currentColor !important;
  box-shadow: none !important;
}
.sidebar-nav .nav-item.active .nav-icon {
  border-color: currentColor !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.32) !important;
}
/* Active state must not flood-fill the icon. Keep each pictogram readable in its own soft color tile. */
.nav-main-group .nav-item.active:nth-child(1) .nav-icon { color: #2563eb !important; background: #eff6ff !important; }
.nav-main-group .nav-item.active:nth-child(2) .nav-icon { color: #0891b2 !important; background: #ecfeff !important; }
.nav-main-group .nav-item.active:nth-child(3) .nav-icon { color: #16a34a !important; background: #f0fdf4 !important; }
.nav-main-group .nav-item.active:nth-child(4) .nav-icon { color: #f97316 !important; background: #fff7ed !important; }
.nav-main-group .nav-item.active:nth-child(5) .nav-icon { color: #64748b !important; background: #f8fafc !important; }
.nav-main-group .nav-item.active:nth-child(6) .nav-icon { color: #7c3aed !important; background: #f5f3ff !important; }
.nav-main-group .nav-item.active:nth-child(7) .nav-icon { color: #0f766e !important; background: #f0fdfa !important; }
.nav-bottom-group .nav-item.active:nth-child(1) .nav-icon { color: #334155 !important; background: #f1f5f9 !important; }
.nav-bottom-group .nav-item.active:nth-child(2) .nav-icon { color: #0284c7 !important; background: #f0f9ff !important; }
.nav-bottom-group .nav-item.active:nth-child(3) .nav-icon { color: #dc2626 !important; background: #fef2f2 !important; }

/* Calendar: one Lucide-style glyph only, same visual scale as save/delete, no native duplicate. */








/* PATCH v2 — sidebar spacing, pure Lucide titlebar controls, period label cleanup support */

/* Replace macOS traffic-dot visual with clean Lucide icon buttons while keeping the same titlebar position. */
.window-controls {
  gap: 8px !important;
  align-items: center !important;
}
.window-controls button {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  border-radius: 9px !important;
  border: 1px solid rgba(148, 163, 184, .38) !important;
  background: rgba(255, 255, 255, .76) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #64748b !important;
  line-height: 1 !important;
  font-size: 0 !important;
  overflow: visible !important;
}


.window-controls button:hover {
  background: #ffffff !important;
  border-color: currentColor !important;
  filter: none !important;
  transform: translateY(-1px);
}
.window-controls .traffic-icon {
  width: 17px !important;
  height: 17px !important;
  stroke-width: 2.15 !important;
  opacity: 1 !important;
}

/* Active sidebar icon: keep colored line icon readable; never flood-fill the pictogram. */
.sidebar-nav .nav-item.active .nav-icon {
  background: rgba(255, 255, 255, .88) !important;
  border-color: currentColor !important;
  color: inherit;
}

/* FINAL MICRO PATCH — compact Lucide titlebar controls + cleaner page scrollbars */
.titlebar {
  height: 34px !important;
  min-height: 34px !important;
  margin: -4px -8px 14px !important;
  padding: 4px 8px 6px 0 !important;
  align-items: flex-start !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}
.window-controls {
  height: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  padding: 0 4px 0 0 !important;
}
.window-controls button {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  padding: 0 !important;
  border-radius: 7px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  transform: none !important;
}
.window-controls button:hover {
  background: rgba(15, 23, 42, .055) !important;
  border-color: rgba(15, 23, 42, .08) !important;
  filter: none !important;
  transform: none !important;
}

/* Cleaner, macOS-like scrollbars: slim, quiet, no heavy track. */
.main-shell,
.table-wrap,
.sidebar-nav,
.nav-main-group{
  scrollbar-width: thin;
  scrollbar-color: rgba(100, 116, 139, .30) transparent;
}
.main-shell::-webkit-scrollbar,
.table-wrap::-webkit-scrollbar,
.sidebar-nav::-webkit-scrollbar,
.nav-main-group::-webkit-scrollbar{
  width: 6px !important;
  height: 6px !important;
}
.main-shell::-webkit-scrollbar-track,
.table-wrap::-webkit-scrollbar-track,
.sidebar-nav::-webkit-scrollbar-track,
.nav-main-group::-webkit-scrollbar-track{
  background: transparent !important;
}
.main-shell::-webkit-scrollbar-thumb,
.table-wrap::-webkit-scrollbar-thumb,
.sidebar-nav::-webkit-scrollbar-thumb,
.nav-main-group::-webkit-scrollbar-thumb{
  border-radius: 999px !important;
  background: rgba(100, 116, 139, .26) !important;
  border: 2px solid transparent !important;
  background-clip: padding-box !important;
}
.main-shell:hover::-webkit-scrollbar-thumb,
.table-wrap:hover::-webkit-scrollbar-thumb,
.sidebar-nav:hover::-webkit-scrollbar-thumb,
.nav-main-group:hover::-webkit-scrollbar-thumb{
  background: rgba(14, 116, 144, .42) !important;
  background-clip: padding-box !important;
}
/* Prevent accidental visual horizontal scrollbars in data pages unless a table truly overflows. */
.main-shell,
.sidebar-nav,
.nav-main-group{
  overflow-x: hidden !important;
}

/* Modern About page — Pactum / Marsus */



































.about-info-card h3{
  margin: 0;
  color: var(--ink);
  font-size: var(--fs-md);
  font-weight: 500;
  line-height: 1.25;
}

.about-info-card p{
  margin: 8px 0 0;
  color: var(--v2-ink);
  font-size: var(--fs-sm);
  line-height: 1.6;
}

.about-info-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr);
  gap: 12px;
  margin-top: 14px;
}






.about-tech-card dl {
  display: grid;
  gap: 8px;
  margin: 12px 0 0;
}




.about-tech-card dd {
  color: var(--ink);
  font-weight: 500;
  text-align: right;
}

.about-footer {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
  padding: 0 4px;
  color: var(--muted);
  font-size: var(--fs-xs);
}








@media (max-width: 1180px) {
  
  
  .about-info-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  
  
  
  
  .about-footer { flex-direction: column; }
  .about-tech-card dl div { grid-template-columns: 1fr; }
  .about-tech-card dd { text-align: left; }
}


/* Pactum about page compact hero patch */










@media (max-width: 920px) {
  
  
}

/* About blocks use transparent surfaces; Technical information spans the lower row. */





/* FINAL About footer/icon alignment — must remain last in the cascade. */








/* FINAL report alignment: controls share the New Card action lane; outer panel is transparent. */
html body .cases-main .cases-page-root > #reportPanel.report-builder-page {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  overflow: hidden !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}









html body .cases-main .report-action-strip #exportReportExcel.report-excel-action {
  box-sizing: border-box !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}



/* Cases report builder — Pactum report logic and layout. */
html body .report-builder-page {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: 76px minmax(0, 1fr);
  gap: 10px;
}

html body .report-builder-card{
  box-sizing: border-box;
  border: 1px solid rgba(191, 215, 238, .82);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .045);
}









html body .report-excel-action {
  box-sizing: border-box !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
}




html body .report-builder-card {
  min-width: 0;
  min-height: 0;
  padding: 14px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  overflow: hidden;
}




html body .report-field-catalog {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html body .report-field-catalog::-webkit-scrollbar{
  width: 0;
  height: 0;
  display: none;
}


html body .report-unified-row {
  box-sizing: border-box;
  min-height: 38px;
  padding: 4px 5px;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: rgba(248, 251, 255, .72);
}

html body .report-unified-row.is-active {
  border-color: rgba(2, 132, 199, .28);
  background: rgba(224, 242, 254, .48);
}

html body .report-drag-handle,
html body .report-drag-placeholder {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  color: #94a3b8;
}

html body .report-drag-handle { cursor: grab; }
html body .report-drag-handle:active { cursor: grabbing; }


html body .report-field-title-input {
  box-sizing: border-box;
  width: 100%;
  height: 28px;
  min-height: 28px;
  padding: 0 7px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: var(--ink);
  background: transparent;
  outline: none;
  font: inherit;
  font-size: var(--type-caption);
}

html body .report-field-title-input:focus {
  border-color: var(--primary);
  background: #fff;
}

html body .report-field-static-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--v2-muted);
  font-size: var(--type-caption);
}

html body .report-state-toggle {
  box-sizing: border-box;
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 8px;
  color: var(--v2-muted);
  background: transparent;
  cursor: pointer;
}

html body .report-state-toggle.is-inactive:hover { color: var(--primary); background: var(--primary-soft); }











@media (max-width: 980px) {
  
}





/* Patch: hide the native resize grip lines on cadastral-code and notes textareas, while keeping resize enabled. */
#notes{
  resize: vertical !important;
}

#notes::-webkit-resizer{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#notes::-webkit-scrollbar-corner{
  background: transparent !important;
}

/* FINAL HEADER VERTICAL BALANCE PATCH — equal distance above/below header content */










/* BLOCK VERTICAL BALANCE PATCH — equal top/bottom rhythm inside card blocks */






















/* Keep textarea/note and financial blocks visually centered with the same title rhythm. */





/* OPTIONAL SECTION SPACING + ICON ADD BUTTON PATCH */






.secondary-btn.icon-only,
.secondary-btn.small.icon-only {
  width: 42px !important;
  min-width: 42px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  line-height: 1 !important;
}

.secondary-btn.icon-only svg,
.secondary-btn.small.icon-only svg {
  width: 18px !important;
  height: 18px !important;
  stroke-width: 2 !important;
  flex: 0 0 auto !important;
}

.secondary-btn.icon-only.add-action {
  color: #2563eb !important;
  background: linear-gradient(180deg, rgba(239,246,255,.98), rgba(219,234,254,.92)) !important;
  border-color: rgba(37, 99, 235, .28) !important;
}

.secondary-btn.icon-only.add-action:hover {
  background: linear-gradient(180deg, rgba(219,234,254,1), rgba(191,219,254,.96)) !important;
  border-color: rgba(37, 99, 235, .44) !important;
}



/* FINAL ADD BUTTON RHYTHM PATCH — more breathing space + yellow Lucide plus buttons */






.secondary-btn.icon-only,
.secondary-btn.small.icon-only {
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

.secondary-btn.icon-only.add-action {
  color: #b45309 !important;
  background: linear-gradient(180deg, rgba(255,251,235,.98), rgba(254,243,199,.96)) !important;
  border-color: rgba(245, 158, 11, .42) !important;
  box-shadow: 0 10px 24px rgba(245, 158, 11, .12) !important;
}

.secondary-btn.icon-only.add-action:hover {
  color: #92400e !important;
  background: linear-gradient(180deg, rgba(254,243,199,1), rgba(253,230,138,.98)) !important;
  border-color: rgba(217, 119, 6, .55) !important;
}

.secondary-btn.icon-only.add-action svg {
  width: 19px !important;
  height: 19px !important;
  stroke-width: 2.05 !important;
}



/* FINAL PATCH — add buttons same size as save/delete + more top/bottom breathing space */






.secondary-btn.icon-only.add-action{
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  display: inline-grid !important;
  place-items: center !important;
  align-self: center !important;
  line-height: 1 !important;
}

.secondary-btn.icon-only.add-action svg{
  width: 18px !important;
  height: 18px !important;
  stroke-width: 2 !important;
}



/* CLEAN ADD-BUTTON PATCH — correct target is .form-section.optional-entry-section, not subpanel */










.secondary-btn.icon-only.add-action{
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 38px !important;
  line-height: 1 !important;
  color: #b45309 !important;
  background: rgba(255, 251, 235, .72) !important;
  border: 1px solid rgba(245, 158, 11, .34) !important;
  box-shadow: 0 6px 14px rgba(245, 158, 11, .08) !important;
}

.secondary-btn.icon-only.add-action:hover{
  color: #92400e !important;
  background: rgba(254, 243, 199, .92) !important;
  border-color: rgba(217, 119, 6, .48) !important;
  box-shadow: 0 8px 18px rgba(245, 158, 11, .12) !important;
}

.secondary-btn.icon-only.add-action svg{
  width: 20px !important;
  height: 20px !important;
  stroke-width: 1.9 !important;
}

/* ADD-BLOCK LAYOUT FIX — title left, action right, save/delete-sized button, balanced padding */














/* FINAL OVERRIDE — optional section vertical rhythm and add-button exact action sizing */
:root {
  --pactum-action-size: 38px;
  --pactum-action-icon: 20px;
}

/* Make optional blocks use the same top padding rhythm as the main Data block. */






/* Add button: exact same box as header save/delete action buttons. */
.secondary-btn.icon-only.add-action{
  box-sizing: border-box !important;
  width: var(--pactum-action-size) !important;
  min-width: var(--pactum-action-size) !important;
  max-width: var(--pactum-action-size) !important;
  height: var(--pactum-action-size) !important;
  min-height: var(--pactum-action-size) !important;
  max-height: var(--pactum-action-size) !important;
  flex: 0 0 var(--pactum-action-size) !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 10px !important;
  display: inline-grid !important;
  place-items: center !important;
  align-self: center !important;
  line-height: 1 !important;
}

.secondary-btn.icon-only.add-action svg{
  width: var(--pactum-action-icon) !important;
  height: var(--pactum-action-icon) !important;
  min-width: var(--pactum-action-icon) !important;
  min-height: var(--pactum-action-icon) !important;
  stroke-width: 1.8 !important;
}





/* RENT CHANGE TWO-LINE LAYOUT */










@media (max-width: 1100px) {
  
  
}

/* PATCH 2026-07-04 — repeated row typography/grid alignment fix */


/* Repeated sections must use the same label system as the main data block. */


/* Repeated-row controls inherit the exact field rhythm from the data block. */






/* Contract-change entry: two clean 3-column lines, all six fields equal width. */









/* Payments: same label/color/padding rhythm; delete button on the same right edge. */




/* The right edge of delete buttons must match the add button edge. */






/* Avoid older narrow-column rules overriding the new repeated-row grids. */
@media (max-width: 980px) {
  
  
}

/* PATCH: rent-change delete button belongs to the row's right action column, not inside the field grid. */




/* PATCH 2026-07-04 — rent change delete action at top row end; bottom fields equal top fields. */










/* Cancel older rules that positioned the delete button as a separate two-row action column. */


@media (max-width: 980px) {
  
  
}

/* PATCH 2026-07-04 — ONLY rent-change bottom-row width parity.
   Bottom row must reserve the same right action column as the top row,
   so its three fields have exactly the same width as the top three fields. */








/* === PATCH: unify all field subtitles/labels across card editor === */




/* PATCH 2026-07-04 — force identical subtitle tone for static and plus-added fields */




/* PATCH: keep date-pair controls aligned with normal fields after global label unification. */








/* === Lease tables: compact card-like header, wrapped cells, Excel-style filters === */
























































/* Lease table icon headers + compact accounting signs */












/* Lease table cleanup: no per-column filter buttons, compact status, non-wrapping amounts */


























/* PATCH 2026-07-04 — lease table centering, safer amount columns, custom status tooltip */








/* Rebalance widths: address slightly narrower; principal and surcharge wider. */
















/* Status names: native title can be unreliable in Electron; use a custom tooltip. */






/* PATCH — table/status/search visual cleanup */


















/* Status tooltip: use status-specific colors and avoid left-edge clipping. */
















/* PATCH — table header spacing + search/table frame alignment */
























/* PATCH — restore table usable width after header rounding patch */








/* PATCH — table header icon tooltips, same custom-tooltip behavior as status icons */




















/* PATCH 2026-07-05 — lease list header aligned with card editor header */
















/* Keep the table directly attached to the header; the table icon header stays visible with it. */
















@media (max-width: 980px) {
  
  
  
}

/* PATCH 2026-07-05 — lease pages scroll/padding aligned with card page */






















@media (max-width: 980px) {
  

  

  
}

/* PATCH 2026-07-05 — lease table search alignment and stable sticky table head */




















@media (max-width: 980px) {
  
}

/* PATCH 2026-07-05 — revert broken table sticky experiment; safe editor header edge alignment */
/* Card editor header: align left/right with the inner data block rhythm without changing page width. */


/* Lease list headers/search keep table-edge alignment; table header behavior is restored to the previous stable th-sticky version. */




/* PATCH 2026-07-05 — stable rounded sticky table header without breaking table geometry */














@media (max-width: 980px) {
  
}


/* PATCH 2026-07-05 — stable rounded lease table header border during scroll */










@media (max-width: 980px) {
  
}

/* PATCH 2026-07-05 — definitive lease-table scroll model
   Page header stays outside scroll; table scrolls inside its rounded frame.
   This avoids sticky top-offset collisions where body rows appear over the header. */






















@media (max-width: 980px) {
  

  
}


/* PATCH 2026-07-05 — status tooltip outside table scroll container
   The table now scrolls inside its rounded frame, so pseudo-element tooltips
   attached to the status icon are clipped by the scroll wrapper. Use a fixed
   body-level tooltip instead. */












/* Report constructor */











.report-builder-card {
  min-height: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 10px 26px rgba(15, 23, 42, .05);
  padding: 14px;
}




.report-builder-section-title h3 {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: var(--type-title);
  font-weight: 600;
  letter-spacing: -.01em;
}



























































@media (max-width: 1180px) {
  
  
  
}

/* Report builder refinement: trimmed field set, compact selected columns, Excel action */
































/* PATCH: payment/rent-change date pairs must keep the native date picker only on the icon area.
   A previous repeated-row rule made every input inside #payments/#rentChanges 100% wide;
   because the date input is transparent, it covered the text field and blocked typing. */








/* PATCH 2026-07-06 — lease table frame + auto-hidden scrollbar
   Remove the reserved scrollbar gutter that made the rounded table frame look inset. */








/* PATCH 2026-07-06 — hide persistent scrollbars on lease table pages
   Keeps wheel/trackpad scrolling active, but removes the permanent scrollbar rail. */






/* FINAL PATCH 2026-07-06 — auto-hide scrollbars app-wide.
   Scroll areas stay wheel/trackpad friendly, but the scrollbar rail is hidden until hover/focus. */
:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
) {
  scrollbar-gutter: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover,
:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within {
  scrollbar-width: thin !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover::-webkit-scrollbar,
:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar-track {
  background: transparent !important;
  border: 0 !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar-thumb {
  min-height: 38px !important;
  border: 2px solid transparent !important;
  border-radius: 999px !important;
  background: transparent !important;
  background-clip: padding-box !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover::-webkit-scrollbar-thumb,
:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within::-webkit-scrollbar-thumb {
  background-color: rgba(100, 116, 139, .34) !important;
}







/* PATCH 2026-07-06 — report page aligned with list-page headers and full Excel export UI */
#reportPanel.report-builder-page.page-section.active {
  display: block !important;
  position: relative !important;
  height: calc(100vh - 88px) !important;
  max-height: calc(100vh - 88px) !important;
  margin-bottom: 12px !important;
  padding: 0 16px 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  background: #fff !important;
  box-shadow: var(--shadow-soft) !important;
  scrollbar-gutter: auto !important;
}









#reportPanel .report-source-select {
  width: min(260px, 28vw) !important;
  min-width: 190px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 38px 0 14px !important;
  border: 1px solid #cfddea !important;
  border-radius: 12px !important;
  background-color: #fff !important;
  color: var(--ink) !important;
  font-size: var(--fs-sm) !important;
  font-weight: var(--fw-regular) !important;
  box-shadow: none !important;
}





#reportPanel .report-builder-card {
  min-height: 0 !important;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .05) !important;
  padding: 14px !important;
}




#reportPanel .report-builder-section-title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 12px !important;
  min-height: 34px !important;
}



#reportPanel .report-builder-section-title h3 {
  margin: 0 !important;
  color: var(--ink) !important;
  font-size: var(--fs-md) !important;
  font-weight: var(--fw-medium) !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}










@media (max-width: 1180px) {
  
  
  
  #reportPanel .report-source-select {
    width: min(100%, 320px) !important;
  }
}

/* FINAL PATCH 2026-07-06 — report constructor alignment and cleaner column cards */
#reportPanel.report-builder-page.page-section.active {
  display: flex !important;
  flex-direction: column !important;
  height: calc(100vh - 88px) !important;
  max-height: calc(100vh - 88px) !important;
  padding: 0 16px 16px !important;
  overflow: hidden !important;
}





#reportPanel .report-builder-card {
  min-height: 0 !important;
  box-sizing: border-box !important;
  border: 1px solid #d8e5f2 !important;
  border-radius: 18px !important;
  background: #fff !important;
  padding: 16px !important;
  box-shadow: none !important;
}



#reportPanel .report-builder-section-title > div {
  min-height: 40px !important;
  display: flex !important;
  align-items: center !important;
}



#reportPanel .report-builder-section-title h3{
  margin: 0 !important;
  font-size: var(--fs-md) !important;
  font-weight: var(--fw-medium) !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}


























@media (max-width: 1180px) {
  

  
}

/* FINAL PATCH 2026-07-06 — unified scrollbars, radius and Settings page polish */
:root {
  --pactum-radius: 16px;
  --radius-lg: var(--pactum-radius);
  --radius-md: var(--pactum-radius);
  --radius-sm: var(--pactum-radius);
}

/* One header title system on every page. */
:where(
  .page-header h1,
  .panel-title h2,
  .form-titlebar h2,
  .sticky-form-header h2,
  .sticky-list-header h2,
  #reportPanel .sticky-report-header h2,
  #settingsPanel .panel-title h2,
  #basesPanel .panel-title h2,
  #aboutPanel .about-hero-content h2
) {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  color: var(--ink) !important;
  font-family: "Sylfaen", "Segoe UI", "Noto Sans Georgian", Arial, sans-serif !important;
  font-size: var(--fs-title, var(--type-heading)) !important;
  font-weight: var(--fw-medium, 500) !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
}

/* Same corner language for main frames, tables, buttons and input controls. */
:where(
  .page-header,
  .panel,
  .kpi-card,
  .form-section,
  .subpanel,
  .report-card,
  .report-builder-card,
  .settings-card,
  .settings-control-card,
  .reference-settings-card,
  .base-status-card,
  .base-actions-card,
  .about-card,
  .about-hero-card,
  .about-brand-card,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .card-list-item,
  .nav-item,
  .db-status,
  .empty,
  .modal-card,
  .primary-btn,
  .primary-action,
  .secondary-btn,
  .ghost-btn,
  .table-search-field,
  .date-pair,
  .report-field-chip,
  .report-selected-row,
  .reference-row,
  input,
  select,
  textarea,
  button
) {
  border-radius: var(--pactum-radius) !important;
}



/* Keep intentional round system/window glyphs round. */

/* Unified auto-hidden scrollbar behavior for every real scroll container, including Report and Settings internals. */
:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
) {
  scrollbar-gutter: auto !important;
  scrollbar-width: none !important;
  scrollbar-color: rgba(100, 116, 139, .36) transparent !important;
  -ms-overflow-style: none !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover,
:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within {
  scrollbar-width: thin !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover::-webkit-scrollbar,
:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar-track {
  background: transparent !important;
  border: 0 !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar-thumb {
  min-height: 38px !important;
  border: 2px solid transparent !important;
  border-radius: 999px !important;
  background: transparent !important;
  background-clip: padding-box !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover::-webkit-scrollbar-thumb,
:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within::-webkit-scrollbar-thumb {
  background-color: rgba(100, 116, 139, .34) !important;
}

/* Report page: same header-to-table rhythm as the table pages. */
#reportPanel.report-builder-page.page-section.active {
  display: flex !important;
  flex-direction: column !important;
  height: calc(100vh - 88px) !important;
  max-height: calc(100vh - 88px) !important;
  padding: 0 16px 16px !important;
  overflow: hidden !important;
  background: #fff !important;
}





/* Settings page: reduced text, aligned controls, and clean internal scroll areas. */










































@media (max-width: 1180px) {
  

  
}

/* FINAL PATCH 2026-07-06 — UI systematization pass: one action size, one control rhythm, Settings action buttons matched to card buttons */
:root {
  --pactum-radius: 16px;
  --pactum-control-height: 38px;
  --pactum-action-size: 38px;
  --pactum-action-icon: 20px;
  --radius-lg: var(--pactum-radius);
  --radius-md: var(--pactum-radius);
  --radius-sm: var(--pactum-radius);
  --control-h: var(--pactum-control-height);
}

/* Typography: every page header title uses the same visual contract. */
:where(
  .panel-title h2,
  .form-titlebar h2,
  .sticky-form-header h2,
  .sticky-list-header h2,
  .report-builder-header h2,
  #reportPanel .sticky-report-header h2,
  #settingsPanel .panel-title h2,
  #basesPanel .panel-title h2,
  #aboutPanel .about-hero-content h2
) {
  font-family: "Sylfaen", "Segoe UI", "Noto Sans Georgian", Arial, sans-serif !important;
  font-size: var(--fs-title, var(--type-heading)) !important;
  font-weight: var(--fw-medium, 500) !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  margin: 0 !important;
}

/* Control rhythm: inputs/selects/buttons share one height and one corner language. */
:where(input, select, textarea, button, .primary-btn, .secondary-btn, .primary-action, .ghost-btn, .table-search-field, .date-pair) {
  border-radius: var(--pactum-radius) !important;
  font-family: "Sylfaen", "Segoe UI", "Noto Sans Georgian", Arial, sans-serif !important;
}

:where(input:not([type="checkbox"]):not([type="radio"]), select, .primary-btn, .secondary-btn, .primary-action, .ghost-btn) {
  min-height: var(--pactum-control-height) !important;
}

:where(textarea) {
  min-height: var(--pactum-control-height) !important;
}

/* Icon buttons: the card editor, Settings add, and Settings delete actions now use the same square. */
:where(.icon-action, .row-icon-action, .secondary-btn.icon-only.add-action) {
  box-sizing: border-box !important;
  width: var(--pactum-action-size) !important;
  min-width: var(--pactum-action-size) !important;
  max-width: var(--pactum-action-size) !important;
  height: var(--pactum-action-size) !important;
  min-height: var(--pactum-action-size) !important;
  max-height: var(--pactum-action-size) !important;
  flex: 0 0 var(--pactum-action-size) !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  line-height: 1 !important;
  border-radius: var(--pactum-radius) !important;
  box-shadow: none !important;
  font-size: 0 !important;
}

:where(.icon-action svg, .row-icon-action svg, .secondary-btn.icon-only.add-action svg) {
  width: var(--pactum-action-icon) !important;
  height: var(--pactum-action-icon) !important;
  min-width: var(--pactum-action-icon) !important;
  min-height: var(--pactum-action-icon) !important;
  stroke-width: 1.8 !important;
}

/* Settings page: clean grid, aligned add row and existing rows, card-sized add/delete buttons. */




























@media (max-width: 1180px) {
  
}

/* FINAL PATCH 2026-07-06 — Settings rows split into separate value and delete controls, matching add input + plus layout */










/* FINAL PATCH 2026-07-06 — About page header and equal information cards */


















@media (max-width: 1180px) {
  
}


/* FINAL PATCH 2026-07-06 — About cleanup and vertical equal info blocks */
































@media (max-width: 720px) {
  

  
}


/* FINAL PATCH 2026-07-06 — Restore About header and compact no-scroll vertical layout */










































@media (max-height: 820px) {
  

  

  
}

/* FINAL PATCH 2026-07-06 — About tech field padding and proportional card height */




























@media (max-height: 860px) {
  

  

  
}


/* FINAL PATCH 2026-07-06 — Move database actions into Settings; no separate Base page */
















@media (max-width: 840px) {
  

  
}


/* FINAL CORRECTION 2026-07-06 — page isolation, sticky headers, icon-only database actions */
/* Hidden pages must stay hidden even if page-specific display rules use !important. */
main > .page-section:not(.active),
main > form.page-section:not(.active){
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Active pages use their own layout only when active. */


/* Keep About information blocks scoped exclusively to the About page. */
main > .page-section:not(#aboutPanel) .about-info-grid,
main > .page-section:not(#aboutPanel) .about-info-card,
main > .page-section:not(#aboutPanel) .about-footer{
  display: none !important;
}

/* All page headers must stay frozen inside their page scroll area. */


/* Page scroll containers: content moves under the frozen header, not with it. */

/* Settings database block: keep title, make actions icon-only and systematic. */


















@media (max-width: 840px) {
  
  
}

/* FINAL CORRECTION 2026-07-06 — Settings reminder input width matched to two database icon actions */




@media (max-width: 840px) {
  

  
}


/* FINAL PATCH 2026-07-06 — report toolbar Excel icon button and compact source dropdown */


#reportPanel .report-source-select {
  width: 180px !important;
  min-width: 180px !important;
  max-width: 180px !important;
  height: var(--control-h, 38px) !important;
  min-height: var(--control-h, 38px) !important;
  padding: 0 30px 0 12px !important;
  font-size: var(--type-caption) !important;
  line-height: 1.2 !important;
  text-overflow: clip !important;
}

#reportPanel #exportReportExcel.report-excel-action{
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
  height: var(--control-h, 38px) !important;
  min-height: var(--control-h, 38px) !important;
  max-height: var(--control-h, 38px) !important;
  padding: 0 !important;
  border-radius: var(--radius-md, 12px) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  color: #047857 !important;
  border-color: rgba(4, 120, 87, .30) !important;
  background: linear-gradient(180deg, rgba(240,253,244,.98), rgba(220,252,231,.94)) !important;
  box-shadow: none !important;
  white-space: nowrap !important;
  font-size: 0 !important;
  line-height: 1 !important;
}

#reportPanel #exportReportExcel.report-excel-action:hover{
  color: #065f46 !important;
  border-color: rgba(4, 120, 87, .44) !important;
  background: linear-gradient(180deg, rgba(220,252,231,1), rgba(187,247,208,.96)) !important;
}

#reportPanel #exportReportExcel.report-excel-action svg{
  width: 19px !important;
  height: 19px !important;
  stroke-width: 2.05 !important;
  flex: 0 0 auto !important;
}

@media (max-width: 1180px) {
  #reportPanel .report-source-select {
    width: 180px !important;
    min-width: 180px !important;
    max-width: min(100%, 180px) !important;
  }
}

/* FINAL OVERRIDE 2026-07-06 — single button system across Pactum content UI
   Scope excludes sidebar navigation and native window controls. */
:root {
  --pactum-button-height: 38px;
  --pactum-action-size: 38px;
  --pactum-button-radius: var(--pactum-radius, 16px);
  --pactum-button-border: #cfddea;
  --pactum-button-border-hover: #9fc5e6;
  --pactum-button-bg: rgba(255, 255, 255, .94);
  --pactum-button-bg-hover: rgba(248, 251, 255, 1);
  --pactum-button-icon: 18px;
  --pactum-button-font: var(--type-caption);
}

/* Text buttons: one height, one border, one radius, one internal rhythm. */
:where(
  main .primary-action:not(.icon-only),
  main .secondary-btn:not(.icon-only),
  main .secondary-btn.small:not(.icon-only),
  main .ghost-btn:not(.icon-only),
  main button.primary-action:not(.icon-only),
  main button.secondary-btn:not(.icon-only),
  main button.ghost-btn:not(.icon-only)
) {
  min-height: var(--pactum-button-height) !important;
  height: var(--pactum-button-height) !important;
  max-height: var(--pactum-button-height) !important;
  padding: 0 14px !important;
  border: 1px solid var(--pactum-button-border) !important;
  border-radius: var(--pactum-button-radius) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  font-family: "Sylfaen", "Segoe UI", "Noto Sans Georgian", Arial, sans-serif !important;
  font-size: var(--pactum-button-font) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}

:where(
  main .secondary-btn:not(.icon-only),
  main .secondary-btn.small:not(.icon-only),
  main .ghost-btn:not(.icon-only),
  main button.secondary-btn:not(.icon-only),
  main button.ghost-btn:not(.icon-only)
) {
  color: var(--ink, #0f172a) !important;
  background: var(--pactum-button-bg) !important;
}

:where(
  main .secondary-btn:not(.icon-only):hover,
  main .secondary-btn.small:not(.icon-only):hover,
  main .ghost-btn:not(.icon-only):hover,
  main button.secondary-btn:not(.icon-only):hover,
  main button.ghost-btn:not(.icon-only):hover
) {
  border-color: var(--pactum-button-border-hover) !important;
  background: var(--pactum-button-bg-hover) !important;
}

:where(main .primary-action:not(.icon-only), main button.primary-action:not(.icon-only)) {
  color: #075985 !important;
  border-color: rgba(2, 132, 199, .32) !important;
  background: linear-gradient(180deg, rgba(240, 249, 255, .98), rgba(224, 242, 254, .94)) !important;
}

/* Icon/action buttons: exact same physical size and border language everywhere. */
:where(
  main .icon-action,
  main .row-icon-action,
  main .secondary-btn.icon-only,
  main .secondary-btn.small.icon-only,
  main .primary-action.icon-only,
  main .base-action-button,
  main .report-excel-action,
  #reportPanel .report-selected-actions button,
  #settingsPanel .reference-add-row button,
  #settingsPanel .reference-row button,
  #editorPanel .section-action-title button,
  #editorPanel .line-row button
) {
  width: var(--pactum-action-size) !important;
  min-width: var(--pactum-action-size) !important;
  max-width: var(--pactum-action-size) !important;
  height: var(--pactum-action-size) !important;
  min-height: var(--pactum-action-size) !important;
  max-height: var(--pactum-action-size) !important;
  padding: 0 !important;
  border: 1px solid var(--pactum-button-border) !important;
  border-radius: var(--pactum-button-radius) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  font-family: "Sylfaen", "Segoe UI", "Noto Sans Georgian", Arial, sans-serif !important;
  font-size: var(--type-title) !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  transform: none !important;
  white-space: nowrap !important;
  flex: 0 0 var(--pactum-action-size) !important;
}

:where(
  main .icon-action:hover,
  main .row-icon-action:hover,
  main .secondary-btn.icon-only:hover,
  main .secondary-btn.small.icon-only:hover,
  main .primary-action.icon-only:hover,
  main .base-action-button:hover,
  main .report-excel-action:hover,
  #reportPanel .report-selected-actions button:hover,
  #settingsPanel .reference-add-row button:hover,
  #settingsPanel .reference-row button:hover,
  #editorPanel .section-action-title button:hover,
  #editorPanel .line-row button:hover
) {
  transform: none !important;
  box-shadow: none !important;
}

:where(
  main .icon-action svg,
  main .row-icon-action svg,
  main .secondary-btn.icon-only svg,
  main .secondary-btn.small.icon-only svg,
  main .primary-action.icon-only svg,
  main .base-action-button svg,
  main .report-excel-action svg,
  #settingsPanel .reference-add-row button svg,
  #settingsPanel .reference-row button svg,
  #editorPanel .section-action-title button svg,
  #editorPanel .line-row button svg
) {
  width: var(--pactum-button-icon) !important;
  height: var(--pactum-button-icon) !important;
  min-width: var(--pactum-button-icon) !important;
  min-height: var(--pactum-button-icon) !important;
  stroke-width: 2.05 !important;
  flex: 0 0 auto !important;
}

/* Button color semantics stay consistent by action type. */
:where(main .save-action) {
  color: #047857 !important;
  border-color: rgba(4, 120, 87, .30) !important;
  background: linear-gradient(180deg, rgba(240, 253, 244, .98), rgba(220, 252, 231, .94)) !important;
}

:where(main .save-action:hover) {
  border-color: rgba(4, 120, 87, .44) !important;
  background: linear-gradient(180deg, rgba(220, 252, 231, 1), rgba(187, 247, 208, .96)) !important;
}

:where(main .delete-action, main .row-icon-action.delete-action, #reportPanel .report-selected-actions button[data-report-remove]) {
  color: #dc2626 !important;
  border-color: rgba(220, 38, 38, .26) !important;
  background: linear-gradient(180deg, rgba(255, 245, 245, .98), rgba(254, 226, 226, .90)) !important;
}

:where(main .delete-action:hover, main .row-icon-action.delete-action:hover, #reportPanel .report-selected-actions button[data-report-remove]:hover) {
  border-color: rgba(220, 38, 38, .40) !important;
  background: linear-gradient(180deg, rgba(254, 226, 226, 1), rgba(254, 202, 202, .92)) !important;
}

:where(main .add-action, main .secondary-btn.icon-only.add-action, main .secondary-btn.small.icon-only.add-action) {
  color: #b45309 !important;
  border-color: rgba(217, 119, 6, .30) !important;
  background: linear-gradient(180deg, rgba(255, 251, 235, .98), rgba(254, 243, 199, .92)) !important;
}

:where(main .add-action:hover, main .secondary-btn.icon-only.add-action:hover, main .secondary-btn.small.icon-only.add-action:hover) {
  border-color: rgba(217, 119, 6, .44) !important;
  background: linear-gradient(180deg, rgba(254, 243, 199, 1), rgba(253, 230, 138, .90)) !important;
}

:where(main .report-excel-action) {
  color: #047857 !important;
  border-color: rgba(4, 120, 87, .30) !important;
  background: linear-gradient(180deg, rgba(240, 253, 244, .98), rgba(220, 252, 231, .94)) !important;
  font-size: 0 !important;
}

:where(main .report-excel-action:hover) {
  border-color: rgba(4, 120, 87, .44) !important;
  background: linear-gradient(180deg, rgba(220, 252, 231, 1), rgba(187, 247, 208, .96)) !important;
}

:where(main .base-open-action) {
  color: #2563eb !important;
  border-color: rgba(37, 99, 235, .30) !important;
  background: linear-gradient(180deg, rgba(239, 246, 255, .98), rgba(219, 234, 254, .94)) !important;
  font-size: 0 !important;
}

:where(main .base-open-action:hover) {
  border-color: rgba(37, 99, 235, .44) !important;
  background: linear-gradient(180deg, rgba(219, 234, 254, 1), rgba(191, 219, 254, .94)) !important;
}

:where(main .base-archive-action) {
  color: #b45309 !important;
  border-color: rgba(217, 119, 6, .30) !important;
  background: linear-gradient(180deg, rgba(255, 251, 235, .98), rgba(254, 243, 199, .92)) !important;
  font-size: 0 !important;
}

:where(main .base-archive-action:hover) {
  border-color: rgba(217, 119, 6, .44) !important;
  background: linear-gradient(180deg, rgba(254, 243, 199, 1), rgba(253, 230, 138, .90)) !important;
}

/* Report column row arrows use the same button box but neutral color. */






/* Keep layout columns aligned with the unified action size. */








/* PATCH 2026-07-06 — stable scrollbar gutter, no layout jump on show/hide.
   Scrollbars keep a reserved transparent gutter; only the thumb color changes on hover/focus. */
:root {
  --pactum-scrollbar-size: 8px;
  --pactum-scrollbar-thumb: rgba(100, 116, 139, .34);
  --pactum-scrollbar-thumb-hover: rgba(71, 85, 105, .44);
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #dataPanel.lease-table-panel.page-section.active,
  #terminatedPanel.lease-table-panel.page-section.active,
  #archivePanel.lease-table-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
) {
  scrollbar-gutter: stable !important;
  scrollbar-width: thin !important;
  scrollbar-color: transparent transparent !important;
  -ms-overflow-style: auto !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #dataPanel.lease-table-panel.page-section.active,
  #terminatedPanel.lease-table-panel.page-section.active,
  #archivePanel.lease-table-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover,
:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #dataPanel.lease-table-panel.page-section.active,
  #terminatedPanel.lease-table-panel.page-section.active,
  #archivePanel.lease-table-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within {
  scrollbar-width: thin !important;
  scrollbar-color: var(--pactum-scrollbar-thumb) transparent !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #dataPanel.lease-table-panel.page-section.active,
  #terminatedPanel.lease-table-panel.page-section.active,
  #archivePanel.lease-table-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar{
  display: block !important;
  width: var(--pactum-scrollbar-size) !important;
  height: var(--pactum-scrollbar-size) !important;
  background: transparent !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #dataPanel.lease-table-panel.page-section.active,
  #terminatedPanel.lease-table-panel.page-section.active,
  #archivePanel.lease-table-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar-track{
  display: block !important;
  background: transparent !important;
  border: 0 !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #dataPanel.lease-table-panel.page-section.active,
  #terminatedPanel.lease-table-panel.page-section.active,
  #archivePanel.lease-table-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar-thumb{
  display: block !important;
  min-height: 38px !important;
  border: 2px solid transparent !important;
  border-radius: 999px !important;
  background-color: transparent !important;
  background-clip: padding-box !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #dataPanel.lease-table-panel.page-section.active,
  #terminatedPanel.lease-table-panel.page-section.active,
  #archivePanel.lease-table-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover::-webkit-scrollbar-thumb,
:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #dataPanel.lease-table-panel.page-section.active,
  #terminatedPanel.lease-table-panel.page-section.active,
  #archivePanel.lease-table-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within::-webkit-scrollbar-thumb{
  background-color: var(--pactum-scrollbar-thumb) !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #dataPanel.lease-table-panel.page-section.active,
  #terminatedPanel.lease-table-panel.page-section.active,
  #archivePanel.lease-table-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover::-webkit-scrollbar-thumb:hover {
  background-color: var(--pactum-scrollbar-thumb-hover) !important;
}

/* PATCH 2026-07-06 — specificity lock for stable scrollbars.
   This overrides older ID/class rules that used scrollbar-width:none or scrollbar-gutter:auto. */
body,
.main-shell,
.page-section,
#reportPanel.report-builder-page.page-section.active,
.table-wrap,
.report-field-catalog,
.sidebar-nav,
.nav-main-group,
textarea{
  scrollbar-gutter: stable !important;
  scrollbar-width: thin !important;
  scrollbar-color: transparent transparent !important;
  -ms-overflow-style: auto !important;
}

body:hover,
.main-shell:hover,
.page-section:hover,
#reportPanel.report-builder-page.page-section.active:hover,
.table-wrap:hover,
.report-field-catalog:hover,
.sidebar-nav:hover,
.nav-main-group:hover,
textarea:hover,
body:focus-within,
.main-shell:focus-within,
.page-section:focus-within,
#reportPanel.report-builder-page.page-section.active:focus-within,
.table-wrap:focus-within,
.report-field-catalog:focus-within,
.sidebar-nav:focus-within,
.nav-main-group:focus-within,
textarea:focus-within{
  scrollbar-width: thin !important;
  scrollbar-color: var(--pactum-scrollbar-thumb) transparent !important;
}

/* PATCH 2026-07-06 — remove reserved scrollbar gutter from lease table frames.
   The global stable-scrollbar rule prevents layout jumping, but on the three
   table pages it left a visible empty strip between the table edge and the
   outer card. These table pages use their own inner scroll area, so the gutter
   must not be reserved on the page/card frame itself. */






/* FINAL FIX 2026-07-06 — equal header action buttons in New Card and Report.
   The previous Report Excel selector was more specific and kept 42px width.
   This rule intentionally matches/overrides that selector so Save, Delete and Excel share the same physical box. */
#reportPanel #exportReportExcel.report-excel-action{
  width: var(--pactum-action-size, 38px) !important;
  min-width: var(--pactum-action-size, 38px) !important;
  max-width: var(--pactum-action-size, 38px) !important;
  height: var(--pactum-action-size, 38px) !important;
  min-height: var(--pactum-action-size, 38px) !important;
  max-height: var(--pactum-action-size, 38px) !important;
  padding: 0 !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-radius: var(--pactum-button-radius, var(--pactum-radius, 16px)) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  transform: none !important;
  flex: 0 0 var(--pactum-action-size, 38px) !important;
}

#reportPanel #exportReportExcel.report-excel-action svg{
  width: var(--pactum-button-icon, 18px) !important;
  height: var(--pactum-button-icon, 18px) !important;
  min-width: var(--pactum-button-icon, 18px) !important;
  min-height: var(--pactum-button-icon, 18px) !important;
  stroke-width: 2.05 !important;
  flex: 0 0 auto !important;
}

/* FINAL AUDIT PATCH 2026-07-06 — hard button system across all content pages.
   This is intentionally the last button layer. Previous patches left a few more
   specific selectors with different button boxes. From here on, content buttons
   share the same height, border, radius and icon geometry. Sidebar nav and
   window traffic controls are excluded because they are application chrome. */
:root {
  --pactum-button-height: 38px;
  --pactum-action-size: 38px;
  --pactum-button-icon: 18px;
  --pactum-button-radius: var(--pactum-radius, 16px);
  --pactum-button-border: #cfddea;
  --pactum-button-border-hover: #9fc5e6;
  --pactum-button-bg: rgba(255, 255, 255, .94);
  --pactum-button-bg-hover: rgba(248, 251, 255, 1);
  --pactum-button-font-size: var(--type-caption);
  --pactum-button-font-weight: 800;
}

main .page-section button:not(.nav-item){
  box-sizing: border-box !important;
  min-height: var(--pactum-button-height) !important;
  height: var(--pactum-button-height) !important;
  max-height: var(--pactum-button-height) !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-color: var(--pactum-button-border) !important;
  border-radius: var(--pactum-button-radius) !important;
  padding: 0 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  line-height: 1 !important;
  font-size: var(--pactum-button-font-size) !important;
  font-weight: var(--pactum-button-font-weight) !important;
  font-family: inherit !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  outline-offset: 2px !important;
}

main .page-section button:not(.nav-item):not(.save-action):not(.delete-action):not(.add-action):not(.report-excel-action):not(.base-open-action):not(.base-archive-action){
  background: var(--pactum-button-bg) !important;
  color: #24455f !important;
}

main .page-section button:not(.nav-item):hover{
  border-color: var(--pactum-button-border-hover) !important;
  transform: none !important;
}

/* Exact square icon/action buttons. */
main .page-section button.icon-only,
main .page-section button.icon-action,
main .page-section button.row-icon-action,
main .page-section button.report-excel-action,
#reportPanel #exportReportExcel{
  width: var(--pactum-action-size) !important;
  min-width: var(--pactum-action-size) !important;
  max-width: var(--pactum-action-size) !important;
  height: var(--pactum-action-size) !important;
  min-height: var(--pactum-action-size) !important;
  max-height: var(--pactum-action-size) !important;
  padding: 0 !important;
  flex: 0 0 var(--pactum-action-size) !important;
  gap: 0 !important;
  overflow: hidden !important;
}

main .page-section button svg,
main .page-section button .lucide{
  width: var(--pactum-button-icon) !important;
  height: var(--pactum-button-icon) !important;
  min-width: var(--pactum-button-icon) !important;
  min-height: var(--pactum-button-icon) !important;
  flex: 0 0 var(--pactum-button-icon) !important;
  stroke-width: 2.05 !important;
}

/* Text/selectable buttons stay variable-width but keep the same control height and border language. */
main .page-section button.secondary-btn:not(.icon-only){
  min-height: var(--pactum-button-height) !important;
  height: var(--pactum-button-height) !important;
  max-height: var(--pactum-button-height) !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-color: var(--pactum-button-border) !important;
  border-radius: var(--pactum-button-radius) !important;
}







/* Keep the known action colors, but with the unified button box. */
main .page-section button.save-action {
  border-color: rgba(22, 163, 74, .32) !important;
  background: #ecfdf3 !important;
  color: #15803d !important;
}

main .page-section button.delete-action{
  border-color: rgba(220, 38, 38, .28) !important;
  background: #fff1f2 !important;
  color: #dc2626 !important;
}

main .page-section button.add-action{
  border-color: rgba(217, 119, 6, .32) !important;
  background: #fffbeb !important;
  color: #b45309 !important;
}

main .page-section button.report-excel-action {
  border-color: rgba(22, 163, 74, .32) !important;
  background: #ecfdf3 !important;
  color: #15803d !important;
}



/* Report toolbar dropdown aligns to the same 38px control system. */
#reportPanel .report-source-select {
  height: var(--pactum-button-height) !important;
  min-height: var(--pactum-button-height) !important;
  max-height: var(--pactum-button-height) !important;
  border-radius: var(--pactum-button-radius) !important;
  border: 1px solid var(--pactum-button-border) !important;
}


/* FINAL PATCH 2026-07-06 — clean, symmetric report selected-column rows.
   The previous row mixed a tall input block with top-aligned 38px action buttons; this made the card look uneven. */
















/* FINAL PATCH 2026-07-06 — remove the visible outer/page scrollbar rail.
   Page-level containers must not show a scrollbar on the app edge. Real scrolling stays
   inside content blocks/lists/tables, so the application chrome stays visually clean. */
html,
body,
.main-shell,
.page-section,
.page-section.active,
#reportPanel.report-builder-page.page-section.active{
  scrollbar-gutter: auto !important;
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
  -ms-overflow-style: none !important;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
.main-shell::-webkit-scrollbar,
.page-section::-webkit-scrollbar,
.page-section.active::-webkit-scrollbar,
#reportPanel.report-builder-page.page-section.active::-webkit-scrollbar{
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
.main-shell::-webkit-scrollbar-track,
.page-section::-webkit-scrollbar-track,
.page-section.active::-webkit-scrollbar-track,
#reportPanel.report-builder-page.page-section.active::-webkit-scrollbar-track,
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
.main-shell::-webkit-scrollbar-thumb,
.page-section::-webkit-scrollbar-thumb,
.page-section.active::-webkit-scrollbar-thumb,
#reportPanel.report-builder-page.page-section.active::-webkit-scrollbar-thumb{
  display: none !important;
  background: transparent !important;
  border: 0 !important;
}

/* Keep the actual inner scroll containers functional and styled; only the outer rail is removed. */
#reportPanel .report-field-catalog,
.sidebar-nav,
.nav-main-group,
textarea{
  scrollbar-gutter: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

#reportPanel .report-field-catalog:hover,
.sidebar-nav:hover,
.nav-main-group:hover,
textarea:hover,
#reportPanel .report-field-catalog:focus-within,
.sidebar-nav:focus-within,
.nav-main-group:focus-within,
textarea:focus-within{
  scrollbar-width: thin !important;
  scrollbar-color: var(--pactum-scrollbar-thumb) transparent !important;
}

#reportPanel .report-field-catalog::-webkit-scrollbar,
.sidebar-nav::-webkit-scrollbar,
.nav-main-group::-webkit-scrollbar,
textarea::-webkit-scrollbar{
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

#reportPanel .report-field-catalog:hover::-webkit-scrollbar,
.sidebar-nav:hover::-webkit-scrollbar,
.nav-main-group:hover::-webkit-scrollbar,
textarea:hover::-webkit-scrollbar,
#reportPanel .report-field-catalog:focus-within::-webkit-scrollbar,
.sidebar-nav:focus-within::-webkit-scrollbar,
.nav-main-group:focus-within::-webkit-scrollbar,
textarea:focus-within::-webkit-scrollbar{
  width: var(--pactum-scrollbar-size) !important;
  height: var(--pactum-scrollbar-size) !important;
}

#reportPanel .report-field-catalog::-webkit-scrollbar-track,
.sidebar-nav::-webkit-scrollbar-track,
.nav-main-group::-webkit-scrollbar-track,
textarea::-webkit-scrollbar-track{
  background: transparent !important;
  border: 0 !important;
}

#reportPanel .report-field-catalog::-webkit-scrollbar-thumb,
.sidebar-nav::-webkit-scrollbar-thumb,
.nav-main-group::-webkit-scrollbar-thumb,
textarea::-webkit-scrollbar-thumb{
  min-height: 38px !important;
  border: 2px solid transparent !important;
  border-radius: 999px !important;
  background-color: transparent !important;
  background-clip: padding-box !important;
}

#reportPanel .report-field-catalog:hover::-webkit-scrollbar-thumb,
.sidebar-nav:hover::-webkit-scrollbar-thumb,
.nav-main-group:hover::-webkit-scrollbar-thumb,
textarea:hover::-webkit-scrollbar-thumb,
#reportPanel .report-field-catalog:focus-within::-webkit-scrollbar-thumb,
.sidebar-nav:focus-within::-webkit-scrollbar-thumb,
.nav-main-group:focus-within::-webkit-scrollbar-thumb,
textarea:focus-within::-webkit-scrollbar-thumb{
  background-color: var(--pactum-scrollbar-thumb) !important;
}

/* FINAL PATCH 2026-07-06 — report selected-column rows: one-line, compact, aligned.
   Label, editable input, and actions must share the same horizontal axis. */













/* FINAL PATCH 2026-07-06 — conditional scrollbars.
   Scrollbar is completely absent while content fits; it appears only after the container actually overflows.
   This avoids the page/container movement caused by always-reserved gutters. */
:root {
  --pactum-scrollbar-size: 8px;
}

html,
body,
.main-shell {
  overflow: hidden !important;
  scrollbar-gutter: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
.main-shell::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

#reportPanel.report-builder-page.page-section.active,
#reportPanel .report-field-catalog,
.sidebar-nav,
.nav-main-group,
textarea{
  scrollbar-gutter: auto !important;
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
  -ms-overflow-style: none !important;
}

#reportPanel.report-builder-page.page-section.active:not(.pactum-scrollable),
#reportPanel .report-field-catalog:not(.pactum-scrollable),
.sidebar-nav:not(.pactum-scrollable),
.nav-main-group:not(.pactum-scrollable),
textarea:not(.pactum-scrollable){
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}



#reportPanel.report-builder-page.page-section.active::-webkit-scrollbar,
#reportPanel .report-field-catalog::-webkit-scrollbar,
.sidebar-nav::-webkit-scrollbar,
.nav-main-group::-webkit-scrollbar,
textarea::-webkit-scrollbar{
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}



#reportPanel.report-builder-page.page-section.active::-webkit-scrollbar-track,
#reportPanel .report-field-catalog::-webkit-scrollbar-track,
.sidebar-nav::-webkit-scrollbar-track,
.nav-main-group::-webkit-scrollbar-track,
textarea::-webkit-scrollbar-track{
  background: transparent !important;
  border: 0 !important;
}

#reportPanel.report-builder-page.page-section.active::-webkit-scrollbar-thumb,
#reportPanel .report-field-catalog::-webkit-scrollbar-thumb,
.sidebar-nav::-webkit-scrollbar-thumb,
.nav-main-group::-webkit-scrollbar-thumb,
textarea::-webkit-scrollbar-thumb{
  min-height: 38px !important;
  border: 2px solid transparent !important;
  border-radius: 999px !important;
  background-color: var(--pactum-scrollbar-thumb, rgba(100, 116, 139, .45)) !important;
  background-clip: padding-box !important;
}

/* FINAL PATCH 2026-07-06 — report field/column blocks unified.
   The selected-columns list now follows the same chip language as the available-fields list:
   no numbering, no separate field label, no up/down/delete button boxes; editable title + inline minus only. */





























/* FINAL PATCH 2026-07-06 — report fields/columns: flat list, regular black text, symmetric add/remove chips. */


#reportPanel .report-field-catalog{
  align-content: start !important;
}























/* FINAL PATCH 2026-07-06 — Report builder single-field list: state toggle, drag handle, hidden scrollbar. */





#reportPanel .report-unified-field-catalog {
  min-height: 0 !important;
  overflow: auto !important;
  padding-right: 0 !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

#reportPanel .report-unified-field-catalog::-webkit-scrollbar,
#reportPanel .report-unified-field-catalog:hover::-webkit-scrollbar,
#reportPanel .report-unified-field-catalog:focus-within::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

#reportPanel .report-unified-field-catalog::-webkit-scrollbar-thumb,
#reportPanel .report-unified-field-catalog:hover::-webkit-scrollbar-thumb,
#reportPanel .report-unified-field-catalog:focus-within::-webkit-scrollbar-thumb {
  background: transparent !important;
}


#reportPanel .report-unified-row {
  width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) 24px !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 10px 0 8px !important;
  margin: 0 !important;
  border: 1px solid var(--pactum-button-border, #cfddea) !important;
  border-radius: var(--pactum-button-radius, 14px) !important;
  background: #fff !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  transition: background .14s ease, border-color .14s ease, box-shadow .14s ease, opacity .14s ease !important;
}

#reportPanel .report-unified-row.is-active {
  background: rgba(240, 253, 244, .78) !important;
  border-color: rgba(134, 239, 172, .95) !important;
}





#reportPanel .report-drag-handle,
#reportPanel .report-drag-placeholder {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 9px !important;
  color: #94a3b8 !important;
}

#reportPanel .report-drag-handle {
  cursor: grab !important;
  background: rgba(248, 250, 252, .92) !important;
}

#reportPanel .report-drag-handle:hover,
#reportPanel .report-drag-handle:focus-visible {
  color: #2563eb !important;
  background: rgba(239, 246, 255, .96) !important;
}

#reportPanel .report-drag-handle:active {
  cursor: grabbing !important;
}


#reportPanel .report-field-static-title,
#reportPanel .report-field-title-input,
#reportPanel .report-field-title-input:hover,
#reportPanel .report-field-title-input:focus {
  width: 100% !important;
  min-width: 0 !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  color: #111827 !important;
  font-family: "Sylfaen", "Segoe UI", "Noto Sans Georgian", Arial, sans-serif !important;
  font-size: var(--type-caption) !important;
  font-weight: 400 !important;
  line-height: 36px !important;
  letter-spacing: 0 !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: auto !important;
}


#reportPanel .report-field-title-input::placeholder {
  color: var(--cases-ink-muted) !important;
  opacity: .65 !important;
}

#reportPanel .report-state-toggle,
#reportPanel .report-state-toggle:hover,
#reportPanel .report-state-toggle:focus {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: end !important;
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font-family: "Segoe UI", Arial, sans-serif !important;
  font-size: var(--type-title) !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-align: center !important;
}

#reportPanel .report-state-toggle.is-inactive {
  background: rgba(239, 246, 255, .86) !important;
  color: #2563eb !important;
}

#reportPanel .report-state-toggle.is-inactive:hover,
#reportPanel .report-state-toggle.is-inactive:focus-visible {
  background: rgba(219, 234, 254, .96) !important;
}

#reportPanel .report-state-toggle.is-active {
  background: rgba(220, 252, 231, .96) !important;
  color: #15803d !important;
}

#reportPanel .report-state-toggle.is-active:hover,
#reportPanel .report-state-toggle.is-active:focus-visible {
  background: rgba(187, 247, 208, .96) !important;
}

#reportPanel .report-state-toggle span {
  transform: translateY(-.5px) !important;
}

@media (max-width: 1100px) {
  
}

/* FINAL PATCH 2026-07-06 — Report single-field builder full-width layout + hidden internal scrollbars. */


#reportPanel .report-unified-field-card{
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

#reportPanel .report-unified-field-card {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  max-height: clamp(250px, 36vh, 372px) !important;
  overflow: hidden !important;
}



#reportPanel .report-unified-field-catalog {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: auto !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  scrollbar-gutter: auto !important;
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
  -ms-overflow-style: none !important;
}

#reportPanel .report-unified-list {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(255px, 1fr)) !important;
  gap: 8px !important;
  align-content: start !important;
  align-items: start !important;
}


#reportPanel .report-unified-field-catalog::-webkit-scrollbar,
#reportPanel .report-unified-field-catalog:hover::-webkit-scrollbar,
#reportPanel .report-unified-field-catalog:focus-within::-webkit-scrollbar{
  width: 0 !important;
  height: 0 !important;
  display: none !important;
  background: transparent !important;
}

#reportPanel .report-unified-field-catalog::-webkit-scrollbar-thumb,
#reportPanel .report-unified-field-catalog:hover::-webkit-scrollbar-thumb,
#reportPanel .report-unified-field-catalog:focus-within::-webkit-scrollbar-thumb{
  background: transparent !important;
  border: 0 !important;
}



@media (max-width: 980px) {
  #reportPanel .report-unified-list {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  }
}

/* FINAL PATCH 2026-07-06 — Report starts empty + uniform preview table cell sizing. */








/* FINAL PATCH 2026-07-06 — Lease tables: single divider between header and rows.
   Remove the duplicated line caused by the sticky table header using both border-bottom and box-shadow. */




/* FINAL PATCH 2026-07-06 — Settings reference blocks: hide list scrollbars permanently.
   Municipality / Purpose / Performer lists may remain wheel-scrollable when overflowing,
   but the scrollbar gutter/thumb must never be visible in the Settings page cards. */






/* FINAL PATCH 2026-07-06 — card editor repeated-section action buttons.
   The add buttons in the section headers and the delete buttons inside
   "ხელშეკრულების ცვლილება" / "გადახდები" rows must be physically identical. */
















/* FINAL PATCH 2026-07-06 — Sidebar pictogram badges use the same action-button geometry.
   This aligns sidebar icon containers with the program-wide 38x38 button system without
   changing the full navigation row or the native window controls. */

.sidebar-nav .nav-icon,
.sidebar-nav .nav-item .nav-icon,
.sidebar-nav .nav-item.active .nav-icon,
.sidebar-nav .nav-item:hover .nav-icon {
  box-sizing: border-box !important;
  width: var(--pactum-action-size, 38px) !important;
  min-width: var(--pactum-action-size, 38px) !important;
  max-width: var(--pactum-action-size, 38px) !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  flex: 0 0 38px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-radius: var(--pactum-button-radius, var(--pactum-radius, 16px)) !important;
  box-shadow: none !important;
  transform: none !important;
}

.sidebar-nav .nav-icon svg,
.sidebar-nav .nav-item .nav-icon svg,
.sidebar-nav .nav-item.active .nav-icon svg,
.sidebar-nav .nav-item:hover .nav-icon svg {
  width: 17px !important;
  min-width: 17px !important;
  height: 17px !important;
  min-height: 17px !important;
  stroke-width: 2.05 !important;
  flex: 0 0 auto !important;
}


/* Preserve the existing sidebar color coding while applying the unified border system. */
.nav-main-group .nav-item:nth-child(1) .nav-icon { border-color: rgba(37, 99, 235, .26) !important; }
.nav-main-group .nav-item:nth-child(2) .nav-icon { border-color: rgba(8, 145, 178, .26) !important; }
.nav-main-group .nav-item:nth-child(3) .nav-icon { border-color: rgba(22, 163, 74, .26) !important; }
.nav-main-group .nav-item:nth-child(4) .nav-icon { border-color: rgba(249, 115, 22, .26) !important; }
.nav-main-group .nav-item:nth-child(5) .nav-icon { border-color: rgba(100, 116, 139, .26) !important; }
.nav-main-group .nav-item:nth-child(6) .nav-icon { border-color: rgba(124, 58, 237, .26) !important; }
.nav-bottom-group .nav-item:nth-child(1) .nav-icon { border-color: rgba(51, 65, 85, .26) !important; }
.nav-bottom-group .nav-item:nth-child(2) .nav-icon { border-color: rgba(2, 132, 199, .26) !important; }
.nav-bottom-group .nav-item:nth-child(3) .nav-icon { border-color: rgba(220, 38, 38, .26) !important; }

.sidebar-nav .nav-item.active .nav-icon,
.sidebar-nav .nav-item:hover .nav-icon {
  border-width: 1px !important;
  box-shadow: none !important;
}

/* FINAL PATCH 2026-07-06 — Sidebar icon/label breathing space.
   The previous sidebar icon unification accidentally overrode the earlier 22px spacing with 10px.
   Keep the icon badges button-sized, but restore readable distance between pictogram and title. */


.sidebar-nav .nav-icon,
.sidebar-nav .nav-item .nav-icon {
  justify-self: start !important;
}

/* FINAL PATCH 2026-07-06 — Airy vertical dividers for lease tables and report preview.
   Experimental visual layer: uses inset hairlines so table column widths do not change. */







/* FINAL PATCH 2026-07-06 — Make vertical table dividers actually visible.
   The previous experiment used inset box-shadows, which were too weak / overridden by table header shadows.
   Use real left borders on non-first columns, with a low-contrast color so the grid remains airy. */







/* Keep the outer edge clean: no left vertical line before the first column. */


/* FINAL PATCH 2026-07-06 — Table vertical dividers matched to horizontal divider weight/color.
   The previous visible vlines used a darker slate tone. Keep them as the same 1px hairline
   as the existing horizontal row/header separator: #d8e5f2. */








/* FINAL PATCH 2026-07-06 — Vertical gridlines truly match horizontal row hairlines.
   Previous vertical-line experiments left a more-specific `th:not(:first-child)` inset box-shadow active,
   so the vertical divider was effectively rendered as border + shadow and looked thicker.
   Use one source only: a single 1px border-left in the same light color as body row separators. */







/* PATCH 2026-07-06 — card financial detail restored as collapsed audit block */
































@media (max-width: 1180px) {
  
}


/* PATCH 2026-07-06 — card financial detail scroll cleanup and N-column removal.
   Financial detail tables expand inside the card instead of creating nested inner scrollbars.
   The editor page itself remains wheel-scrollable when needed, but the outer scrollbar is visually hidden. */














@media (max-width: 1180px) {
  
}


/* FINAL PATCH 2026-07-06 — no visible scrollbars anywhere.
   Scrollable areas may still move with wheel/trackpad when content overflows, but no scrollbar track,
   thumb, gutter, hover scrollbar, or inner table scrollbar should be visible anywhere in the app. */
*,
*::before,
*::after {
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
  -ms-overflow-style: none !important;
  scrollbar-gutter: auto !important;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
html body *::-webkit-scrollbar,
html body *:hover::-webkit-scrollbar,
html body *:focus::-webkit-scrollbar,
html body *:focus-within::-webkit-scrollbar,
html body .main-shell::-webkit-scrollbar,
html body .main-shell:hover::-webkit-scrollbar,
html body .main-shell:focus-within::-webkit-scrollbar,
html body .page-section::-webkit-scrollbar,
html body .page-section.active::-webkit-scrollbar,
html body .page-section.active:hover::-webkit-scrollbar,
html body .page-section.active:focus-within::-webkit-scrollbar,
html body #reportPanel.report-builder-page.page-section.active::-webkit-scrollbar,
html body #reportPanel.report-builder-page.page-section.active:hover::-webkit-scrollbar,
html body #reportPanel.report-builder-page.page-section.active:focus-within::-webkit-scrollbar,
html body .table-wrap::-webkit-scrollbar,
html body .table-wrap:hover::-webkit-scrollbar,
html body .table-wrap:focus-within::-webkit-scrollbar,
html body #reportPanel .report-unified-field-catalog::-webkit-scrollbar,
html body #reportPanel .report-unified-field-catalog:hover::-webkit-scrollbar,
html body #reportPanel .report-unified-field-catalog:focus-within::-webkit-scrollbar,
html body #reportPanel .report-field-catalog::-webkit-scrollbar,
html body #reportPanel .report-field-catalog:hover::-webkit-scrollbar,
html body #reportPanel .report-field-catalog:focus-within::-webkit-scrollbar,
html body .sidebar-nav::-webkit-scrollbar,
html body .sidebar-nav:hover::-webkit-scrollbar,
html body .sidebar-nav:focus-within::-webkit-scrollbar,
html body .nav-main-group::-webkit-scrollbar,
html body .nav-main-group:hover::-webkit-scrollbar,
html body .nav-main-group:focus-within::-webkit-scrollbar,
html body textarea::-webkit-scrollbar,
html body textarea:hover::-webkit-scrollbar,
html body textarea:focus::-webkit-scrollbar,
html body textarea:focus-within::-webkit-scrollbar{
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  background: transparent !important;
}

html body *::-webkit-scrollbar-track,
html body *::-webkit-scrollbar-thumb,
html body *::-webkit-scrollbar-corner{
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Keep data reachable without visual scrollbars. */
html body #reportPanel .report-unified-field-catalog{
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  scrollbar-gutter: auto !important;
}

/* FINAL PATCH 2026-07-06 — strict hidden scrollbars for inner table containers.
   Previous generic scrollbar rules were beaten by older high-specificity track/thumb selectors.
   These selectors target the exact remaining table/preview wrappers and all scrollbar subparts. */
html body #reportPanel.report-builder-page .table-wrap{
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
  -ms-overflow-style: none !important;
  scrollbar-gutter: auto !important;
}



/* FINAL PATCH 2026-07-06 — hard-hide native table scrollbars.
   Native Chromium scrollbars were still visible in table wrappers. These containers now use
   overflow:hidden and renderer.js proxies wheel/trackpad movement via scrollTop/scrollLeft. */





/* FINAL PATCH 2026-07-06 — actual table page scrollbars hidden.
   The visible bar was not only the .table-wrap scrollbar; on lease pages it was often the
   active page-section scrollport. Hide page-section and wrapper native scrollbars, then JS
   drives scrollTop/scrollLeft without native tracks. */
html body #reportPanel.report-builder-page.page-section.active{
  overflow: hidden !important;
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
  -ms-overflow-style: none !important;
  scrollbar-gutter: auto !important;
  padding-right: 0 !important;
  margin-right: 0 !important;
}

html body #reportPanel.report-builder-page.page-section.active::-webkit-scrollbar,
html body #reportPanel.report-builder-page.page-section.active::-webkit-scrollbar-track,
html body #reportPanel.report-builder-page.page-section.active::-webkit-scrollbar-thumb,
html body #reportPanel.report-builder-page.page-section.active::-webkit-scrollbar-corner,
html body #reportPanel.report-builder-page.page-section.active::-webkit-scrollbar-button{
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 0 !important;
}

/* FINAL OVERRIDE 2026-07-06 — permanent invisible scrollbars everywhere.
   Scroll behavior is left intact; this only kills native scrollbar visuals, including
   hover/focus states and nested/internal table scrollports. The repeated :not() IDs
   intentionally raise specificity above older scrollbar patches in this file. */
html:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c),
body:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c),
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c),
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::before,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::after {
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
  -ms-overflow-style: none !important;
}

html:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::-webkit-scrollbar,
body:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::-webkit-scrollbar,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::-webkit-scrollbar,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c):hover::-webkit-scrollbar,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c):focus::-webkit-scrollbar,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c):focus-within::-webkit-scrollbar,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::-webkit-scrollbar-track,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c):hover::-webkit-scrollbar-track,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c):focus-within::-webkit-scrollbar-track,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::-webkit-scrollbar-thumb,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c):hover::-webkit-scrollbar-thumb,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c):focus-within::-webkit-scrollbar-thumb,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::-webkit-scrollbar-thumb:hover,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c):hover::-webkit-scrollbar-thumb:hover,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::-webkit-scrollbar-corner,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::-webkit-scrollbar-button,
*:not(#pactum-no-scrollbar-a):not(#pactum-no-scrollbar-b):not(#pactum-no-scrollbar-c)::-webkit-resizer{
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 0 !important;
}


/* PATCH 2026-07-06 — restore table-card right breathing room after native scrollbars were made invisible.
   Scrollbars remain hidden; this only recreates the visual right-side breathing gap on table pages. */




/* FINAL PATCH 2026-07-06 — exact card-width right gap for table/report pages after hidden scrollbars.
   Match #editorPanel new-card content rhythm: 16px right padding, no visible/native scrollbar gutter. */
html body #reportPanel.report-builder-page.page-section.active:not(#pactum-card-gap-a):not(#pactum-card-gap-b):not(#pactum-card-gap-c){
  padding-right: 16px !important;
  scrollbar-gutter: auto !important;
}



/* FINAL PATCH 2026-07-06 — clean home dashboard with restrained color accents. */



































































































@media (max-width: 1180px) {
  
  
  
  
}

@media (max-width: 760px) {
  
  
  
  
}


/* FINAL PATCH 2026-07-06 — statistics page aligned with About header, real data bars, hidden scrollbars. */






































































/* No visible scrollbar anywhere: page scroll and nested dashboard/report/table scrolls stay functional. */
:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  #statsPanel.dashboard-page.page-section.active,
  #statsPanel .dashboard-bars,
  #statsPanel .dashboard-status-bars,
  #statsPanel .dashboard-risk-list,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
),
:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  #statsPanel.dashboard-page.page-section.active,
  #statsPanel .dashboard-bars,
  #statsPanel .dashboard-status-bars,
  #statsPanel .dashboard-risk-list,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover,
:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  #statsPanel.dashboard-page.page-section.active,
  #statsPanel .dashboard-bars,
  #statsPanel .dashboard-status-bars,
  #statsPanel .dashboard-risk-list,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within {
  scrollbar-gutter: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  #statsPanel.dashboard-page.page-section.active,
  #statsPanel .dashboard-bars,
  #statsPanel .dashboard-status-bars,
  #statsPanel .dashboard-risk-list,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
)::-webkit-scrollbar,
:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  #statsPanel.dashboard-page.page-section.active,
  #statsPanel .dashboard-bars,
  #statsPanel .dashboard-status-bars,
  #statsPanel .dashboard-risk-list,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):hover::-webkit-scrollbar,
:where(
  body,
  .main-shell,
  .page-section,
  .page-section.active,
  #statsPanel.dashboard-page.page-section.active,
  #statsPanel .dashboard-bars,
  #statsPanel .dashboard-status-bars,
  #statsPanel .dashboard-risk-list,
  .form-panel,
  #editorPanel.form-panel.page-section.active,
  #reportPanel.report-builder-page.page-section.active,
  #settingsPanel.page-section.active,
  #aboutPanel.page-section.active,
  .table-wrap,
  .lease-table-wrap,
  .report-builder-table-wrap,
  .report-field-catalog,
  .report-selected-columns,
  .reference-list,
  .cards-list,
  .sidebar-nav,
  .nav-main-group,
  .chip-list,
  textarea
):focus-within::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

@media (max-width: 1180px) {
  
  
  
}

@media (max-width: 760px) {
  
  
  
  
  
  
}

/* FINAL PATCH 2026-07-06 — home statistics layout: no summary strip, no finance/risk blocks, consistent cards. */












































@media (max-width: 1180px) {
  
  
}

@media (max-width: 760px) {
  
}

/* FINAL PATCH 2026-07-06 — home dashboard common frame, card-level status counts, performer block, compact date. */



























































@media (max-width: 1180px) {
  
  
}

@media (max-width: 760px) {
  
  
}

/* FINAL PATCH 2026-07-06 — enlarge Home/About headers and separate home dashboard blocks. */












@media (max-width: 760px) {
  
}

/* FINAL PATCH 2026-07-06 — align Home and About horizontal page margins with the New Card frame. */


/* Keep the same left/right border line as New Card: header/card edges sit on the page frame edge,
   while their own internal text spacing remains controlled by their padding. */


@media (max-width: 760px) {
  
}

/* FINAL PATCH 2026-07-06 — align Home/About header title start with New Card title. */




@media (max-width: 760px) {
  
}

/* FINAL PATCH 2026-07-06 — align Home/About top offset with New Card. */


/* Keep the content frame flush at the top like #editorPanel while preserving bottom breathing room. */






@media (max-width: 760px) {
  
}

/* FINAL PATCH 2026-07-06 — Home header-to-content gap matches New Card section spacing. */








@media (max-width: 760px) {
  
  
}

/* FINAL PATCH 2026-07-06 — Home dashboard: all inter-block spacing matches New Card section gap. */


/* Header → statistics frame */


/* Statistics frame → lower dashboard panels */


/* Gaps between the lower dashboard blocks themselves */


@media (max-width: 760px) {
  
  
  
}

/* FINAL PATCH 2026-07-06 — Home right edge exactly matches New Card frame.
   Earlier high-specificity :not(...) rule kept padding-right:16px alive, so the
   left edge aligned but the right edge stayed inset. This override matches that
   specificity and removes the extra right-side inset only on Home. */




/* FINAL PATCH 2026-07-06 — Home fits in viewport; performer list scrolls internally with hidden scrollbar. */






































@media (max-width: 1180px) {
  

  

  
}

@media (max-width: 760px) {
  

  
}

/* FINAL PATCH 2026-07-06 — Home lower panels capped to five visible rows. */








@media (max-height: 820px) {
  

  

  
}

/* FINAL PATCH 2026-07-06 — Home interactive yearly contract chart under lower blocks. */




































































@media (max-height: 940px) {
  
}

@media (max-height: 820px) {
  

  
}


/* FINAL PATCH 2026-07-06 — cleaner professional Home yearly chart, balanced card layout, exact requested colors. */







































































































@media (max-height: 980px) {
  
}

@media (max-height: 880px) {
  

  

  

  

  
}

@media (max-width: 1180px) {
  
  
}

/* FINAL PATCH 2026-07-06 — align sidebar logo with page header title line. */



@media (max-height: 840px) {
  html body .sidebar {
    padding-top: 38px !important;
  }
}

/* FINAL PATCH 2026-07-06 — Home chart municipality side panel, cleaner lines, compact viewport fit. */













































































































@media (max-height: 920px) {
  

  
}

@media (max-height: 840px) {
  

  

  

  

  

  
}

@media (max-width: 1280px) {
  

  
}

/* FINAL PATCH 2026-07-06 — Home spacing readjustment, municipality width, clean date, soft modern gradients. */


/* Header date: no chip/frame, just clean text inside the header. */






/* Use the free vertical space again: no vertical clipping in top KPI cards. */










/* Lower panels: slightly taller rows, no text clipping, hidden internal scrollbars. */














/* Chart area: right municipality block equals one lower dashboard column, i.e. same visual width as Performers. */




























/* Soft modern gradient: sidebar + page headers, subtle enough to stay inside the current Pactum visual system. */









/* FINAL PATCH 2026-07-06 — balanced Home viewport, no clipped rows, singular labels, clean date. */














































































@media (max-height: 900px) {
  
  
  
  
  
}

/* FINAL PATCH 2026-07-07 — keep portfolio status colors aligned with the chart. */












@media (max-width: 1360px) {
  
  
}

/* FINAL PATCH 2026-07-06 — flat page headers, 5-row lower blocks, horizontally growing chart. */






























@media (max-height: 900px) {
  
  
}


/* FINAL PATCH 2026-07-06 — municipality header cleanup, centered full-width chart, robust calendar picker hit area. */
















/* FINAL PATCH 2026-07-06 — Home vertical redistribution: smaller top cards, taller middle blocks, larger chart. */






























@media (max-height: 900px) {
  
  
  
  
  
  
  
}

/* FINAL PATCH 2026-07-06 — Municipality dashboard block: real field mapping + unclipped compact rows. */






















@media (max-height: 900px) {
  
}

/* FINAL PATCH 2026-07-06 — exact per-year hover zones for the dashboard chart. */




/* FINAL PATCH 2026-07-06 — middle dashboard blocks use municipality-style rows; smaller top cards, larger chart. */






































@media (max-height: 900px) {
  
  
  
  
  
}

/* FINAL PATCH 2026-07-07 — refined home chart only, final override position. */
















































@media (max-width: 1280px) {
  
}

/* FINAL PATCH 2026-07-07 — chart side controls, proportional SVG. */






























@media (max-width: 1280px) {
  

  
}

/* FINAL PATCH 2026-07-07 — equal chart legend tiles. */






























@media (max-width: 1280px) {
  

  

  
}

/* FINAL PATCH 2026-07-07 — opening due-notification popup. */


















































@media (max-width: 720px) {
  

  
  
  
  
}

/* FINAL PATCH 2026-07-07 — equal legend cards, no mode label, non-bold tile text. */










@media (max-width: 1280px) {
  

  
}

/* FINAL PATCH 2026-07-07 — vertical-centre chart legend controls. */








/* FINAL PATCH 2026-07-07 — prevent Georgian glyph clipping in chart legend buttons. */






/* PATCH 2026-07-07 — Home global calculation date input. */













/* FINAL PATCH 2026-07-07 — Home header date control mirrors card header date control exactly. */




















/* FINAL PATCH 2026-07-07 — Home calculation date: exact visual parity with card header. */






















/* FINAL PATCH 2026-07-07 — dashboard KPI cleanup, taller chart, manual reminder popup, centered popup table. */






































@media (max-height: 900px) {
  

  

  
}

/* FINAL PATCH 2026-07-07 — requested dashboard labels/colors and due popup button/table refinements. */































/* FINAL PATCH 2026-07-07 — due popup: remove bottom close action, keep only summary footer. */




/* FINAL PATCH 2026-07-07 — active reminder bell true-yellow ringing state. */







/* FINAL PATCH 2026-07-07 — reminder bell: design-consistent amber, hover-only ring. */









/* FINAL PATCH 2026-07-07 — hover-only micro-animations for a lighter UI feel.
   No permanent animation is added; movement happens only on hover/focus-visible. */
@media (prefers-reduced-motion: no-preference) {
  .sidebar-nav .nav-item,
.sidebar-nav .nav-icon,
.sidebar-nav .nav-icon svg,
main .page-section button,
main .page-section button svg,
.window-controls button,
.window-controls button svg{
    transition:
      transform .18s cubic-bezier(.2, .8, .2, 1),
      border-color .18s ease,
      background-color .18s ease,
      box-shadow .18s ease,
      color .18s ease,
      filter .18s ease !important;
  }

  /* Sidebar: subtle lift/slide of pictograms only; text and layout stay stable. */
  .sidebar-nav .nav-item:hover .nav-icon,
  .sidebar-nav .nav-item:focus-visible .nav-icon {
    transform: translateX(2px) scale(1.035) !important;
    filter: saturate(1.05) !important;
  }

  .sidebar-nav .nav-item:hover .nav-icon svg,
  .sidebar-nav .nav-item:focus-visible .nav-icon svg {
    transform: rotate(-2deg) scale(1.03) !important;
  }

  .sidebar-nav .nav-item[data-page="new"]:hover .nav-icon svg,
  .sidebar-nav .nav-item[data-page="new"]:focus-visible .nav-icon svg,
  main .add-action:hover svg,
  main .add-action:focus-visible svg,
  main .secondary-btn.icon-only.add-action:hover svg,
  main .secondary-btn.icon-only.add-action:focus-visible svg,
  main .secondary-btn.small.icon-only.add-action:hover svg,
  main .secondary-btn.small.icon-only.add-action:focus-visible svg {
    transform: rotate(90deg) scale(1.04) !important;
  }

  .sidebar-nav .nav-item[data-page="settings"]:hover .nav-icon svg,
  .sidebar-nav .nav-item[data-page="settings"]:focus-visible .nav-icon svg {
    transform: rotate(34deg) scale(1.03) !important;
  }

  .sidebar-nav .nav-exit:hover .nav-icon svg,
  .sidebar-nav .nav-exit:focus-visible .nav-icon svg {
    transform: translateX(2px) scale(1.03) !important;
  }

  /* Common action buttons: the button box does not move; the icon gives feedback. */
  main .save-action:hover svg,
  main .save-action:focus-visible svg {
    transform: translateY(-1px) scale(1.045) !important;
  }

  main .delete-action:hover svg,
main .delete-action:focus-visible svg,
main .row-icon-action.delete-action:hover svg,
main .row-icon-action.delete-action:focus-visible svg{
    transform: rotate(-8deg) scale(1.035) !important;
  }

  main .report-excel-action:hover svg,
  main .report-excel-action:focus-visible svg {
    transform: translateY(2px) scale(1.03) !important;
  }

  

  .window-controls .close:hover svg,
.window-controls .close:focus-visible svg{
    transform: rotate(90deg) scale(1.04) !important;
  }

  .window-controls button:not(.close):hover svg,
  .window-controls button:not(.close):focus-visible svg {
    transform: scale(1.06) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sidebar-nav .nav-item,
.sidebar-nav .nav-icon,
.sidebar-nav .nav-icon svg,
main .page-section button,
main .page-section button svg,
.window-controls button,
.window-controls button svg{
    transition: none !important;
    animation: none !important;
  }
}


/* Popup day column: show numeric days only with semantic color. */






/* FINAL PATCH 2026-07-07 — unified low-poly workspace, transparent headers, blurred sticky table heads. */
:root {
  --pactum-lowpoly-base: #f6f9fd;
  --pactum-lowpoly-panel: rgba(255, 255, 255, .88);
  --pactum-glass-line: rgba(191, 215, 238, .42);
  --pactum-table-blur: blur(15px) saturate(1.08);
}

html body {
  background: var(--pactum-lowpoly-base) !important;
}

html body::before {
  content: "" !important;
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -2 !important;
  pointer-events: none !important;
  opacity: .78 !important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1800 1100' preserveAspectRatio='none'%3E%3Crect width='1800' height='1100' fill='%23f6f9fd'/%3E%3Cpolygon points='0,0 360,0 210,185 0,260' fill='%23dff4ff' opacity='.75'/%3E%3Cpolygon points='360,0 760,0 560,210 210,185' fill='%23ecf8ff' opacity='.92'/%3E%3Cpolygon points='760,0 1170,0 920,225 560,210' fill='%23dbeafe' opacity='.52'/%3E%3Cpolygon points='1170,0 1800,0 1800,250 920,225' fill='%23e0f2fe' opacity='.66'/%3E%3Cpolygon points='0,260 210,185 390,420 0,510' fill='%23eaf7ff' opacity='.82'/%3E%3Cpolygon points='210,185 560,210 390,420' fill='%23f8fbff' opacity='.92'/%3E%3Cpolygon points='560,210 920,225 720,510 390,420' fill='%23eff8ff' opacity='.86'/%3E%3Cpolygon points='920,225 1350,330 1040,600 720,510' fill='%23dff5ff' opacity='.58'/%3E%3Cpolygon points='1350,330 1800,250 1800,600 1040,600' fill='%23eef7ff' opacity='.78'/%3E%3Cpolygon points='0,510 390,420 260,760 0,870' fill='%23f8fbff' opacity='.9'/%3E%3Cpolygon points='390,420 720,510 570,820 260,760' fill='%23e0f2fe' opacity='.44'/%3E%3Cpolygon points='720,510 1040,600 860,900 570,820' fill='%23f5fbff' opacity='.94'/%3E%3Cpolygon points='1040,600 1800,600 1800,950 860,900' fill='%23e5f6ff' opacity='.62'/%3E%3Cpolygon points='0,870 260,760 520,1100 0,1100' fill='%23edf8ff' opacity='.82'/%3E%3Cpolygon points='260,760 570,820 520,1100' fill='%23f8fbff' opacity='.86'/%3E%3Cpolygon points='570,820 860,900 820,1100 520,1100' fill='%23e7f7ff' opacity='.72'/%3E%3Cpolygon points='860,900 1800,950 1800,1100 820,1100' fill='%23f7fbff' opacity='.88'/%3E%3Cpath d='M0 260 L210 185 L560 210 L920 225 L1350 330 L1800 250 M0 510 L390 420 L720 510 L1040 600 L1800 600 M0 870 L260 760 L570 820 L860 900 L1800 950' fill='none' stroke='%2390c8e8' stroke-opacity='.18' stroke-width='1.1'/%3E%3C/svg%3E") center/cover no-repeat !important;
}

html body::after {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 9% 16%, rgba(14, 165, 233, .060), transparent 28%),
    radial-gradient(circle at 92% 10%, rgba(125, 211, 252, .070), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.40), rgba(248,251,255,.22)) !important;
}

html body .app-frame,
html body .main-shell,
html body .sidebar {
  background: transparent !important;
}

html body .main-shell {
  position: relative !important;
}


html body .sidebar::before,
html body .sidebar::after {
  display: none !important;
  content: none !important;
}




/* Keep content readable while letting the shared low-poly background breathe through the workspace. */
html body .panel,
html body .report-builder-card,
html body .about-info-card,
html body .form-section{
  background: var(--pactum-lowpoly-panel) !important;
  backdrop-filter: blur(6px) saturate(1.03) !important;
  -webkit-backdrop-filter: blur(6px) saturate(1.03) !important;
}

/* All page/card/list/report headers: no frame and no filled header slab. */



html body .report-builder-page{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Sticky table heads: transparent blur layer. Rounded corners stay clipped by the table frame. */
html body .table-wrap{
  border-radius: 18px !important;
  overflow: auto !important;
  background: rgba(255, 255, 255, .72) !important;
  border-color: var(--pactum-glass-line) !important;
  isolation: isolate !important;
  background-clip: padding-box !important;
  clip-path: inset(0 round 18px) !important;
}

html body table thead,
html body table thead tr {
  background: transparent !important;
}

html body table thead th{
  background: rgba(248, 251, 255, .52) !important;
  backdrop-filter: var(--pactum-table-blur) !important;
  -webkit-backdrop-filter: var(--pactum-table-blur) !important;
  border-top: 0 !important;
  border-bottom: 1px solid rgba(191, 215, 238, .54) !important;
  box-shadow: 0 1px 0 rgba(191, 215, 238, .35) !important;
  background-clip: padding-box !important;
}

html body table thead th:first-child{
  border-top-left-radius: 17px !important;
}

html body table thead th:last-child{
  border-top-right-radius: 17px !important;
}









/* Header controls remain visible without rebuilding a new header frame. */
html body .report-source-select{
  background: rgba(255, 255, 255, .76) !important;
  backdrop-filter: blur(8px) saturate(1.04) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.04) !important;
}


/* FINAL SAFETY PATCH 2026-07-07 — put low-poly directly on body so it renders under both sidebar and content. */
html body {
  position: relative !important;
  isolation: isolate !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.42), rgba(248,251,255,.18)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1800 1100' preserveAspectRatio='none'%3E%3Crect width='1800' height='1100' fill='%23f6f9fd'/%3E%3Cpolygon points='0,0 360,0 210,185 0,260' fill='%23dff4ff' opacity='.75'/%3E%3Cpolygon points='360,0 760,0 560,210 210,185' fill='%23ecf8ff' opacity='.92'/%3E%3Cpolygon points='760,0 1170,0 920,225 560,210' fill='%23dbeafe' opacity='.52'/%3E%3Cpolygon points='1170,0 1800,0 1800,250 920,225' fill='%23e0f2fe' opacity='.66'/%3E%3Cpolygon points='0,260 210,185 390,420 0,510' fill='%23eaf7ff' opacity='.82'/%3E%3Cpolygon points='210,185 560,210 390,420' fill='%23f8fbff' opacity='.92'/%3E%3Cpolygon points='560,210 920,225 720,510 390,420' fill='%23eff8ff' opacity='.86'/%3E%3Cpolygon points='920,225 1350,330 1040,600 720,510' fill='%23dff5ff' opacity='.58'/%3E%3Cpolygon points='1350,330 1800,250 1800,600 1040,600' fill='%23eef7ff' opacity='.78'/%3E%3Cpolygon points='0,510 390,420 260,760 0,870' fill='%23f8fbff' opacity='.9'/%3E%3Cpolygon points='390,420 720,510 570,820 260,760' fill='%23e0f2fe' opacity='.44'/%3E%3Cpolygon points='720,510 1040,600 860,900 570,820' fill='%23f5fbff' opacity='.94'/%3E%3Cpolygon points='1040,600 1800,600 1800,950 860,900' fill='%23e5f6ff' opacity='.62'/%3E%3Cpolygon points='0,870 260,760 520,1100 0,1100' fill='%23edf8ff' opacity='.82'/%3E%3Cpolygon points='260,760 570,820 520,1100' fill='%23f8fbff' opacity='.86'/%3E%3Cpolygon points='570,820 860,900 820,1100 520,1100' fill='%23e7f7ff' opacity='.72'/%3E%3Cpolygon points='860,900 1800,950 1800,1100 820,1100' fill='%23f7fbff' opacity='.88'/%3E%3Cpath d='M0 260 L210 185 L560 210 L920 225 L1350 330 L1800 250 M0 510 L390 420 L720 510 L1040 600 L1800 600 M0 870 L260 760 L570 820 L860 900 L1800 950' fill='none' stroke='%2390c8e8' stroke-opacity='.18' stroke-width='1.1'/%3E%3C/svg%3E") center/cover fixed no-repeat,
    #f6f9fd !important;
}

/* FINAL PATCH 2026-07-07 — strict transparent headers only. Keep the rest of the low-poly/table-blur UI unchanged. */


/* FINAL CORRECTION 2026-07-07 — exact transparent headers with ID-level specificity.
   Earlier #statsPanel/#aboutPanel rules used ID selectors with !important, so the generic
   transparent-header patch could not override them. This patch targets the real header
   containers directly and removes their fill, border, shadow and backdrop glass. */




/* ABSOLUTE FINAL FIX 2026-07-07 — visual header transparency on every page.
   The previous patch made the header nodes transparent, but some page-level panels still
   painted a white surface behind them. This clears only the page header slab/background
   so the low-poly workspace is visible behind headers, while table/card/content bodies keep
   their existing surfaces. */
html body :is(
  #statsPanel,
  #dataPanel,
  #terminatedPanel,
  #archivePanel,
  #editorPanel,
  #reportPanel,
  #settingsPanel,
  #aboutPanel
).page-section,
html body :is(
  #statsPanel,
  #dataPanel,
  #terminatedPanel,
  #archivePanel,
  #editorPanel,
  #reportPanel,
  #settingsPanel,
  #aboutPanel
).page-section.active,
html body #reportPanel.report-builder-page.page-section.active{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}



/* Preserve readable content surfaces after clearing page/header slabs. */
html body #reportPanel .report-builder-card{
  background-color: var(--pactum-lowpoly-panel, rgba(255, 255, 255, .88)) !important;
}

/* SETTINGS PAGE TRANSPARENT BLOCK SURFACES — keep only structure/readability controls. */




/* SETTINGS PAGE BORDERLESS BLOCKS — make Settings blocks fully transparent, including frames. */




/* FINAL SETTINGS PATCH 2026-07-08 — restore Settings block frames, keep surfaces clear, and make Settings fields transparent. */








/* FINAL SETTINGS PATCH 2026-07-08 — make every Settings field surface transparent, including populated reference rows. */








/* FINAL SETTINGS PATCH 2026-07-08 — align Settings page title with the first settings card title inset. */




/* FINAL ABOUT PATCH 2026-07-08 — About page blocks transparent, page inset matched to Settings. */














@media (max-width: 760px) {
  

  
}

/* FINAL ABOUT + REPORT LAYOUT PATCH 2026-07-08 — match Settings title/block rhythm and carry About visual rules to Report. */






html body #reportPanel.report-builder-page.page-section.active {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  height: calc(100vh - 88px) !important;
  max-height: calc(100vh - 88px) !important;
  padding: 0 16px 16px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}









html body #reportPanel :is(
  .report-builder-card,
  .report-unified-field-card,
  .report-field-card,
  .report-preview-card
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}


html body #reportPanel :is(.report-builder-section-title, .report-preview-title-only) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

@media (max-width: 760px) {
  html body #reportPanel.report-builder-page.page-section.active{
    padding: 0 16px 16px !important;
  }

  
}

/* FINAL ABOUT + REPORT FIELD TRANSPARENCY PATCH 2026-07-08
   - About: match Settings block-to-block rhythm.
   - Report: make every field/control/preview surface transparent, including populated states. */






html body #reportPanel :is(
  input,
  select,
  textarea,
  button.report-field-chip,
  .report-source-select,
  .report-toolbar,
  .report-builder-card,
  .report-unified-field-card,
  .report-field-card,
  .report-preview-card,
  .report-field-catalog,
  .report-builder-table-wrap,
  .report-builder-table,
  .report-builder-table thead,
  .report-builder-table tbody,
  .report-builder-table tr,
  .report-builder-table th,
  .report-builder-table td,
  .report-note,
  .empty,
  .empty.compact
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body #reportPanel :is(
  input,
  select,
  textarea,
  button.report-field-chip,
  .report-source-select,
  .report-field-catalog,
  .report-builder-table-wrap,
  .report-builder-table th,
  .report-builder-table td,
  .report-note,
  .empty,
  .empty.compact
):is(:hover, :focus, :focus-visible, :active, .selected, .active){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}


html body #reportPanel .report-source-select {
  color: var(--ink, #0f172a) !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html body #reportPanel .report-source-select option {
  background-color: #ffffff !important;
  color: var(--ink, #0f172a) !important;
}

html body #reportPanel :is(input, select, textarea, .report-source-select):focus,
html body #reportPanel :is(input, select, textarea, .report-source-select):focus-visible {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: 0 0 0 4px rgba(14, 165, 233, .12) !important;
}

html body #reportPanel input:-webkit-autofill,
html body #reportPanel input:-webkit-autofill:hover,
html body #reportPanel input:-webkit-autofill:focus,
html body #reportPanel textarea:-webkit-autofill,
html body #reportPanel textarea:-webkit-autofill:hover,
html body #reportPanel textarea:-webkit-autofill:focus,
html body #reportPanel select:-webkit-autofill,
html body #reportPanel select:-webkit-autofill:hover,
html body #reportPanel select:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--ink, #0f172a) !important;
  caret-color: var(--ink, #0f172a) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0) inset !important;
  -webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0) inset !important;
  transition: background-color 999999s ease-out 0s !important;
}

/* FINAL PATCH 2026-07-08 — Report inner fields + Home dashboard surfaces transparent.
   Scope: visual CSS only. Keeps borders, spacing, low-poly background and JS logic intact. */

/* Report: the previously untouched inner rows/controls in the field block. */
html body #reportPanel :is(
  .report-unified-list,
  .report-unified-field-catalog,
  .report-field-catalog,
  .report-unified-row,
  .report-unified-row.is-active,
  .report-unified-row.is-inactive,
  .report-unified-row.dragging,
  .report-unified-row.drag-over,
  .report-drag-handle,
  .report-drag-placeholder,
  .report-field-static-title,
  .report-field-title-input,
  .report-state-toggle,
  .report-state-toggle.is-active,
  .report-state-toggle.is-inactive,
  .report-field-chip,
  .report-field-chip.selected,
  .report-selected-row,
  .report-selected-main,
  .report-selected-main input,
  .report-selected-index,
  .report-selected-actions,
  .report-selected-actions button,
  .report-preview-card,
  .report-preview-title-only,
  .report-builder-table-wrap,
  .report-builder-table,
  .report-builder-table thead,
  .report-builder-table tbody,
  .report-builder-table tr,
  .report-builder-table th,
  .report-builder-table td,
  .report-builder-table td.empty
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body #reportPanel :is(
  .report-unified-row,
  .report-unified-row.is-active,
  .report-unified-row.is-inactive,
  .report-drag-handle,
  .report-field-title-input,
  .report-state-toggle,
  .report-state-toggle.is-active,
  .report-state-toggle.is-inactive,
  .report-field-chip,
  .report-field-chip.selected,
  .report-selected-row,
  .report-selected-main input,
  .report-selected-actions button,
  .report-builder-table th,
  .report-builder-table td
):is(:hover, :focus, :focus-visible, :active, .selected, .active, .drag-over) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}


html body #reportPanel .report-unified-row.is-active {
  border-color: rgba(134, 239, 172, .95) !important;
}

html body #reportPanel .report-unified-row.is-inactive {
  border-color: rgba(207, 221, 234, .95) !important;
}


html body #reportPanel .report-state-toggle.is-inactive {
  color: #2563eb !important;
}

/* Home: apply the same transparent-surface direction to dashboard blocks and their inner fields. */






/* Keep semantic accents visible even though the card/field fills are transparent. */












/* FINAL PATCH 2026-07-08 — About spacing, sidebar icon clear backgrounds, Home page Settings rhythm.
   Scope: CSS-only visual correction. JS/data logic untouched. */

/* 1) About page: use the same page inset and block rhythm as Settings. */








/* Header -> first block has the same zero extra gap as Settings; blocks themselves use Settings' 14px rhythm. */








/* 2) Sidebar pictogram boxes: keep pictogram colors, remove only icon-box fills. */
html body :is(.sidebar, .sidebar-nav, .nav-main-group, .nav-bottom-group) .nav-item .nav-icon,
html body :is(.sidebar, .sidebar-nav, .nav-main-group, .nav-bottom-group) .nav-item:hover .nav-icon,
html body :is(.sidebar, .sidebar-nav, .nav-main-group, .nav-bottom-group) .nav-item.active .nav-icon,
html body .nav-main-group .nav-item.active .nav-icon,
html body .nav-bottom-group .nav-item.active .nav-icon,
html body .nav-main-group .nav-item:nth-child(1) .nav-icon,
html body .nav-main-group .nav-item:nth-child(2) .nav-icon,
html body .nav-main-group .nav-item:nth-child(3) .nav-icon,
html body .nav-main-group .nav-item:nth-child(4) .nav-icon,
html body .nav-main-group .nav-item:nth-child(5) .nav-icon,
html body .nav-main-group .nav-item:nth-child(6) .nav-icon,
html body .nav-main-group .nav-item:nth-child(7) .nav-icon,
html body .nav-bottom-group .nav-item:nth-child(1) .nav-icon,
html body .nav-bottom-group .nav-item:nth-child(2) .nav-icon,
html body .nav-bottom-group .nav-item:nth-child(3) .nav-icon {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body .sidebar .nav-icon::before,
html body .sidebar .nav-icon::after {
  display: none !important;
  content: none !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* 3) Home page: same outer inset and header/block rhythm as Settings. */
















/* Keep functional/semantic accents visible after clearing the field fills. */








@media (max-width: 760px) {
  

  
}

/* FINAL PATCH 2026-07-08 — Home dashboard transparent fields, Settings rhythm and neutral balance borders.
   Scope: CSS-only. Keeps data/JS untouched. */

/* Home page must use the same outer inset, title inset, header-to-block gap and block rhythm as Settings. */












/* Rent balance / penalty balance cards: keep the normal card frame, not red/rose warning frames. */


/* Home page: every visible field/control surface stays transparent. Frames and semantic bars remain readable. */




/* The three requested Home blocks: Status, Distribution, Performer — all inner rows are transparent. */


/* Graph: remove remaining white/gradient surfaces, including stopped/completed fields. */






/* Keep the functional left accents/bar colors after making fields transparent. */






@media (max-width: 760px) {
  

  
}


/* FINAL PATCH 2026-07-08 — Home spacing parity with Settings, no auto reminder popup, low-poly popup and transparent notification rows.
   Scope: CSS-only except renderer boot no longer opens reminder popup automatically. */


/* Home page: match Settings horizontal inset and vertical rhythm exactly. */


/* Header title/control row: same side inset model as Settings: page provides 16px, header itself adds 0px horizontally. */




/* Dashboard blocks: 14px block rhythm like Settings. */




/* The four second-row cards: keep all sides of the frame visible, including the lower border. */




/* Preserve the same rhythm on lower-height displays without clipping the 4 middle card frames. */
@media (max-height: 900px) {
  

  

  
}

@media (max-width: 760px) {
  

  
}

/* Reminder popup: use the same low-poly family as the workspace. */








/* Popup records: no filled slabs and no row frames. */












/* FINAL PATCH 2026-07-08 — Home spacing parity pass + popup table header frame removal.
   Reference layout: Settings page uses 16px page inset, 76px transparent header, 14px block rhythm. */


/* Home header: align the title/control content with Settings card inner text, while block borders stay on the 16px page edge. */




/* Home blocks: same outer inset and same 14px vertical rhythm as Settings. Heights are reduced slightly to keep every frame visible. */










/* Keep compact displays from clipping the second row; reduce block heights before shrinking gaps. */
@media (max-height: 900px) {
  

  

  
}

@media (max-width: 760px) {
  
}

/* Reminder popup table header: keep sticky/blur, remove its visible frame/border completely. */




/* FINAL FIX 2026-07-08 — Home page spacing reset using the exact Settings page rhythm.
   This pass removes the previous mixed margin/flex-basis system and uses one gap/inset source. */


/* Same header geometry as Settings: page inset 16px + header inner inset 16px. */






/* Direct dashboard blocks: no extra margins. The parent gap is the single 14px spacing source. */












@media (max-height: 900px) {
  

  
}

/* FINAL FIX 2026-07-08 — Popup table header border fragments: remove every table-head frame layer. */








/* FINAL HOME SPACING PARITY 2026-07-08 - match the Settings page inset and block rhythm exactly. */


























/* FINAL TABLE PAGE SPACING PARITY 2026-07-08 - match Home/Settings spacing on Active, Terminated and Archive. */


















/* FINAL CARD PAGE SPACING PARITY 2026-07-08 - match Home/Settings spacing and keep only low-poly surfaces. */




























/* FINAL SCROLL HEADER MASKS 2026-07-08 - keep sticky headers crisp while rows move underneath. */








/* FINAL CARD PAGE FIT + STICKY TITLE 2026-07-08 - compact empty cards and freeze the title bar. */




































/* FINAL LIST TABLE LINE + CORNER + NATIVE SCROLL PATCH 2026-07-08
   Scope: Active / Terminated / Archive list pages only. */


















/* FINAL PATCH 2026-07-08 — lease pages: frozen table header + visible rounded top frame
   Scope: Active / Terminated / Archive list pages only. */


























@media (max-width: 980px) {
  

  
}

/* PATCH 2026-07-08 — direct overwrite: sharp visible top corners + frozen table header
   Scope: active / terminated / archive list tables only.
   Method: the scroll frame draws the border as a 1px background gutter, so header-cell
   backgrounds can no longer cover/eat the rounded top corners. */


























@media (max-width: 980px) {
  

  
}

/* FINAL PATCH 2026-07-08 — clean single-line frame for Active / Terminated / Archive tables
   Fix: previous frame styling stacked multiple rounded layers, pseudo-border and header radii.
   Result: one thin outer frame, clipped corners, no doubled/dirty rounded edges. */























/* FINAL PATCH 2026-07-08 v2 — sharper clean corners for Active / Terminated / Archive tables
   Keeps the frame at exactly 1px. No pseudo-elements, no outlines, no inset shadows, no manual border drawing. */















/* FINAL PATCH 2026-07-08 v3 — screenshot-matched clean rounded table corners
   Scope: Active / Terminated / Archive list tables only.
   Constraint: real 1px CSS border only; no pseudo-border, outline, inset shadow, or manual drawing. */















/* PATCH 2026-07-08 — new-card sticky header uses the same low-poly visual language as the app background.
   Scope: New Card / editor header only. No pseudo-elements, no manual border drawing. */



/* PATCH 2026-07-08 — editor header border transparent + page-matched low-poly background.
   Scope: New Card / editor header only. Uses the same base gradient and low-poly geometry as the app page background.
   No pseudo-elements, no manual border drawing. */



/* FINAL PATCH 2026-07-08 v4 — editor header/frame fully transparent and calc date field transparent.
   Scope: New Card / editor header only. No pseudo-border, outline, inset shadow, or manual line drawing. */















/* FINAL PATCH 2026-07-08 v6 — New Card: sticky header stays visually unchanged; form content scrolls in its own clipped body below it.
   Reason: if the sticky header is truly transparent, content scrolling behind it will always show through.
   Fix: keep the header outside the scrollable area and clip scrolling to .editor-scroll-body.
   Scope: #editorPanel only. No pseudo-border, no manual line drawing, no data/JS logic changes. */





















/* FINAL PATCH 2026-07-08 v7 — Active / Terminated / Archive tables: transparent fixed table head + body-only scroll clipping.
   The table frame remains a real 1px CSS border. No pseudo-border, outline, inset shadow, or manual line drawing. */







































@media (max-width: 980px) {
  

  
}

/* FINAL PATCH 2026-07-08 v8 — HARD override for lease table pages.
   Root cause fixed: the page/table wrapper was still the scroll context in parts of the cascade.
   This makes only tbody scroll, so rows are clipped below the table head instead of passing under it.
   The frame is still a real 1px CSS border; no pseudo-border, outline, inset shadow, or manual line drawing. */









































@media (max-width: 980px) {
  

  
}

/* FINAL PATCH 2026-07-08 — card finance/detail blocks: flattened frames + body-only detail-table scroll.
   Scope: New Card financial state and detail tables only.
   Keeps each visible block to a single real 1px CSS border; no pseudo-borders, outlines, inset shadows, or manual line drawing. */




































































/* Detail table widths: override older generic .compact-table column rules inside the financial block only. */




















@media (max-width: 1320px) {
  
}

@media (max-width: 980px) {
  
  
}

@media (max-width: 720px) {
  
}

/* FINAL PATCH 2026-07-08 — detail table scrollbar visibility override inside financial tbody only. */





/* FINAL PATCH 2026-07-08 — finance/detail centering + non-collapsible empty-state cleanup. */
:root {
  --pactum-finance-payments-body-h: 180px;
}





















@media (max-width: 720px) {
  
  
}

/* FINAL PATCH 2026-07-08 — new-card empty finance state + equal detail-table vertical sizing.
   Scope: card accounting/detail only. Keeps real 1px borders and existing transparent/sticky table model. */












/* FINAL PATCH 2026-07-08 — notes block frame, auto-growing note field, and compact cadastral textarea.
   Scope: editor note/cadastral fields only. Keeps real CSS borders; no pseudo-border or manual drawing. */









/* FINAL PATCH 2026-07-08 — lease list note column.
   Adds the card note as a real table column, rebalances widths, and clamps note text to avoid oversized rows. */




/* 12-column balance: compact existing fields, maximum practical space for notes. */

































/* FINAL PATCH 2026-07-08 — lease note table cells: no placeholder dash, centered transferred notes. */






/* PATCH — Settings database merge action */






@media (max-width: 1280px) {
  
}


/* PATCH 2026-07-08 — database buttons: remove status strip, add merge color and icon micro-animations */












@media (prefers-reduced-motion: no-preference) {
  

  

  

  
}

@media (prefers-reduced-motion: reduce) {
  
}

/* Auth / users management layer */
.hidden{
  display: none !important;
}


















































































@media (max-width: 1180px) {
  
}

/* PATCH 2026-07-08 — users block isolation, clean Settings layout, sidebar restored */




























/* No added account/status strip in the sidebar — keep the previous sidebar structure. */


@media (max-width: 1180px) {
  
}

@media (max-width: 760px) {
  

  
}

/* PATCH 2026-07-08 — settings users block visual normalization */


















































@media (prefers-reduced-motion: no-preference) {
  

  

  

  
}

@media (max-width: 1180px) {
  
}

@media (max-width: 760px) {
  
}

/* PATCH 2026-07-08 — login dropdown + simplified settings permissions */












/* PATCH 2026-07-08 — login spacing, user password change, logout-to-login */
















/* FINAL PATCH 2026-07-08 — lease table headers: start date + duration, restored hover titles */




/* 13-column balance: compact date/amount fields and preserve maximum practical note width. */




























/* FINAL HOME FIVE-ROW MIDDLE BLOCKS 2026-07-08 */








































@media (max-height: 900px) {
  

  
}

/* FINAL HOME BALANCE REFINEMENT 2026-07-08 */




















@media (max-height: 900px) {
  
}

/* FINAL MICRO ALIGNMENT 2026-07-08 */




























/* FINAL VISIBLE POLISH 2026-07-09 */




















































/* FINAL HEIGHT AND ROW CORRECTION 2026-07-09 */




























/* FINAL HOME HEADER AND INNER CHART TUNE 2026-07-09 */




















/* FINAL HOME BREATHING ROOM 2026-07-09 */


















/* FINAL CHART PROPORTION TUNE 2026-07-09 */






/* FINAL CHART GRID DENSITY 2026-07-09 */



/* PATCH 2026-07-09 — Home chart proportional block: compact height, clean title spacing, no vertical stretching. */






























@media (max-height: 900px) {
  

  

  

  

  

  
}

@media (max-width: 1280px) {
  
}

/* PATCH 2026-07-09 — Home chart axis/title/card cleanup. */













/* PATCH 2026-07-09 — Home chart 3:2 trial geometry. */








@media (max-height: 900px) {
  
}

/* PATCH 2026-07-09 — Tune chart internals for 3:2 geometry. */


























/* PATCH 2026-07-09 — Home yearly chart perceptual quality pass: uniform SVG scaling, readable labels, high-resolution geometry. */










































@media (max-height: 900px) {
  
}

@media (max-width: 1280px) {
  
}

@media (max-width: 1180px) {
  

  
}

/* FINAL PATCH 2026-07-09 — readable dashboard chart, no letterboxing. */




































@media (max-width: 1280px) {
  

  
}


/* FINAL PATCH 2026-07-09 — Statistics page professional information architecture.
   Goal: same page margins as Settings, clearer hierarchy, large readable chart, secondary blocks below. */




/* Header: same horizontal rhythm as Settings page. */














/* 1) Financial overview: compact, readable, visually grouped. */














/* 2) Main evidence: chart comes before the secondary panels. */






















/* 3) Secondary analysis: four small panels, same weight, after the chart. */


























@media (max-width: 1480px) {
  
  
}

@media (max-width: 1180px) {
  
  
  
  
}

@media (max-width: 760px) {
  
  
  
  
}

/* FINAL PATCH 2026-07-09 — Statistics page requested cleanup:
   compact non-clipping KPI cards, Settings-like header rhythm, normal-weight records,
   and transparent blocks so the shared low-poly background remains visible. */


/* Header spacing aligned with the simple Settings header: compact title line + actions on one baseline. */
























/* First block: smaller cards, no clipping, auto height, transparent surfaces. */














/* Transparent blocks/fields: keep borders for structure, remove local fills. */








/* Record text: normal weight everywhere inside Statistics. Titles remain medium for hierarchy. */






/* Secondary panels: keep the redesign but remove heavy fills and bold records. */
















@media (max-width: 1480px) {
  
}

@media (max-width: 820px) {
  
}

@media (max-width: 620px) {
  
  
}

/* FINAL PATCH 2026-07-09 — Statistics top financial cards: preserve 3×2 layout, prevent second-row clipping. */












/* FINAL PATCH 2026-07-09 — statistics page block spacing matches Settings rhythm. */




/* Header → finance frame → middle panels → chart: one consistent 14px section gap. */


/* Card/panel gaps follow Settings page .settings-layout / .reference-settings-grid gap. */


/* Chart internal stage/control split uses the same page rhythm. */


@media (max-width: 760px) {
  

  
}

/* FINAL PATCH 2026-07-09 — Statistics title and header offset aligned to Settings page. */
















@media (max-width: 620px) {
  
}

/* FINAL PATCH 2026-07-09 — Statistics header left/top rhythm matches New Card / other pages.
   Header content is inset by the same 16px as the editor header, while the first frame starts
   immediately below the 76px page header. Inter-block gaps remain 14px. */
















@media (max-width: 620px) {
  
}

/* FINAL PATCH 2026-07-09 — Statistics chart-to-lower-block gap matches the upper section spacing only. */



/* FINAL PATCH 2026-07-09 — Statistics inner title scale and municipality total accent. */








/* FINAL PATCH 2026-07-09 — Statistics inner block titles match Settings block title scale. */




/* FINAL PATCH 2026-07-09 — Statistics block-title inset matches the shown reference crop.
   Only adjusts title distance from the block frame; layout/order/content stays unchanged. */


















/* FINAL PATCH 2026-07-09 — lease table page header title inset matches the card editor header reference. */








/* FINAL PATCH 2026-07-09 — Statistics lower blocks: increase block height only so the last row is not clipped; inter-block gaps stay unchanged. */




@media (max-height: 900px) {
  

  
}

/* FINAL PATCH 2026-07-09 — table page title left inset matches Settings title inset.
   Scope: Active / Terminated / Archive titles only; table layout, search field and block gaps stay unchanged. */




/* FINAL PATCH 2026-07-09 — statistics chart readability regression fix only.
   Scope: the yearly chart SVG/labels/strokes. It does not change block order,
   inter-block spacing, table headers, lower-card heights, or KPI layout. */




















/* FINAL PATCH 2026-07-09 — table header search right inset matches Report Excel action.
   Scope: only the search field in Active / Terminated / Archive headers. */


/* Final stats chart axis label size override: requested 10px. */



/* FINAL PATCH 2026-07-09 — Municipality rows and chart inspector cleanup.
   Scope: keep every municipality visible on the main statistics block and remove the confusing peak tile from the chart inspector. */










/* FINAL PATCH 2026-07-09 — Municipality block uses bounded inner scrolling, not auto-growing.
   Scope: statistics Municipality block only, plus restoring the lower-stat grid fixed row height
   so municipality content cannot push outside the block. Inter-block gaps stay 12px. */














@media (max-height: 900px) {
  

  
}

/* FINAL PATCH 2026-07-09 — municipality list: hidden scrollbar and exactly six visible rows.
   Keeps internal wheel/trackpad scrolling active, removes the rail, and prevents a clipped seventh row. */






/* FINAL PATCH 2026-07-09 — Municipality + performer lists: exact six visible rows, hidden scrollbar.
   Scope: statistics lower grid only. Does not alter inter-block spacing or panel layout. */






/* FINAL PATCH 2026-07-09 — calculation label spacing parity: card + statistics headers. */










/* FINAL PATCH 2026-07-09 — calculation header spacing: label/date/buttons unified to 12px on editor + statistics. */




/* FINAL FIX 2026-07-09 — shared calculation header geometry for New Card + Statistics.
   One source of truth: label/date/button/button gaps = 12px; date and action controls identical. */




















/* FINAL PATCH 2026-07-09 — remove date field fill on New Card + Statistics without changing size or spacing. */



/* PATCH 2026-07-09 — admin-only database reset button and confirmation popup */






@media (prefers-reduced-motion: no-preference) {
  

  
}





































/* FINAL PATCH 2026-07-09 — Database reset popup typography matches notification popup. */












/* FINAL FIX 2026-07-09 — Database reset popup uses the exact notification popup typography. */
















/* FINAL FIX 2026-07-09 — Vertically center trash icon in database reset popup body. */





/* FINAL PATCH 2026-07-09 — Empty database statistics blocks show titles only. */








/* ================================
   Cases Electron system overrides
   Pactum-derived visual revision
   ================================ */
.cases-app-frame { grid-template-columns: var(--cases-sidebar-w, calc(var(--cases-nav-w, 176px) + 2 * var(--ui-divider-frame-gap, 24px))) minmax(0, 1fr); }
.cases-main { padding: 12px 22px 30px; }
.cases-nav-item .nav-icon { grid-row: 1 / span 2; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 10px; background: rgba(255,255,255,.16); font-weight: 700; }
.cases-nav-item.active .nav-icon { background: var(--primary-soft); color: var(--primary-strong); }
.cases-page-root { display: grid; gap: 16px; }







.cases-card { border-radius: var(--radius-lg); box-shadow: var(--shadow-card); }


.cases-table-wrap { max-height: calc(100vh - 210px); overflow: auto; border-radius: var(--radius-lg); background: rgba(255,255,255,.90); }
.cases-table { width: 100%; min-width: 1280px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.cases-table th,
.cases-table td { padding: 10px 9px; border-bottom: 1px solid var(--line); vertical-align: middle; overflow: hidden; text-overflow: ellipsis; }
.cases-table th { position: sticky; top: 0; z-index: 2; background: #f8fbff; color: #0f172a; font-size: var(--type-caption); font-weight: 700; }
.cases-table tr:hover td { background: #f8fbff; }
.cases-table th:nth-child(1), .cases-table td:nth-child(1) { width: 56px; }
.cases-table th:nth-child(2), .cases-table td:nth-child(2) { width: 105px; }
.status-pill { display: inline-flex; align-items: center; min-height: 26px; padding: 3px 9px; border-radius: 999px; color: var(--primary-strong); background: var(--primary-soft); border: 1px solid #bae6fd; white-space: nowrap; }
.editor-panel { display: grid; gap: 14px; }
.cases-editor-panel textarea,
.cases-editor-panel input,
.cases-editor-panel select{
  height: var(--control-h);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface-soft);
  color: var(--ink);
  padding: 0 11px;
  outline: none;
}
.cases-editor-panel textarea { height: auto; min-height: 76px; padding: 10px 11px; resize: vertical; }
.cases-editor-panel input:focus,
.cases-editor-panel select:focus,
.cases-editor-panel textarea:focus{ border-color: var(--primary); box-shadow: 0 0 0 3px rgba(2,132,199,.10); }



















.reference-add-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; margin-bottom: 12px; }
.settings-list { display: grid; gap: 8px; max-height: 260px; overflow: auto; padding-right: 4px; }
.settings-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; min-height: 38px; border: 1px solid var(--line); border-radius: var(--radius-md); padding: 6px 8px; background: #f8fbff; }
.empty-state { color: var(--muted); text-align: center; padding: 18px; }

.toast-stack { position: fixed; right: 20px; bottom: 20px; z-index: 1000; display: grid; gap: 8px; pointer-events: none; }
.toast-item { min-width: 260px; max-width: 420px; border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; color: var(--ink); background: rgba(255,255,255,.96); box-shadow: var(--shadow-soft); opacity: 0; transform: translateY(8px); transition: .16s ease; }
.toast-item.visible { opacity: 1; transform: translateY(0); }
.toast-item.error { border-color: #fecaca; background: #fff5f5; color: var(--red); }
.fatal-error { margin: 30px; white-space: pre-wrap; color: #991b1b; }

@media (max-width: 1180px) {
  
  
}

/* PATCH 2026-07-09 — Pactum titlebar controls + transparent page surfaces for Cases. */
html body .titlebar {
  height: 34px !important;
  min-height: 34px !important;
  margin: -4px -8px 14px !important;
  padding: 4px 8px 6px 0 !important;
  align-items: flex-start !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
  -webkit-app-region: drag !important;
}

html body .titlebar .drag-region {
  flex: 1 1 auto !important;
  height: 100% !important;
  -webkit-app-region: drag !important;
}

html body .window-controls {
  height: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  padding: 0 4px 0 0 !important;
  -webkit-app-region: no-drag !important;
}

html body .window-controls button,
html body .window-controls button[type="button"] {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  max-width: 20px !important;
  max-height: 20px !important;
  padding: 0 !important;
  border-radius: 7px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  color: #d97706 !important;
  font-size: 0 !important;
  transform: none !important;
  filter: none !important;
}



html body .window-controls button:hover,
html body .window-controls button:focus-visible {
  background: rgba(15, 23, 42, .055) !important;
  border-color: rgba(15, 23, 42, .08) !important;
  outline: none !important;
  filter: none !important;
  transform: none !important;
}

html body .window-controls .traffic-icon {
  display: block !important;
  width: 12px !important;
  height: 12px !important;
  min-width: 12px !important;
  min-height: 12px !important;
  border-radius: 0 !important;
  opacity: 1 !important;
  color: currentColor !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2.15 !important;
  pointer-events: none !important;
}

/* Page-level transparent surfaces: containers keep borders/spacing, but the fills are removed. */
html body .cases-main :where(
  .page-header,
  .cases-page-header,
  .panel,
  .panel-summary,
  .kpi-card,
  .metric-tile,
  .stat-card,
  .form-section,
  .subpanel,
  .cases-card,
  .report-card,
  .reference-block,
  .table-wrap,
  .cases-table-wrap,
  .settings-item,
  .settings-list,
  .readonly-box,
  .cases-chip-list,
  .line-item,
  .editor-actions-bar,
  .list-toolbar,
  .empty,
  .empty-state,
  .status-pill,
  .chip-removable
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html body .cases-main :where(
  input,
  select,
  textarea,
  .date-pair,
  .date-pair input[type="text"],
  .date-pair input[type="date"],
  .table-search-field,
  .wide-search input
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html body .cases-main :where(.cases-table th, table th) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  backdrop-filter: none !important;
}

html body .cases-main :where(.cases-table tr:hover td, table tr:hover td) {
  background: rgba(255, 255, 255, .18) !important;
}

html body .cases-main :where(input:focus, select:focus, textarea:focus) {
  background: transparent !important;
  background-color: transparent !important;
}

/* PATCH 2026-07-09 — Pactum-style grouped sidebar + multicolor low-poly background. */
html body {
  background:
    radial-gradient(circle at 12% 4%, rgba(20, 184, 166, .20), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(168, 85, 247, .18), transparent 29%),
    radial-gradient(circle at 78% 92%, rgba(245, 158, 11, .15), transparent 26%),
    linear-gradient(135deg, #f8fbff 0%, #eef6ff 42%, #faf7ff 72%, #fffaf0 100%) !important;
}

html body::before {
  content: "" !important;
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  opacity: .46 !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900' preserveAspectRatio='none'%3E%3Crect width='1600' height='900' fill='%23f8fbff'/%3E%3Cpolygon points='0,0 280,0 135,158 0,120' fill='%2314b8a6' opacity='.16'/%3E%3Cpolygon points='260,0 640,0 480,155 135,158' fill='%2322d3ee' opacity='.15'/%3E%3Cpolygon points='610,0 1010,0 820,170 480,155' fill='%23a78bfa' opacity='.18'/%3E%3Cpolygon points='980,0 1600,0 1600,185 820,170' fill='%23fbbf24' opacity='.13'/%3E%3Cpolygon points='0,118 135,158 0,360' fill='%230ea5e9' opacity='.10'/%3E%3Cpolygon points='135,158 480,155 290,390 0,360' fill='%23c084fc' opacity='.105'/%3E%3Cpolygon points='480,155 820,170 680,420 290,390' fill='%232dd4bf' opacity='.10'/%3E%3Cpolygon points='820,170 1600,185 1320,435 680,420' fill='%23fb7185' opacity='.08'/%3E%3Cpolygon points='0,900 0,560 360,710 610,900' fill='%235eead4' opacity='.14'/%3E%3Cpolygon points='360,710 790,590 1120,900 610,900' fill='%2393c5fd' opacity='.13'/%3E%3Cpolygon points='790,590 1600,520 1600,900 1120,900' fill='%23fcd34d' opacity='.11'/%3E%3C/svg%3E") center/cover no-repeat !important;
}

html body .cases-app-frame {
  grid-template-columns: var(--cases-sidebar-w, calc(var(--cases-nav-w, 176px) + 2 * var(--ui-divider-frame-gap, 24px))) minmax(0, 1fr) !important;
}

html body .sidebar.cases-sidebar,
html body .sidebar {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  padding: 18px 14px !important;
  color: #ffffff !important;
  overflow: hidden !important;
  background: #0b1736 !important;
  box-shadow: inset -1px 0 rgba(255, 255, 255, .22), 1px 0 0 rgba(15, 23, 42, .06) !important;
}

html body .sidebar::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  opacity: .98 !important;
  background:
    linear-gradient(132deg, transparent 0 10%, rgba(14, 165, 233, .92) 10% 24%, transparent 24% 100%),
    linear-gradient(29deg, transparent 0 20%, rgba(45, 212, 191, .72) 20% 38%, transparent 38% 100%),
    linear-gradient(148deg, transparent 0 39%, rgba(168, 85, 247, .58) 39% 52%, transparent 52% 100%),
    linear-gradient(30deg, transparent 0 54%, rgba(251, 191, 36, .34) 54% 64%, transparent 64% 100%),
    linear-gradient(150deg, transparent 0 65%, rgba(2, 132, 199, .82) 65% 78%, transparent 78% 100%),
    linear-gradient(180deg, #0b1736, #075985 52%, #111827) !important;
}

html body .sidebar::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(11, 23, 54, .16), rgba(11, 23, 54, .58)) !important;
}

html body .sidebar > * {
  position: relative !important;
  z-index: 1 !important;
}













html body .sidebar-nav.cases-sidebar-nav,
html body .cases-sidebar-nav,
html body .sidebar-nav {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  overflow: hidden !important;
  padding: 0 2px 2px !important;
}

html body .nav-main-group,
html body .nav-bottom-group {
  display: grid !important;
  gap: 7px !important;
  position: relative !important;
  z-index: 1 !important;
}

html body .nav-main-group {
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-right: 2px !important;
}

html body .nav-main-group::-webkit-scrollbar { width: 7px !important; }
html body .nav-main-group::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: rgba(224, 242, 254, .28) !important;
}

html body .nav-bottom-group {
  margin-top: auto !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(255, 255, 255, .22) !important;
}

html body .nav-item.cases-nav-item,
html body .nav-item {
  position: relative !important;
  width: 100% !important;
  min-height: 42px !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  border: 1px solid rgba(255, 255, 255, .22) !important;
  border-radius: 13px !important;
  padding: 8px 11px 8px 8px !important;
  color: rgba(255, 255, 255, .92) !important;
  background: rgba(255, 255, 255, .12) !important;
  text-align: left !important;
  font-size: var(--type-body) !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14) !important;
  transition: transform .14s ease, border-color .14s ease, background .14s ease, color .14s ease, box-shadow .14s ease !important;
}


html body .nav-item:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(255, 255, 255, .42) !important;
  color: #ffffff !important;
  background: rgba(255, 255, 255, .20) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 10px 22px rgba(2, 8, 23, .10) !important;
}

html body .nav-item.active {
  color: #0b1736 !important;
  border-color: rgba(255, 255, 255, .72) !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 12px 26px rgba(2, 8, 23, .18), inset 0 1px 0 rgba(255,255,255,.80) !important;
}

html body .nav-icon,
html body .nav-item.active .nav-icon {
  width: 28px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 10px !important;
  color: #e0f2fe !important;
  background: rgba(255, 255, 255, .14) !important;
  border: 1px solid rgba(255, 255, 255, .20) !important;
  font-size: 0 !important;
}

html body .nav-item:hover .nav-icon {
  color: #ffffff !important;
  background: rgba(255, 255, 255, .20) !important;
}

html body .nav-item.active .nav-icon {
  color: #075985 !important;
  background: #ffffff !important;
  border-color: rgba(255, 255, 255, .82) !important;
}

html body .nav-icon svg {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html body .nav-title {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .nav-item.nav-exit {
  color: #fecdd3 !important;
  border-color: rgba(254, 202, 202, .24) !important;
}

html body .nav-item.nav-exit:hover {
  color: #ffffff !important;
  border-color: rgba(248, 113, 113, .46) !important;
  background: rgba(244, 63, 94, .22) !important;
}

html body .nav-item.nav-exit .nav-icon {
  color: #fecdd3 !important;
}

html body .nav-item.nav-exit:hover .nav-icon {
  color: #ffffff !important;
}







/* Keep the page and field fills transparent over the new low-poly background. */
html body .cases-main :where(
  .page-header,
  .cases-page-header,
  .panel,
  .kpi-card,
  .metric-tile,
  .stat-card,
  .form-section,
  .subpanel,
  .cases-card,
  .report-card,
  .settings-card,
  .about-card,
  .reference-settings-card,
  .settings-control-card,
  .table-wrap,
  .cases-table-wrap,
  .readonly-box,
  .cases-chip-list,
  .line-item,
  .editor-actions-bar,
  .settings-item,
  .empty-state
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html body .cases-main :where(input, select, textarea, .date-pair input[type="text"], .date-pair input[type="date"]) {
  background-color: transparent !important;
  background-image: none !important;
}

@media (max-width: 980px) {
  html body .cases-app-frame { grid-template-columns: 1fr !important; }
  html body .sidebar.cases-sidebar { min-height: 360px !important; }
  
}

/* 2026-07 revision: one pale low-poly background across the full app, including sidebar. */
html body {
  background: #edf5fb !important;
}

html body::before {
  opacity: 1 !important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1800 1000' preserveAspectRatio='none'%3E%3Crect width='1800' height='1000' fill='%23eef6fb'/%3E%3Cpolygon points='0,0 360,0 210,210 0,260' fill='%23dcecf8'/%3E%3Cpolygon points='360,0 720,0 560,220 210,210' fill='%23e7f2fb'/%3E%3Cpolygon points='720,0 1120,0 920,250 560,220' fill='%23d7e9f6'/%3E%3Cpolygon points='1120,0 1800,0 1800,210 920,250' fill='%23edf7fb'/%3E%3Cpolygon points='0,260 210,210 380,470 0,540' fill='%23f7fbff'/%3E%3Cpolygon points='210,210 560,220 520,560 380,470' fill='%23d2e7f4'/%3E%3Cpolygon points='560,220 920,250 820,540 520,560' fill='%23edf7fc'/%3E%3Cpolygon points='920,250 1320,360 1120,650 820,540' fill='%23dbeefa'/%3E%3Cpolygon points='1320,360 1800,210 1800,590 1120,650' fill='%23f5fbff'/%3E%3Cpolygon points='0,540 380,470 520,760 0,1000' fill='%23ddeef8'/%3E%3Cpolygon points='380,470 520,560 820,540 740,870 520,760' fill='%23f3f9fd'/%3E%3Cpolygon points='820,540 1120,650 1040,1000 740,870' fill='%23d8eaf7'/%3E%3Cpolygon points='1120,650 1800,590 1800,1000 1040,1000' fill='%23e9f5fc'/%3E%3Cpolygon points='0,1000 520,760 740,870 1040,1000' fill='%23f8fcff'/%3E%3C/svg%3E") center / cover no-repeat !important;
}












html body .nav-item.cases-nav-item,
html body .nav-item {
  min-height: 44px !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 12px 8px 8px !important;
  color: #1f344f !important;
  border-color: rgba(79, 116, 151, .22) !important;
  background: rgba(255, 255, 255, .28) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .42), 0 6px 18px rgba(56, 89, 123, .045) !important;
}

html body .nav-item:hover {
  color: #0d2540 !important;
  border-color: rgba(14, 116, 144, .34) !important;
  background: rgba(255, 255, 255, .44) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 10px 22px rgba(56, 89, 123, .075) !important;
}

html body .nav-item.active {
  color: #0b1736 !important;
  border-color: rgba(14, 116, 144, .42) !important;
  background: rgba(255, 255, 255, .62) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .70), 0 12px 26px rgba(56, 89, 123, .10) !important;
}

html body .nav-icon,
html body .nav-item.active .nav-icon {
  width: 28px !important;
  height: 28px !important;
  color: #29506f !important;
  background: rgba(255, 255, 255, .34) !important;
  border-color: rgba(79, 116, 151, .20) !important;
}

html body .nav-item:hover .nav-icon,
html body .nav-item.active .nav-icon {
  color: #075985 !important;
  background: rgba(255, 255, 255, .62) !important;
}


html body .nav-item.nav-exit {
  color: #8f1f31 !important;
  border-color: rgba(190, 18, 60, .20) !important;
}

html body .nav-item.nav-exit:hover {
  color: #7f1d1d !important;
  border-color: rgba(190, 18, 60, .32) !important;
  background: rgba(255, 255, 255, .48) !important;
}

html body .nav-item.nav-exit .nav-icon,
html body .nav-item.nav-exit:hover .nav-icon {
  color: #b91c1c !important;
}


/* 2026-07 revision: exact sidebar logo asset, transparent nav frames, optical vertical centering. */

html body .sidebar-nav .nav-item,
html body .sidebar-nav .nav-item.cases-nav-item,
html body .nav-main-group .nav-item,
html body .nav-bottom-group .nav-item {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: stretch !important;
  min-height: 46px !important;
  height: 46px !important;
  padding: 6px 12px 6px 8px !important;
  gap: 10px !important;
  border-color: transparent !important;
  outline-color: transparent !important;
  box-shadow: none !important;
  background-clip: padding-box !important;
}

html body .sidebar-nav .nav-item:hover,
html body .sidebar-nav .nav-item.active,
html body .sidebar-nav .nav-item.nav-exit,
html body .sidebar-nav .nav-item.nav-exit:hover {
  border-color: transparent !important;
  outline-color: transparent !important;
  box-shadow: none !important;
}

html body .sidebar-nav .nav-item::before,
html body .sidebar-nav .nav-item::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}


html body .sidebar-nav .nav-icon,
html body .sidebar-nav .nav-item .nav-icon,
html body .sidebar-nav .nav-item.active .nav-icon,
html body .sidebar-nav .nav-item:hover .nav-icon {
  align-self: center !important;
  justify-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-color: transparent !important;
  outline-color: transparent !important;
  line-height: 0 !important;
  box-shadow: none !important;
}

html body .sidebar-nav .nav-icon svg,
html body .sidebar-nav .nav-item .nav-icon svg {
  display: block !important;
  width: 17px !important;
  height: 17px !important;
  margin: 0 !important;
}



/* 2026-07 revision: uploaded horizontal logo + pale low-poly in logo colors. */
html body {
  background: #fbf8ff !important;
}

html body::before {
  opacity: 1 !important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1800 1000' preserveAspectRatio='none'%3E%3Crect width='1800' height='1000' fill='%23fbf8ff'/%3E%3Cpolygon points='0,0 350,0 190,240 0,330' fill='%23f3edff'/%3E%3Cpolygon points='350,0 720,0 520,260 190,240' fill='%23ece3fb'/%3E%3Cpolygon points='720,0 1080,0 930,275 520,260' fill='%23f8f2ff'/%3E%3Cpolygon points='1080,0 1800,0 1800,260 930,275' fill='%23fff7df'/%3E%3Cpolygon points='0,330 190,240 430,500 0,610' fill='%23fff2cc'/%3E%3Cpolygon points='190,240 520,260 585,585 430,500' fill='%23eee4fb'/%3E%3Cpolygon points='520,260 930,275 830,585 585,585' fill='%23f7f0ff'/%3E%3Cpolygon points='930,275 1280,370 1120,680 830,585' fill='%23eadff8'/%3E%3Cpolygon points='1280,370 1800,260 1800,620 1120,680' fill='%23fff8e7'/%3E%3Cpolygon points='0,610 430,500 585,760 0,1000' fill='%23f5e9c8'/%3E%3Cpolygon points='430,500 585,585 830,585 765,875 585,760' fill='%23fbf6ff'/%3E%3Cpolygon points='830,585 1120,680 1060,1000 765,875' fill='%23eee5fb'/%3E%3Cpolygon points='1120,680 1800,620 1800,1000 1060,1000' fill='%23fff5d9'/%3E%3Cpolygon points='0,1000 585,760 765,875 1060,1000' fill='%23faf7ff'/%3E%3C/svg%3E") center / cover no-repeat !important;
}



html body .sidebar.cases-sidebar {
  color: #31284a !important;
  border-right: 1px solid rgba(111, 72, 145, .16) !important;
  box-shadow: 1px 0 0 rgba(255, 255, 255, .52), 14px 0 34px rgba(74, 48, 104, .06) !important;
}







html body .sidebar-nav.cases-sidebar-nav,
html body .cases-sidebar-nav,
html body .sidebar-nav {
  padding: 0 2px 6px !important;
  gap: 13px !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
}

html body .nav-main-group,
html body .nav-bottom-group {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
}

html body .sidebar-nav .nav-item,
html body .sidebar-nav .nav-item.cases-nav-item,
html body .nav-main-group .nav-item,
html body .nav-bottom-group .nav-item {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 16px !important;
  min-height: 48px !important;
  height: 48px !important;
  padding: 5px 14px 5px 10px !important;
  margin: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .sidebar-nav .nav-item:hover {
  background: rgba(255, 255, 255, .34) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html body .sidebar-nav .nav-item.active {
  background: rgba(255, 255, 255, .46) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}


html body .sidebar-nav .nav-icon,
html body .sidebar-nav .nav-item .nav-icon,
html body .sidebar-nav .nav-item.active .nav-icon,
html body .sidebar-nav .nav-item:hover .nav-icon {
  align-self: center !important;
  justify-self: start !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html body .sidebar-nav .nav-icon svg,
html body .sidebar-nav .nav-item .nav-icon svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}


html body .nav-item.nav-exit,
html body .nav-item.nav-exit:hover {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* PATCH 2026-07-09 — lilac-only Pactum-geometry low-poly background.
   Scope: visual CSS only. Removes gold from the low-poly layer and reuses Pactum-style polygon placement. */
:root {
  --cases-lilac-lowpoly: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900' preserveAspectRatio='none'%3E%3Crect width='1600' height='900' fill='%23fbf9ff'/%3E%3Cpolygon points='0,0 260,0 170,110 0,120' fill='%238b5cf6' opacity='.16'/%3E%3Cpolygon points='180,0 520,0 360,118 170,110' fill='%23a78bfa' opacity='.18'/%3E%3Cpolygon points='480,0 850,0 640,118 360,118' fill='%23ddd6fe' opacity='.48'/%3E%3Cpolygon points='0,900 450,720 810,900' fill='%23c4b5fd' opacity='.18'/%3E%3Cpolygon points='900,900 1600,660 1600,900' fill='%238b5cf6' opacity='.10'/%3E%3C/svg%3E");
  --cases-lilac-lowpoly-soft: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 180' preserveAspectRatio='none'%3E%3Crect width='1200' height='180' fill='%23fbf9ff' opacity='.26'/%3E%3Cpolygon points='0,0 210,0 120,74 0,105' fill='%238b5cf6' opacity='.070'/%3E%3Cpolygon points='155,0 415,0 300,82 120,74' fill='%23a78bfa' opacity='.080'/%3E%3Cpolygon points='380,0 700,0 545,86 300,82' fill='%23ddd6fe' opacity='.24'/%3E%3Cpolygon points='0,180 245,120 500,180' fill='%23c4b5fd' opacity='.075'/%3E%3Cpolygon points='830,180 1200,90 1200,180' fill='%238b5cf6' opacity='.045'/%3E%3C/svg%3E");
}

html body {
  background:
    radial-gradient(circle at 16% 0%, rgba(221, 214, 254, .46), transparent 31%),
    radial-gradient(circle at 94% 16%, rgba(237, 233, 254, .52), transparent 28%),
    linear-gradient(135deg, #fbf9ff 0%, #f6f1ff 50%, #fcfbff 100%) !important;
}

html body::before {
  opacity: 1 !important;
  background: var(--cases-lilac-lowpoly) center / cover no-repeat !important;
}

html body .app-frame.cases-app-frame,
html body .main-shell.cases-main,
html body .sidebar.cases-sidebar {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}


html body .sidebar.cases-sidebar::before,
html body .sidebar.cases-sidebar::after {
  content: none !important;
  display: none !important;
  background: none !important;
}



/* PATCH 2026-07-09 — transparent page headers.
   Scope: visual CSS only. Removes visible frames/fills from page-level headers while preserving layout. */
html body .cases-main :where(
  .page-header,
  .cases-page-header,
  .sticky-form-header,
  .editor-sticky-header,
  .form-titlebar,
  .section-heading
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  outline: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body .cases-main :where(
  .page-header,
  .cases-page-header
) {
  border: 1px solid transparent !important;
}

html body .cases-main :where(
  .sticky-form-header,
  .editor-sticky-header,
  .form-titlebar,
  .section-heading
) {
  border-top-color: transparent !important;
  border-right-color: transparent !important;
  border-bottom-color: transparent !important;
  border-left-color: transparent !important;
}

html body .cases-main :where(
  .page-header,
  .cases-page-header,
  .sticky-form-header,
  .editor-sticky-header,
  .form-titlebar,
  .section-heading
)::before,
html body .cases-main :where(
  .page-header,
  .cases-page-header,
  .sticky-form-header,
  .editor-sticky-header,
  .form-titlebar,
  .section-heading
)::after {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}



/* PATCH 2026-07-09 — new/edit card header aligned to Pactum editor header.
   Scope: UI only. Moves save action from footer to the header, removes subtitle/back action. */


















/* PATCH 2026-07-11 — remove all page headers while preserving header actions in-place.
   Header titles/subtitles are no longer rendered by renderer.js; this strip keeps action buttons at the former header zone. */
html body .cases-main .page-action-strip,
html body .cases-main .cases-page-action-strip,
html body .cases-main .editor-action-strip {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  min-height: 58px !important;
  padding: 8px 4px 14px !important;
  margin: 0 0 14px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 1px solid transparent !important;
  outline: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}







/* Dynamic object/registration sections — aligned with Pactum repeated-row pattern */
.cases-repeat-section {
  display: block !important;
}





.cases-repeat-section .add-action {
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 10px !important;
}


.cases-repeat-list {
  display: grid !important;
  gap: 14px !important;
  margin-top: 14px !important;
}

.cases-repeat-list:empty {
  display: none !important;
  margin: 0 !important;
}

.cases-object-row,
.cases-registration-row {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  align-items: end !important;
}

.cases-object-row {
  display: grid !important;
  grid-template-columns: minmax(170px, .9fr) minmax(240px, 1.45fr) minmax(190px, 1fr) minmax(180px, .95fr) 38px !important;
  gap: 16px !important;
}

.cases-registration-row {
  display: grid !important;
  grid-template-columns: minmax(260px, 1.5fr) minmax(190px, 1fr) minmax(190px, 1fr) 38px !important;
  gap: 16px !important;
}


.cases-object-row input,
.cases-object-row select,
.cases-registration-row input,
.cases-registration-row select{
  width: 100% !important;
  min-width: 0 !important;
}

.cases-repeat-section .row-icon-action {
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  align-self: end !important;
  justify-self: end !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 10px !important;
}

@media (max-width: 1180px) {
  .cases-object-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) 38px !important;
  }
  .cases-object-row .remove-object-row {
    grid-column: 3 !important;
    grid-row: 2 !important;
  }
}

@media (max-width: 820px) {
  .cases-object-row,
  .cases-registration-row {
    grid-template-columns: 1fr 38px !important;
  }
  .cases-object-row > label,
  .cases-registration-row > label {
    grid-column: 1 / -1 !important;
  }
  .cases-object-row .row-icon-action,
  .cases-registration-row .row-icon-action {
    grid-column: 2 !important;
  }
}

/* PATCH 2026-07-11 — editor blocks, repeated rows and scroll model aligned with Pactum. */
html body .cases-main {
  overflow: hidden !important;
}

html body .cases-main .cases-page-root {
  min-width: 0 !important;
  height: calc(100vh - 52px) !important;
  max-height: calc(100vh - 52px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
  padding: 0 16px 24px 2px !important;
}

html body .cases-main .cases-page-root::-webkit-scrollbar {
  width: 9px !important;
}
html body .cases-main .cases-page-root::-webkit-scrollbar-track {
  background: transparent !important;
}
html body .cases-main .cases-page-root::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: rgba(124, 58, 237, .20) !important;
  border: 2px solid transparent !important;
  background-clip: padding-box !important;
}
html body .cases-main .cases-page-root:hover::-webkit-scrollbar-thumb {
  background: rgba(124, 58, 237, .34) !important;
  border: 2px solid transparent !important;
  background-clip: padding-box !important;
}

html body .cases-editor-panel {
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 18px !important;
  padding: 2px 0 24px !important;
  margin: 0 !important;
}

html body .cases-editor-panel > .form-section.cases-card {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 20px 22px !important;
  border: 1px solid rgba(124, 58, 237, .14) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, .46) !important;
  box-shadow: 0 10px 28px rgba(76, 29, 149, .05) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}




html body .cases-editor-panel label {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--muted, #64748b) !important;
  font-size: var(--type-caption) !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

html body .cases-editor-panel input,
html body .cases-editor-panel select,
html body .cases-editor-panel textarea{
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  border: 1px solid rgba(124, 58, 237, .14) !important;
  background: rgba(255, 255, 255, .48) !important;
  box-shadow: none !important;
}

html body .cases-editor-panel input,
html body .cases-editor-panel select{
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 11px !important;
}

html body .cases-editor-panel input,
html body .cases-editor-panel select {
  padding-left: 13px !important;
  padding-right: 13px !important;
}
html body .cases-editor-panel input[readonly] {
  color: var(--v2-ink) !important;
  background: rgba(248, 250, 252, .58) !important;
}
html body .cases-editor-panel textarea {
  min-height: 108px !important;
  border-radius: 11px !important;
  padding: 12px 13px !important;
  resize: vertical !important;
}

html body .cases-editor-panel .information-row {
  display: grid !important;
  gap: 16px !important;
  align-items: end !important;
  width: 100% !important;
}
html body .cases-editor-panel .information-row-top {
  grid-template-columns: minmax(116px, .55fr) minmax(150px, .70fr) minmax(300px, 1.75fr) minmax(235px, 1.15fr) !important;
}
html body .cases-editor-panel .information-row-bottom {
  grid-template-columns: minmax(130px, .62fr) minmax(150px, .72fr) minmax(230px, 1.16fr) minmax(150px, .72fr) minmax(180px, .90fr) !important;
}

html body .cases-repeat-list {
  width: 100% !important;
  gap: 16px !important;
  margin-top: 18px !important;
}
html body .cases-object-row {
  width: 100% !important;
  grid-template-columns: minmax(210px, .95fr) minmax(360px, 1.75fr) minmax(240px, 1.12fr) minmax(230px, 1.08fr) 42px !important;
  gap: 18px !important;
  align-items: end !important;
}
html body .cases-registration-row {
  width: 100% !important;
  grid-template-columns: minmax(360px, 1.65fr) minmax(230px, 1fr) minmax(230px, 1fr) 42px !important;
  gap: 18px !important;
  align-items: end !important;
}
html body .cases-repeat-section .add-action,
html body .cases-repeat-section .row-icon-action {
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  border-radius: 11px !important;
}


@media (max-width: 1320px) {
  html body .cases-editor-panel .information-row-top,
  html body .cases-editor-panel .information-row-bottom,
  html body .cases-object-row,
  html body .cases-registration-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  html body .cases-object-row .row-icon-action,
  html body .cases-registration-row .row-icon-action {
    grid-column: 2 !important;
    justify-self: end !important;
  }
}

/* PATCH 2026-07-11 — compact controls, taller property/registration frames, fixed editor action strip. */
html body .cases-main .cases-page-root {
  position: relative !important;
  height: calc(100vh - 52px) !important;
  max-height: calc(100vh - 52px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0 16px 24px 2px !important;
  scroll-padding-top: 72px !important;
}

/* Save action stays in one fixed visual position while the editor content scrolls below it. */
html body .cases-main .editor-action-strip {
  position: sticky !important;
  top: 0 !important;
  z-index: 500 !important;
  min-height: 58px !important;
  margin: 0 0 14px !important;
  padding: 8px 4px 12px !important;
  background-color: rgba(248, 246, 253, .98) !important;
  background-image: var(--cases-lilac-lowpoly-soft) !important;
  background-position: center top !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  box-shadow: 0 8px 14px rgba(76, 29, 149, .035) !important;
  isolation: isolate !important;
}

/* Opaque mask: scrolling blocks disappear behind the upper action frame. */
html body .cases-main .editor-action-strip::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: -2px !important;
  bottom: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background-color: rgba(248, 246, 253, .98) !important;
  background-image: var(--cases-lilac-lowpoly-soft) !important;
  background-position: center top !important;
  background-size: cover !important;
}

/* Restore the original compact control scale. */
html body .cases-editor-panel {
  gap: 14px !important;
  padding: 0 0 20px !important;
}
html body .cases-editor-panel > .form-section.cases-card {
  padding: 14px 16px !important;
  border-radius: 14px !important;
}
html body .cases-editor-panel label {
  gap: 5px !important;
  font-size: var(--type-caption) !important;
}
html body .cases-editor-panel input,
html body .cases-editor-panel select{
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  border-radius: 10px !important;
}
html body .cases-editor-panel input,
html body .cases-editor-panel select {
  padding-left: 11px !important;
  padding-right: 11px !important;
}
html body .cases-editor-panel textarea {
  min-height: 88px !important;
  padding: 10px 11px !important;
  border-radius: 10px !important;
}
html body .cases-editor-panel .information-row,
html body .cases-object-row,
html body .cases-registration-row {
  gap: 14px !important;
}
html body .cases-repeat-list {
  gap: 12px !important;
  margin-top: 12px !important;
}

/* Increase only the frame height of Property and Registration blocks. */

/* Keep the repeated-row controls compact and expose the row delete actions. */
html body .cases-repeat-section .add-action,
html body .cases-repeat-section .row-icon-action,
html body .cases-repeat-section .remove-object-row,
html body .cases-repeat-section .remove-registration {
  display: inline-grid !important;
  place-items: center !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  align-self: end !important;
  justify-self: end !important;
}

@media (max-width: 1320px) {
  html body .cases-editor-panel > .cases-repeat-section {
    min-height: 210px !important;
  }
}

/* PATCH — compact transparent editor sections; no date-picker button. */

html body .cases-editor-panel input,
html body .cases-editor-panel select,
html body .cases-editor-panel textarea{
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Section headings match the sidebar navigation title scale. */
html body .cases-editor-panel > .form-section.cases-card > h3{
  margin: 0 !important;
  min-height: 0 !important;
  font-size: var(--type-title) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

/* Field captions remain visually subordinate to section headings. */

/* Empty Property/Registration sections: equal top and bottom inset around the + button. */
html body .cases-editor-panel > .cases-repeat-section {
  min-height: 0 !important;
  padding: 14px 16px !important;
  align-content: initial !important;
}
html body .cases-editor-panel > .cases-repeat-section:has(.cases-repeat-list:empty) {
  min-height: 66px !important;
}


/* Native calendar controls are intentionally absent. */

/* PATCH 2026-07-11 — exact repeat-section spacing, containment and transparent save action. */

/* The empty repeated section is exactly: 14px top + 38px action row + 14px bottom. */
html body .cases-editor-panel > .cases-repeat-section {
  box-sizing: border-box !important;
  display: block !important;
  min-width: 0 !important;
  min-height: 66px !important;
  height: auto !important;
  padding: 14px 16px !important;
  overflow: visible !important;
}

html body .cases-repeat-section .add-action {
  margin: 0 !important;
  align-self: center !important;
}
html body .cases-repeat-list:empty {
  display: none !important;
  margin: 0 !important;
}
html body .cases-repeat-list:not(:empty) {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 12px 0 0 !important;
  overflow: visible !important;
}

/* Repeated rows must always remain inside the section border. */
html body .cases-object-row,
html body .cases-registration-row {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
}
html body .cases-object-row {
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.45fr) minmax(0, 1fr) minmax(0, .95fr) 38px !important;
  gap: 12px !important;
}
html body .cases-registration-row {
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr) 38px !important;
  gap: 12px !important;
}
html body .cases-object-row > label,
html body .cases-registration-row > label,
html body .cases-object-row input,
html body .cases-object-row select,
html body .cases-registration-row input,
html body .cases-registration-row select {
  min-width: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Save button lives in the header action zone, but has no frame or fill. */
html body .cases-main .editor-action-strip .editor-save-action,
html body .cases-main .editor-action-strip #saveCase,
html body .cases-main .pactum-editor-header .editor-save-action,
html body .cases-main .pactum-editor-header #saveCase {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  outline: 0 !important;
  box-shadow: none !important;
}
html body .cases-main .editor-action-strip .editor-save-action:hover,
html body .cases-main .editor-action-strip #saveCase:hover,
html body .cases-main .editor-action-strip .editor-save-action:focus-visible,
html body .cases-main .editor-action-strip #saveCase:focus-visible,
html body .cases-main .editor-action-strip .editor-save-action:active,
html body .cases-main .editor-action-strip #saveCase:active {
  background: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

@media (max-width: 1180px) {
  html body .cases-object-row,
  html body .cases-registration-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  html body .cases-object-row .row-icon-action,
  html body .cases-registration-row .row-icon-action {
    grid-column: 2 !important;
    justify-self: end !important;
  }
}

/* PATCH 2026-07-11 — unified editor typography, borderless actions, date inputs and information-grid proportions. */

/* Section titles use the same visual size as sidebar labels, without bold weight. */

/* All application buttons are borderless; interaction state is conveyed by fill/icon only. */
html body button,
html body button:hover,
html body button:focus,
html body button:focus-visible,
html body button:active {
  border: 0 !important;
  border-color: transparent !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* The save-button header zone itself is fully transparent. */
html body .cases-main .editor-action-strip,
html body .cases-main .editor-action-strip:hover,
html body .cases-main .editor-action-strip:focus-within {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body .cases-main .editor-action-strip::before,
html body .cases-main .editor-action-strip::after {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body .cases-main .editor-action-strip .page-actions,
html body .cases-main .editor-action-strip .editor-header-actions,
html body .cases-main .editor-action-strip .editor-save-action,
html body .cases-main .editor-action-strip #saveCase {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* Both information rows share a twelve-column geometry. */
html body .cases-editor-panel .information-row {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  column-gap: 12px !important;
  row-gap: 8px !important;
  align-items: end !important;
}


/* Second-row placement: status sits directly under executor. */


/* Incoming/outgoing numbers use exactly the same control geometry and accept more than eight characters. */
html body .cases-editor-panel .field-incoming-number input,
html body .cases-editor-panel .field-outgoing-number input {
  width: 100% !important;
  min-width: 9ch !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

/* Date entry: full text input plus an independent calendar action. */
html body .cases-editor-panel .date-entry {
  display: grid !important;
  grid-template-columns: minmax(112px, 1fr) 34px !important;
  align-items: center !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  position: relative !important;
}
html body .cases-editor-panel .date-entry .date-text-input {
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
  padding: 0 9px !important;
  font-variant-numeric: tabular-nums !important;
}
html body .cases-editor-panel .date-picker-button {
  display: inline-grid !important;
  place-items: center !important;
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: rgba(76, 29, 149, .76) !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
html body .cases-editor-panel .date-picker-button:hover {
  background: rgba(124, 58, 237, .08) !important;
}
html body .cases-editor-panel .date-picker-button svg {
  width: 17px !important;
  height: 17px !important;
  pointer-events: none !important;
}
/* Native picker remains functional but visually hidden; showPicker() is called from the separate button. */
html body .cases-editor-panel input.native-date-picker,
html body .cases-editor-panel input[type="date"].native-date-picker {
  display: block !important;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 1px !important;
  min-height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
  right: 34px !important;
  bottom: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Executor and status controls align vertically and have enough text capacity. */

html body .cases-editor-panel .field-executor input,
html body .cases-editor-panel .field-mobile-group input{
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

@media (max-width: 1360px) {
  html body .cases-editor-panel .information-row {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
  html body .cases-editor-panel .field-incoming-number,
  html body .cases-editor-panel .field-outgoing-number,
  html body .cases-editor-panel .field-incoming-date,
  html body .cases-editor-panel .field-outgoing-date,
  html body .cases-editor-panel .field-investigation-date {
    grid-column: span 2 !important;
  }
  html body .cases-editor-panel .field-department,
html body .cases-editor-panel .field-executor,
html body .cases-editor-panel .field-mobile-group{
    grid-column: span 3 !important;
    min-width: 0 !important;
  }
}

/* PATCH 2026-07-11 — exact field proportions, arrowless controls, fixed header actions. */

/* Match section-title typography to sidebar labels exactly. */

/* Every button is visually borderless, including add, remove, save and delete actions. */
html body button,
html body button:hover,
html body button:focus,
html body button:focus-visible,
html body button:active,
html body .add-action,
html body .row-icon-action,
html body .editor-save-action,
html body .editor-delete-action {
  border: 0 !important;
  border-color: transparent !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* Header action container remains fully transparent. */
html body .editor-action-strip,
html body .editor-action-strip .page-actions,
html body .editor-action-strip .editor-header-actions,
html body .editor-action-strip .icon-action {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}
html body .editor-delete-action {
  color: rgba(185, 28, 28, .86) !important;
}

/* Information block: equal widths and equal gaps for both numbers and all three dates. */
html body .cases-editor-panel .information-row {
  display: grid !important;
  grid-template-columns: repeat(18, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: end !important;
}

html body .cases-editor-panel .field-incoming-number input,
html body .cases-editor-panel .field-outgoing-number input,
html body .cases-editor-panel .field-incoming-date .date-entry,
html body .cases-editor-panel .field-outgoing-date .date-entry,
html body .cases-editor-panel .field-investigation-date .date-entry {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* Property row proportions: fixed practical maxima, address consumes all remaining width. */
html body .cases-object-row {
  display: grid !important;
  grid-template-columns: minmax(110px, 130px) minmax(240px, 1fr) minmax(150px, 180px) minmax(250px, 300px) 34px !important;
  gap: 12px !important;
  align-items: end !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
html body .cases-object-row input,
html body .cases-object-row select {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Registration layout remains contained and evenly spaced. */
html body .cases-registration-row {
  display: grid !important;
  grid-template-columns: minmax(180px, 1fr) minmax(150px, 190px) minmax(150px, 190px) 34px !important;
  gap: 12px !important;
  align-items: end !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Remove native dropdown arrows/spinners while preserving keyboard and autocomplete behavior. */
html body .cases-editor-panel select,
html body .cases-editor-panel input,
html body .cases-editor-panel textarea {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-image: none !important;
}
html body .cases-editor-panel select::-ms-expand {
  display: none !important;
}
html body .cases-editor-panel input::-webkit-calendar-picker-indicator,
html body .cases-editor-panel input::-webkit-inner-spin-button,
html body .cases-editor-panel input::-webkit-outer-spin-button {
  opacity: 0 !important;
  display: none !important;
  -webkit-appearance: none !important;
}

/* Custom calendar action remains available and borderless. */
html body .cases-editor-panel .date-picker-button {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Executor and status are aligned by their lower control edge. */

@media (max-width: 1400px) {
  html body .cases-editor-panel .information-row {
    grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
  }
  html body .cases-editor-panel .information-row-top .field-incoming-number,
  html body .cases-editor-panel .information-row-top .field-incoming-date,
  html body .cases-editor-panel .information-row-bottom .field-outgoing-number,
  html body .cases-editor-panel .information-row-bottom .field-outgoing-date,
  html body .cases-editor-panel .information-row-bottom .field-investigation-date {
    grid-column: span 2 !important;
  }
  html body .cases-editor-panel .information-row-top .field-department { grid-column: span 3 !important; }
  html body .cases-editor-panel .information-row-top .field-executor { grid-column: span 2 !important; }
  
  
}

/* PATCH — mobile/status proportions, frameless add actions, single-line auto-growing note. */



/* Remove every visible outer frame from the + actions, including inherited and pseudo-element frames. */



/* Note starts as one control row and expands only when its content wraps. */



@media (max-width: 1400px) {
  html body .cases-editor-panel .information-row-bottom .field-mobile-group {
    grid-column: span 2 !important;
  }
  
}

/* PATCH — mobile/status proportions, frameless add actions, single-line auto-growing note. */


/* Remove every visible outer frame from the + actions, including inherited and pseudo-element frames. */
html body .cases-repeat-section .add-action,
html body .cases-repeat-section .add-action:hover,
html body .cases-repeat-section .add-action:focus,
html body .cases-repeat-section .add-action:focus-visible,
html body .cases-repeat-section .add-action:active {
  border: 0 !important;
  border-color: transparent !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}
html body .cases-repeat-section .add-action::before,
html body .cases-repeat-section .add-action::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Note starts as one control row and expands only when its content wraps. */
html body .cases-editor-panel .notes-section textarea#note {
  display: block !important;
  width: 100% !important;
  height: 38px;
  min-height: 38px !important;
  max-height: none !important;
  overflow-y: hidden !important;
  resize: none !important;
  box-sizing: border-box !important;
  line-height: 18px !important;
  padding: 9px 11px !important;
  text-align: justify !important;
  text-justify: inter-word !important;
}

@media (max-width: 1400px) {
  html body .cases-editor-panel .information-row-bottom .field-mobile-group {
    grid-column: span 3 !important;
  }
  
}

/* PATCH 2026-07-11 — repeat-section add icon only and exact vertical centering. */





/* The button contributes no visible outer box; only the SVG circle and plus remain. */





html body .cases-editor-panel > .cases-repeat-section:has(.cases-repeat-list:empty) {
  min-height: 52px !important;
  height: 52px !important;
}

html body .cases-editor-panel > .cases-repeat-section:has(.cases-repeat-list:not(:empty)) {
  min-height: 0 !important;
  height: auto !important;
}

/* Sidebar labels and editor block titles intentionally share the same size. */

/* PATCH — align repeat-row delete actions with add actions and tighten editor top spacing. */
html body .cases-repeat-section .row-icon-action,
html body .cases-repeat-section .remove-object-row,
html body .cases-repeat-section .remove-registration {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: inline-grid !important;
  place-items: center !important;
  justify-self: end !important;
  align-self: center !important;
}


/* Keep add and delete actions on the same right-side vertical axis. */
html body .cases-object-row,
html body .cases-registration-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 2.35fr) minmax(0, 1.35fr) minmax(0, 1.8fr) 24px !important;
}
html body .cases-registration-row {
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr) 24px !important;
}

/* Pull the complete editor upward and use one consistent vertical gap. */



html body .cases-main .cases-page-root {
  padding-top: 0 !important;
}

/* PATCH 2026-07-11 — center repeated-row delete icon inside the control lane and move the complete editor upward. */
html body .cases-repeat-section .row-icon-action,
html body .cases-repeat-section .remove-object-row,
html body .cases-repeat-section .remove-registration {
  align-self: end !important;
  justify-self: center !important;
  margin: 0 0 7px 0 !important;
  transform: none !important;
}

/* The editor action and the first block participate in one compact grid; no hidden legacy gap. */
html body .cases-main {
  padding-top: 0 !important;
}

html body .cases-main .cases-page-root:has(.cases-editor-panel) {
  display: grid !important;
  grid-template-rows: 32px minmax(0, auto) !important;
  align-content: start !important;
  gap: 6px !important;
  padding-top: 0 !important;
}

html body .cases-main .cases-page-root:has(.cases-editor-panel) > .editor-action-strip {
  min-height: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 4px !important;
  align-self: start !important;
}

html body .cases-main .cases-page-root:has(.cases-editor-panel) > .cases-editor-panel {
  margin: 0 !important;
  padding-top: 0 !important;
  align-self: start !important;
}

/* PATCH 2026-07-11 — unified 24×24 icon system and equal editor vertical rhythm. */
html body svg.lucide,
html body .nav-icon svg,
html body .icon-action svg,
html body .date-picker-button svg,
html body .add-action svg,
html body .row-icon-action svg,
html body .window-controls .traffic-icon {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  max-width: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
}

/* Keep every icon control large enough to contain a 24px pictogram without clipping. */
html body .window-controls button,
html body .window-controls button[type="button"],
html body .icon-action,
html body .date-picker-button,
html body .add-action,
html body .row-icon-action,
html body .remove-object-row,
html body .remove-registration {
  min-width: 24px !important;
  min-height: 24px !important;
}


/* The titlebar-to-save and save-to-first-block gaps are both 14px. */

html body .cases-main .cases-page-root:has(.cases-editor-panel) {
  gap: 14px !important;
}

/* PATCH 2026-07-11 — restore compact traffic-light icons; embed calendar actions; equalize date/registration fields. */
/* Window traffic-light pictograms return to the previous compact size only. */

/* Calendar button is visually inside the date field while manual text entry remains available. */
html body .cases-editor-panel .date-entry {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
}
html body .cases-editor-panel .date-entry .date-text-input {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 38px !important;
  padding-right: 38px !important;
  box-sizing: border-box !important;
}
html body .cases-editor-panel .date-picker-button,
html body .cases-editor-panel .date-picker-button:hover,
html body .cases-editor-panel .date-picker-button:focus,
html body .cases-editor-panel .date-picker-button:active {
  position: absolute !important;
  top: 50% !important;
  right: 3px !important;
  transform: translateY(-50%) !important;
  width: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  z-index: 2 !important;
}
html body .cases-editor-panel .date-picker-button svg {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  max-width: 24px !important;
  max-height: 24px !important;
}

/* Incoming/outgoing numbers and all dates in the information block use identical column widths. */
html body .cases-editor-panel .information-row-top .field-incoming-number,
html body .cases-editor-panel .information-row-top .field-incoming-date,
html body .cases-editor-panel .information-row-bottom .field-outgoing-number,
html body .cases-editor-panel .information-row-bottom .field-outgoing-date,
html body .cases-editor-panel .information-row-bottom .field-investigation-date {
  grid-column: span 3 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* Registration number, start date and end date are exactly equal width. */
html body .cases-registration-row {
  grid-template-columns: repeat(3, minmax(0, 1fr)) 24px !important;
  gap: 12px !important;
  align-items: end !important;
}
html body .cases-registration-row > label,
html body .cases-registration-row > .date-field-label,
html body .cases-registration-row input,
html body .cases-registration-row .date-entry {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* PATCH 2026-07-11 — sidebar icons match the 24px application icon system and labels share the same vertical center. */

html body .sidebar-nav .nav-icon,
html body .sidebar-nav .nav-item .nav-icon {
  display: inline-grid !important;
  place-items: center !important;
  align-self: center !important;
  justify-self: center !important;
  width: 38px !important;
  height: 38px !important;
  line-height: 0 !important;
}

html body .sidebar-nav .nav-icon svg,
html body .sidebar-nav .nav-item .nav-icon svg,
html body .sidebar-nav .nav-item.active .nav-icon svg,
html body .sidebar-nav .nav-item:hover .nav-icon svg {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  max-width: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
  margin: 0 !important;
  transform: none !important;
}

html body .sidebar-nav .nav-title,
html body .sidebar-nav .nav-item > .nav-title,
html body .sidebar-nav .nav-item > span:last-child {
  display: flex !important;
  align-items: center !important;
  align-self: center !important;
  justify-self: stretch !important;
  height: 38px !important;
  min-height: 38px !important;
  line-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

/* PATCH — optical vertical centering for Georgian sidebar labels. */

/* PATCH 2026-07-11 — optical vertical centering of sidebar pictograms inside each navigation frame. */

html body .sidebar-nav .nav-icon,
html body .sidebar-nav .nav-item .nav-icon {
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  transform: translateY(-2px) !important;
}

/* FINAL PATCH — move the actual sidebar SVG artwork, not only its grid container. */
html body .sidebar-nav .nav-icon,
html body .sidebar-nav .nav-item .nav-icon {
  transform: none !important;
}

html body .sidebar-nav .nav-icon svg,
html body .sidebar-nav .nav-item .nav-icon svg,
html body .sidebar-nav .nav-item.active .nav-icon svg,
html body .sidebar-nav .nav-item:hover .nav-icon svg {
  position: relative !important;
  top: -2px !important;
  transform: none !important;
}

/* FINAL SIDEBAR OPTICAL ALIGNMENT — align the icon wrapper inside the outer nav frame. */

html body .sidebar-nav .nav-item > .nav-icon,
html body .sidebar-nav .nav-item.cases-nav-item > .nav-icon,
html body .nav-main-group .nav-item > .nav-icon,
html body .nav-bottom-group .nav-item > .nav-icon {
  position: relative !important;
  top: -2px !important;
  transform: none !important;
  align-self: center !important;
}

html body .sidebar-nav .nav-item > .nav-icon > svg,
html body .sidebar-nav .nav-item.cases-nav-item > .nav-icon > svg {
  position: static !important;
  top: auto !important;
  transform: none !important;
}

/* FINAL BALANCE PATCH — equalize optical top/bottom spacing for sidebar icon and Georgian label. */


/* FINAL SIDEBAR TITLE OPTICAL FIX — move the actual title box, not its text transform. */

/* FINAL PATCH — center the visible logo inside its own block and equalize the three outer sidebar gaps. */
html body .sidebar.cases-sidebar {
  padding: 14px 14px !important;
}

html body .logo-only-brand.cases-brand {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 112px !important;
  height: 112px !important;
  margin: 0 0 14px 0 !important;
  padding: 10px 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}


html body .sidebar-nav.cases-sidebar-nav,
html body .cases-sidebar-nav,
html body .sidebar-nav {
  padding: 0 2px 0 !important;
  margin: 0 !important;
}

html body .nav-bottom-group {
  margin-top: auto !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
/* ===== Settings internal sidebar ===== */
.settings-layout {
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  overflow: hidden;
}

.settings-sidebar {
  min-width: 0;
  min-height: 0;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  overflow-y: auto;
  overflow-x: hidden;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.20);
  border-radius: 16px;
  box-shadow: none;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.settings-nav-item {
  width: 100%;
  min-height: 44px;
  padding: 6px 10px;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  justify-items: start;
  color: inherit;
  font: inherit;
  font-size: var(--type-title);
  font-weight: 400;
  line-height: 1.2;
  text-align: left;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 11px;
  cursor: pointer;
}

.settings-nav-item:hover,
.settings-nav-item:focus-visible {
  background: rgba(116, 92, 160, 0.08) !important;
}

.settings-nav-item.active {
  background: rgba(116, 92, 160, 0.14) !important;
  color: #4f3e72;
}

.settings-nav-icon {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  flex: 0 0 24px;
}


.settings-content {
  min-width: 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0 4px 14px 0;
}

.settings-content > * {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.settings-single-panel {
  min-height: 100%;
  margin: 0 !important;
}

.settings-single-panel > h3{
  margin-top: 0;
}





@media (max-width: 980px) {
  .settings-layout {
    grid-template-columns: 210px minmax(0, 1fr);
  }
}

/* FINAL SETTINGS SIDEBAR ICON SYSTEM — Lucide icons with the same colored treatment as the main sidebar. */
html body .settings-sidebar .settings-nav-icon {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: currentColor !important;
  box-shadow: none !important;
}


html body .settings-sidebar .settings-nav-item:nth-child(1) .settings-nav-icon { color: #2563eb !important; background: #eff6ff !important; }
html body .settings-sidebar .settings-nav-item:nth-child(2) .settings-nav-icon { color: #0891b2 !important; background: #ecfeff !important; }
html body .settings-sidebar .settings-nav-item:nth-child(3) .settings-nav-icon { color: #16a34a !important; background: #f0fdf4 !important; }
html body .settings-sidebar .settings-nav-item:nth-child(4) .settings-nav-icon { color: #f97316 !important; background: #fff7ed !important; }
html body .settings-sidebar .settings-nav-item:nth-child(5) .settings-nav-icon { color: #7c3aed !important; background: #f5f3ff !important; }
html body .settings-sidebar .settings-nav-item:nth-child(6) .settings-nav-icon { color: #0f766e !important; background: #f0fdfa !important; }
html body .settings-sidebar .settings-nav-item:nth-child(7) .settings-nav-icon { color: #334155 !important; background: #f1f5f9 !important; }
html body .settings-sidebar .settings-nav-item:nth-child(8) .settings-nav-icon { color: #0284c7 !important; background: #f0f9ff !important; }

html body .settings-sidebar .settings-nav-item:hover .settings-nav-icon,
html body .settings-sidebar .settings-nav-item:focus-visible .settings-nav-icon,
html body .settings-sidebar .settings-nav-item.active .settings-nav-icon {
  filter: saturate(1.08) brightness(0.99);
}

/* 2026-07-12 — Match main sidebar name selection to settings sidebar. */
html body .sidebar-nav .nav-item:hover,
html body .sidebar-nav .nav-item:focus-visible {
  background: rgba(116, 92, 160, 0.08) !important;
}

html body .sidebar-nav .nav-item.active {
  background: rgba(116, 92, 160, 0.14) !important;
  color: #4f3e72 !important;
}

/* 2026-07-12 — Settings pages unified, inactive entry state, expanded lists and main-sidebar rhythm. */



html body .settings-content {
  overflow: visible !important;
  padding: 0 !important;
}

html body .settings-single-panel {
  min-height: auto !important;
  padding: 20px !important;
}

html body .settings-single-panel > h3{
  margin-bottom: 18px !important;
}

html body .reference-add-row,
html body .settings-item {
  gap: 12px !important;
}

html body .reference-add-row {
  margin-bottom: 16px !important;
}

html body .settings-list,
html body .settings-list-expanded {
  display: grid !important;
  gap: 10px !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  padding-right: 0 !important;
}

html body .settings-item {
  min-height: 46px !important;
  padding: 6px 8px 6px 12px !important;
  border-radius: 12px !important;
}

html body .settings-action-btn {
  min-height: 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
}

html body .settings-action-btn .button-icon,
html body .settings-action-btn .button-icon svg {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  display: block !important;
}

html body .settings-action-btn.danger-action {
  color: #b91c1c !important;
}

html body .settings-empty-panel {
  min-height: 240px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  text-align: center;
  margin: 0 !important;
}

html body .settings-empty-panel h3,
html body .settings-empty-panel p {
  margin: 0;
}

html body .settings-empty-panel p {
  color: var(--muted);
}

html body .settings-empty-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #7c3aed;
  background: #f5f3ff;
}

html body .settings-empty-icon svg {
  width: 26px;
  height: 26px;
}

html body .card-field-row{
  gap: 14px !important;
}




/* 2026-07-12 — Compact icon-only Settings controls and invisible scrolling. */
html body .settings-content,
html body .settings-sidebar,
html body .settings-list,
html body .settings-list-expanded,
html body .settings-single-panel{
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html body .settings-content::-webkit-scrollbar,
html body .settings-sidebar::-webkit-scrollbar,
html body .settings-list::-webkit-scrollbar,
html body .settings-list-expanded::-webkit-scrollbar,
html body .settings-single-panel::-webkit-scrollbar{
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

html body .settings-content {
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: auto !important;
}


html body .settings-list,
html body .settings-list-expanded {
  max-height: min(52vh, 520px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}



/* Match Settings fields to the New Card controls, with a slightly tighter height. */
html body .settings-single-panel input,
html body .settings-single-panel select{
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border-radius: var(--radius-sm) !important;
  font-size: var(--type-body) !important;
}

html body .reference-add-row {
  grid-template-columns: minmax(0, 1fr) 34px !important;
  align-items: end !important;
  gap: 8px !important;
}

html body .settings-item {
  min-height: 38px !important;
  padding: 4px 6px 4px 10px !important;
  gap: 8px !important;
}

/* Settings action buttons are glyph-only: no label, frame, fill, or shadow. */
html body .settings-action-btn,
html body .settings-action-btn.secondary-btn{
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 0 !important;
  margin: 0 !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #475569 !important;
  display: inline-grid !important;
  place-items: center !important;
  line-height: 1 !important;
}

html body .settings-action-btn:hover,
html body .settings-action-btn:focus-visible,
html body .settings-action-btn:active {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
  color: var(--primary) !important;
}

html body .settings-action-btn.danger-action,
html body .settings-action-btn.danger-action:hover,
html body .settings-action-btn.danger-action:focus-visible {
  color: #b91c1c !important;
  background: transparent !important;
}

html body .settings-action-btn .button-icon,
html body .settings-action-btn .button-icon svg {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  margin: 0 !important;
}

html body td:has(> .settings-action-btn){
  align-items: center !important;
}


/* 2026-07-12 — Settings list viewport, field parity and action alignment. */
html body .settings-layout {
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html body .settings-content {
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
}

html body .settings-single-panel.reference-block {
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  padding: 20px !important;
}

/* Saved rows use the exact same visual dimensions as the entry field. */
html body .reference-add-row input,
html body .settings-item {
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  border-radius: var(--radius-sm) !important;
  box-sizing: border-box !important;
}

html body .settings-item {
  padding: 0 6px 0 10px !important;
  align-items: center !important;
}

html body .settings-item > span {
  display: flex !important;
  align-items: center !important;
  min-height: 100% !important;
  line-height: 1.2 !important;
}

/* The list consumes all remaining page height; only then does it scroll. */
html body .settings-list,
html body .settings-list-expanded {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  align-content: start !important;
  padding: 0 2px 12px 0 !important;
  scroll-padding-bottom: 12px !important;
  box-sizing: border-box !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html body .settings-list::-webkit-scrollbar,
html body .settings-list-expanded::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* Add control matches the circular plus used on the card editor. */
html body .reference-add-row > .settings-action-btn.add-action,
html body .reference-add-row > .settings-action-btn.add-action:hover,
html body .reference-add-row > .settings-action-btn.add-action:focus-visible,
html body .reference-add-row > .settings-action-btn.add-action:active {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  align-self: end !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .reference-add-row > .settings-action-btn.add-action svg {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  color: #d4a017 !important;
  stroke-width: 2 !important;
}

/* Every row action shares one vertical center line. */
html body .reference-add-row,
html body .settings-item,
html body td:has(> .settings-action-btn){
  align-items: center !important;
}

html body .settings-item > .settings-action-btn,
html body td > .settings-action-btn{
  align-self: center !important;
  vertical-align: middle !important;
}

/* 2026-07-12 — Final icon sizing, transparent sidebar glyphs, and Settings alignment. */

/* Main and Settings sidebar icons: 24 × 24, always transparent in every state. */
html body .sidebar .nav-icon,
html body .sidebar .nav-item:hover .nav-icon,
html body .sidebar .nav-item:focus-visible .nav-icon,
html body .sidebar .nav-item.active .nav-icon,
html body .settings-sidebar .settings-nav-icon,
html body .settings-sidebar .settings-nav-item:hover .settings-nav-icon,
html body .settings-sidebar .settings-nav-item:focus-visible .settings-nav-icon,
html body .settings-sidebar .settings-nav-item.active .settings-nav-icon,
html body .settings-sidebar .settings-nav-item:nth-child(n) .settings-nav-icon {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .sidebar .nav-icon svg,
html body .sidebar .nav-icon .lucide,
html body .settings-sidebar .settings-nav-icon svg,
html body .settings-sidebar .settings-nav-icon .lucide {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
}

/* Page/action icons default to 18 × 18. */
html body main button:not(.editor-save-action):not(.editor-delete-action) .button-icon,
html body main button:not(.editor-save-action):not(.editor-delete-action) .button-icon svg,
html body main button:not(.editor-save-action):not(.editor-delete-action) > svg,
html body .settings-action-btn .button-icon,
html body .settings-action-btn .button-icon svg,
html body .settings-action-btn > svg,
html body .row-icon-action svg {
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
}

/* Card save/delete remain 24 × 24. */


/* Settings frames use exactly the same corner radius as their fields. */
html body .settings-single-panel,
html body .settings-single-panel.reference-block,
html body .settings-item,
html body .settings-content .table-wrap,
html body .settings-content table,
html body .settings-content .empty-state{
  border-radius: var(--radius-sm) !important;
}

/* Settings add uses the card property-block plus and aligns with row delete controls. */
html body .reference-add-row {
  grid-template-columns: minmax(0, 1fr) 34px !important;
  align-items: end !important;
}

html body .reference-add-row > .settings-action-btn.add-action,
html body .settings-item > .settings-action-btn.delete-reference {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: center !important;
  display: inline-grid !important;
  place-items: center !important;
  line-height: 1 !important;
}

/* Exception: this exact circular plus matches the property block control. */
html body .reference-add-row > .settings-action-btn.add-action .button-icon,
html body .reference-add-row > .settings-action-btn.add-action .button-icon svg,
html body .reference-add-row > .settings-action-btn.add-action > svg {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
}


/* 2026-07-12 — exact visual corrections requested. */

/* Main sidebar icon itself never receives a white tile on hover/focus/active. */
html body .sidebar-nav .nav-item .nav-icon,
html body .sidebar-nav .nav-item:hover .nav-icon,
html body .sidebar-nav .nav-item:focus-visible .nav-icon,
html body .sidebar-nav .nav-item:active .nav-icon,
html body .sidebar-nav .nav-item.active .nav-icon,
html body .sidebar-nav .nav-item .nav-icon::before,
html body .sidebar-nav .nav-item .nav-icon::after,
html body .sidebar-nav .nav-item:hover .nav-icon::before,
html body .sidebar-nav .nav-item:hover .nav-icon::after {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Settings add button is physically identical to the New Card property-block add button. */





/* New Card fields and frames use the same rounding as Settings fields/frames. */


/* Window traffic-light pictograms: 16 × 16. */

/* 2026-07-12 — verified corrections applied to the actual runtime selectors. */

/* Main sidebar: no white tile behind either the row or the glyph on hover/focus/active. */
html body .cases-sidebar .cases-sidebar-nav .nav-item,
html body .cases-sidebar .cases-sidebar-nav .nav-item:hover,
html body .cases-sidebar .cases-sidebar-nav .nav-item:focus,
html body .cases-sidebar .cases-sidebar-nav .nav-item:focus-visible,
html body .cases-sidebar .cases-sidebar-nav .nav-item:active,
html body .cases-sidebar .cases-sidebar-nav .nav-item.active {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
html body .cases-sidebar .cases-sidebar-nav .nav-item .nav-icon,
html body .cases-sidebar .cases-sidebar-nav .nav-item:hover .nav-icon,
html body .cases-sidebar .cases-sidebar-nav .nav-item:focus-visible .nav-icon,
html body .cases-sidebar .cases-sidebar-nav .nav-item:active .nav-icon,
html body .cases-sidebar .cases-sidebar-nav .nav-item.active .nav-icon,
html body .cases-sidebar .cases-sidebar-nav .nav-item .nav-icon svg {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Settings add control: exactly the same computed geometry and visual treatment as New Card add controls. */





/* New Card: use Settings' 9px rounding on fields and visible frames. */


/* Window control pictograms: verified 16 × 16 override placed last. */

/* 2026-07-12 — authoritative final alignment requested by user. */

/* Main sidebar uses exactly the same interaction model as Settings sidebar. */
html body .cases-sidebar .sidebar-nav .nav-item {
  min-height: 46px !important;
  height: 46px !important;
  padding: 0 12px !important;
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  border: 0 !important;
  border-radius: 12px !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
html body .cases-sidebar .sidebar-nav .nav-item:hover,
html body .cases-sidebar .sidebar-nav .nav-item:focus-visible {
  background: rgba(116, 92, 160, 0.08) !important;
}
html body .cases-sidebar .sidebar-nav .nav-item.active {
  background: rgba(116, 92, 160, 0.14) !important;
  color: #4f3e72 !important;
}
html body .cases-sidebar .sidebar-nav .nav-icon,
html body .cases-sidebar .sidebar-nav .nav-item:hover .nav-icon,
html body .cases-sidebar .sidebar-nav .nav-item:focus-visible .nav-icon,
html body .cases-sidebar .sidebar-nav .nav-item:active .nav-icon,
html body .cases-sidebar .sidebar-nav .nav-item.active .nav-icon {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: inherit !important;
  filter: none !important;
}
html body .cases-sidebar .sidebar-nav .nav-icon svg {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  stroke: currentColor !important;
  fill: none !important;
}

/* Both New Card and Settings use one identical circular-plus button. */
html body .settings-content .reference-add-row > button.add-action{
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  align-self: center !important;
  border: 1px solid rgba(217, 119, 6, .34) !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, rgba(255, 251, 235, 1), rgba(254, 243, 199, .82)) !important;
  color: #d4a017 !important;
  box-shadow: none !important;
  line-height: 1 !important;
}
html body .settings-content .reference-add-row > button.add-action:hover,
html body .settings-content .reference-add-row > button.add-action:focus-visible{
  border-color: rgba(217, 119, 6, .44) !important;
  background: linear-gradient(180deg, rgba(254, 243, 199, 1), rgba(253, 230, 138, .90)) !important;
  transform: none !important;
}
html body .settings-content .reference-add-row {
  grid-template-columns: minmax(0, 1fr) 38px !important;
  align-items: end !important;
}

/* New Card fields and visible frames exactly follow Settings 9px rounding. */
html body .cases-editor-panel input,
html body .cases-editor-panel select,
html body .cases-editor-panel textarea,
html body .cases-editor-panel .date-entry,
html body .cases-editor-panel .form-section,
html body .cases-editor-panel .cases-card,
html body .cases-editor-panel .line-row,
html body .cases-editor-panel .cases-object-row,
html body .cases-editor-panel .cases-registration-row,
html body .cases-editor-panel .line-list,
html body .cases-editor-panel .table-wrap{
  border-radius: 9px !important;
}

/* Window traffic-light pictograms: 12 × 12. */


/* 2026-07-12 — authoritative correction: exact sidebar parity and card controls. */

/* Main sidebar rows use the exact same geometry and state styling as Settings rows. */
html body .cases-sidebar .cases-sidebar-nav .nav-item {
  width: 100% !important;
  min-height: 44px !important;
  height: auto !important;
  padding: 6px 10px !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  justify-items: start !important;
  border: 0 !important;
  border-radius: 11px !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  transform: none !important;
}
html body .cases-sidebar .cases-sidebar-nav .nav-item:hover,
html body .cases-sidebar .cases-sidebar-nav .nav-item:focus-visible {
  background: rgba(116, 92, 160, 0.08) !important;
}
html body .cases-sidebar .cases-sidebar-nav .nav-item.active {
  background: rgba(116, 92, 160, 0.14) !important;
  color: #4f3e72 !important;
}
html body .cases-sidebar .cases-sidebar-nav .nav-icon,
html body .cases-sidebar .cases-sidebar-nav .nav-item:hover .nav-icon,
html body .cases-sidebar .cases-sidebar-nav .nav-item:focus-visible .nav-icon,
html body .cases-sidebar .cases-sidebar-nav .nav-item:active .nav-icon,
html body .cases-sidebar .cases-sidebar-nav .nav-item.active .nav-icon {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}
html body .cases-sidebar .cases-sidebar-nav .nav-icon svg {
  width: 24px !important;
  height: 24px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
}

/* Restore the New Card plus exactly to its original icon-only form. */




/* Settings plus is now the same untouched New Card plus. */
html body .settings-content .reference-add-row {
  grid-template-columns: minmax(0, 1fr) 24px !important;
  align-items: end !important;
}
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn,
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn:hover,
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn:focus,
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn:focus-visible,
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn:active {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: end !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  color: #d4a017 !important;
}
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn::before,
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn::after {
  content: none !important;
  display: none !important;
}
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn svg,
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn .button-icon,
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn .button-icon svg {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  display: block !important;
  stroke-width: 2 !important;
}

/* New Card blocks and internal fields use the same radius token as Settings pages. */
html body .cases-editor-panel .form-section,
html body .cases-editor-panel .cases-card,
html body .cases-editor-panel .line-row,
html body .cases-editor-panel .cases-object-row,
html body .cases-editor-panel .cases-registration-row,
html body .cases-editor-panel input,
html body .cases-editor-panel select,
html body .cases-editor-panel textarea,
html body .cases-editor-panel .date-entry,
html body .cases-editor-panel .line-list{
  border-radius: var(--radius-sm) !important;
}

/* Window traffic-light glyphs: 12 × 12. */

/* 2026-07-12 — compact titlebar controls and exact action alignment. */
/* Restore the original compact traffic-light geometry, including the 20px control box. */

/* Card header delete/save buttons and repeat-section add buttons share one 24px control system. */
html body .cases-editor-panel .editor-header-actions > button.icon-action,
html body .cases-editor-panel .editor-header-actions > button.editor-delete-action,
html body .cases-editor-panel .editor-header-actions > button.editor-save-action{
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
html body .cases-editor-panel .editor-header-actions > button.editor-delete-action > svg,
html body .cases-editor-panel .editor-header-actions > button.editor-save-action > svg{
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
}

/* Settings add control uses the same right inset as row delete controls. */
html body .settings-content .reference-add-row {
  padding-right: 6px !important;
  box-sizing: border-box !important;
}
html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn {
  justify-self: end !important;
  margin-right: 0 !important;
}

/* 2026-07-12 — window traffic-light pictograms: 4 CSS px ≈ 8 device px on Retina. */

/* 2026-07-12 — one 24 × 24 system for add/delete actions in Card and Settings. */
html body .cases-editor-panel .add-action,
html body .cases-editor-panel .delete-action,
html body .settings-content .add-reference,
html body .settings-content .delete-reference,
html body .settings-content .delete-backup {
  box-sizing: border-box !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
}

html body .cases-editor-panel .add-action svg,
html body .cases-editor-panel .delete-action svg,
html body .settings-content .add-reference .button-icon,
html body .settings-content .add-reference .button-icon svg,
html body .settings-content .delete-reference .button-icon,
html body .settings-content .delete-reference .button-icon svg,
html body .settings-content .delete-backup .button-icon,
html body .settings-content .delete-backup .button-icon svg {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
}

html body .settings-content .reference-add-row {
  grid-template-columns: minmax(0, 1fr) 24px !important;
  /* Match list rows: 1px border + 6px right padding = 7px. */
  padding-right: 7px !important;
  box-sizing: border-box !important;
}

html body .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn {
  align-self: end !important;
  justify-self: end !important;
  /* Center the 24px action against the 34px input. */
  transform: translateY(-5px) !important;
}

/* Beat the legacy 34px Settings rule with the runtime structure's exact selectors. */
html body .settings-content .settings-item > button.settings-action-btn.delete-reference,
html body .settings-content td > button.settings-action-btn.delete-backup {
  box-sizing: border-box !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
}

/* Entry and saved-value fields share one exact outer geometry. */
html body .settings-content .reference-add-row input,
html body .settings-content .settings-list .settings-item {
  box-sizing: border-box !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-radius: var(--radius-sm) !important;
}

/* Entry-to-first-row spacing equals the spacing between saved rows. */
html body .settings-content .reference-add-row {
  margin-bottom: 10px !important;
}

html body .settings-content .settings-list,
html body .settings-content .settings-list-expanded {
  gap: 10px !important;
  row-gap: 10px !important;
}

/* Reference panels end at the last saved row and grow by one row per new item. */
html body .settings-content .reference-block.settings-single-panel {
  height: auto !important;
  min-height: 0 !important;
  max-height: 100% !important;
  align-self: start !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

html body .settings-content .reference-block .settings-list,
html body .settings-content .reference-block .settings-list-expanded {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  align-content: start !important;
  padding-bottom: 2px !important;
  scroll-padding-bottom: 2px !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html body .settings-content .reference-block .settings-list::-webkit-scrollbar,
html body .settings-content .reference-block .settings-list-expanded::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* Municipality rows: employee assignment sits immediately before delete. */
html body .settings-content .municipality-settings-item {
  grid-template-columns: minmax(0, 1fr) auto !important;
}

html body .settings-content .settings-item-actions {
  min-height: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
}







/* Shared-design employee assignment popover. */
html body .municipality-employee-popover {
  position: fixed;
  z-index: 1200;
  box-sizing: border-box;
  width: min(320px, calc(100vw - 24px));
  padding: 16px;
  display: grid;
  gap: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  color: var(--ink);
  background: rgba(255, 255, 255, .98);
  box-shadow: var(--shadow-card);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}



















/* 2026-07-12 — every main page starts on the New Card information-frame line. */
html body .cases-main .cases-page-root:not(:has(.cases-editor-panel)) {
  position: relative !important;
  box-sizing: border-box !important;
  padding-top: 46px !important;
}

/* Header actions occupy the reserved 46px lane without pushing page content lower. */
html body .cases-main .cases-page-root:not(:has(.cases-editor-panel)) > .page-action-strip,
html body .cases-main .cases-page-root:not(:has(.cases-editor-panel)) > .cases-page-action-strip {
  position: absolute !important;
  top: 0 !important;
  right: 16px !important;
  left: 2px !important;
  z-index: 5 !important;
  box-sizing: border-box !important;
  width: auto !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 4px !important;
}

/* Settings sidebar titles use the exact main-sidebar row and label geometry. */
html body .settings-sidebar .settings-nav-item {
  width: 100% !important;
  min-height: 44px !important;
  height: auto !important;
  padding: 6px 10px !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  justify-items: start !important;
  border-radius: 11px !important;
}






/* Cases About page — mirrors the Pactum About composition and card language. */

html body .settings-content:has(.cases-about-page)::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

html body .cases-about-page {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 0 0 12px;
}








html body .cases-about-page .about-info-card{
  min-width: 0;
  border-radius: var(--radius-lg);
  padding: 15px 16px;
}











html body .cases-about-page .about-info-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr);
  gap: 10px;
  margin: 0;
}

html body .cases-about-page .about-info-card {
  min-height: 132px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}





html body .cases-about-page .about-info-card p {
  margin: 0;
  color: var(--v2-ink);
  font-size: var(--type-body);
  line-height: 1.45;
}

html body .cases-about-page .about-tech-card dl {
  margin: 0;
  display: grid;
  gap: 6px;
}

html body .cases-about-page .about-tech-card dl > div {
  min-height: 30px;
  padding: 5px 9px;
  display: grid;
  grid-template-columns: minmax(110px, .85fr) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  border-radius: var(--radius-sm);
  background: rgba(241, 245, 249, .72);
}



html body .cases-about-page .about-footer {
  min-height: 32px;
  padding: 2px 4px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-size: var(--type-caption);
}

html body .cases-about-page .about-footer > div {
  display: flex;
  align-items: center;
  gap: 14px;
}










@media (max-width: 1180px) {
  
  html body .cases-about-page .about-info-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  
  html body .cases-about-page .about-footer,
  html body .cases-about-page .about-footer > div { align-items: flex-start; flex-direction: column; }
}

/* Frameless, fully transparent Backup table. */


/* Compact symmetric About cards: icon and title only. */






html body .cases-about-page .about-info-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}


html body .cases-about-page .about-info-card:not(.about-tech-card) {
  justify-content: center !important;
}


@media (max-width: 1180px) {
  html body .cases-about-page .about-info-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  html body .cases-about-page .about-info-grid{
    grid-template-columns: 1fr !important;
  }
}

/* FINAL About simplification: transparent cards and one full-width technical block. */

html body .cases-about-page .about-info-grid {
  grid-template-columns: minmax(0, 1fr) !important;
}


/* FINAL About footer/icon alignment — authoritative last override. */
html body .cases-about-page > .about-footer > span:last-child:not(:first-child) {
  margin-left: auto !important;
  text-align: right !important;
}


/* FINAL report alignment — authoritative last override. */
html body .cases-main .cases-page-root > #reportPanel.report-builder-page {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  overflow: hidden !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}


html body .cases-main .report-action-strip .report-source-select {
  box-sizing: border-box !important;
  width: 190px !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 10px !important;
}
html body .cases-main .report-action-strip #exportReportExcel.report-excel-action,
html body .cases-main .report-action-strip #exportReportExcel.report-excel-action:hover,
html body .cases-main .report-action-strip #exportReportExcel.report-excel-action:focus-visible {
  box-sizing: border-box !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/* FINAL report field-only layout: full-width card and all 17 fields visible. */



html body .cases-main #reportPanel .report-field-card,
html body .cases-main #reportPanel .report-unified-field-card {
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

html body .cases-main #reportPanel .report-field-catalog,
html body .cases-main #reportPanel .report-unified-field-catalog,
html body .cases-main #reportPanel .report-unified-list {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

html body .cases-main .report-action-strip .report-source-select,
html body .cases-editor-panel select {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Restore the original automatic height; stretch the frame horizontally like New Card blocks. */
html body .cases-main #reportPanel .report-field-card.report-unified-field-card {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  grid-column: 1 / -1 !important;
  justify-self: stretch !important;
  align-self: start !important;
}



html body .cases-main #reportPanel .report-unified-list,
html body .cases-main #reportPanel .report-unified-row {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
}



/* Screenshot-verified parity: Report ended 22px before New Card on the right. */
html body .cases-main .cases-page-root > #reportPanel.report-builder-page {
  width: calc(100% + 22px) !important;
  min-width: calc(100% + 22px) !important;
  max-width: calc(100% + 22px) !important;
  margin-right: -22px !important;
}



/* New Card right inset = 22px main padding + 16px page-root padding = 38px. */
html body .cases-main .cases-page-root > #reportPanel.report-builder-page,
html body .cases-main #reportPanel .report-field-card.report-unified-field-card{
  position: relative !important;
  right: auto !important;
  left: 0 !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
}


/* FINAL DOM-measured correction: 16px total makes the Report and New Card right gaps equal. */
html body .cases-main .cases-page-root > #reportPanel.report-builder-page {
  width: calc(100% + 16px) !important;
  min-width: calc(100% + 16px) !important;
  max-width: calc(100% + 16px) !important;
  margin-right: -16px !important;
}

/* Settings pages without page titles: input/list begin immediately at the panel top. */
html body .settings-content .reference-block.settings-single-panel {
  grid-template-rows: auto minmax(0, 1fr) !important;
}



/* Align Report dropdown/Excel with the New Card save action's measured right axis. */

html body .cases-main .report-action-strip .report-source-select,
html body .cases-main .report-action-strip .report-source-select option {
  text-align: center !important;
  text-align-last: center !important;
}

/* FINAL universal page symmetry: 22px main padding + 2px page inset on both sides. */
html body .cases-main .cases-page-root {
  box-sizing: border-box !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
}


/* Remove Report-only width compensation; every page now follows the shared inset. */
html body .cases-main .cases-page-root > #reportPanel.report-builder-page {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Remove the legacy Report panel's computed 16px right padding. */

/* About card titles match the 14px sidebar title size. */


/* Keep the original control hit area; only the pictograms are halved. */
html body .window-controls button,
html body .window-controls button[type="button"] {
  box-sizing: border-box !important;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  flex: 0 0 20px !important;
  padding: 0 !important;
  border-radius: 7px !important;
}


/* Window-control pictograms: 12 × 12px with proportional stroke. */
html body .titlebar .window-controls button#winMin > svg.traffic-icon,
html body .titlebar .window-controls button#winClose > svg.traffic-icon {
  width: 12px !important;
  min-width: 12px !important;
  max-width: 12px !important;
  height: 12px !important;
  min-height: 12px !important;
  max-height: 12px !important;
  flex: 0 0 12px !important;
  stroke-width: 1.43px !important;
}

/* Add/delete parity in New Card repeat blocks and Settings reference rows. */
html body .cases-main .cases-repeat-section .remove-object-row svg,
html body .cases-main .cases-repeat-section .remove-registration svg,
html body .settings-content .settings-item-actions .delete-reference .button-icon,
html body .settings-content .settings-item-actions .delete-reference .button-icon svg,
html body .settings-content .settings-item-actions .delete-reference > svg {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
  stroke-width: 2px !important;
}

/* Natural axis alignment: no per-button translation. */
html body .settings-content .settings-item-actions .delete-reference,
html body .settings-content .settings-item-actions .delete-reference:hover,
html body .settings-content .settings-item-actions .delete-reference:focus-visible {
  transform: none !important;
}

/* Delete was inset by the list's legacy 2px right padding; remove it at the source. */
html body .settings-content .reference-block .settings-list,
html body .settings-content .reference-block .settings-list-expanded {
  padding-right: 0 !important;
}

/* Municipality employee assignment matches Settings add/delete geometry. */




/* Bottom breathing room keeps the last Municipality row fully visible while scrolling. */
html body .settings-content .reference-block .settings-list,
html body .settings-content .reference-block .settings-list-expanded {
  box-sizing: border-box !important;
  padding-bottom: 8px !important;
  scroll-padding-bottom: 8px !important;
}

html body .settings-content .reference-block .settings-list::after,
html body .settings-content .reference-block .settings-list-expanded::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  min-height: 2px;
}

/* An 18px delete action uses an 18px lane, eliminating the measured 3px inset. */
html body .cases-main .cases-object-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 2.35fr) minmax(0, 1.35fr) minmax(0, 1.8fr) 18px !important;
}

html body .cases-main .cases-registration-row {
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr) 18px !important;
}

/* Every in-page add pictogram uses the same blue. */
html body .cases-main .add-action,
html body .cases-main .add-action:hover,
html body .cases-main .add-action:focus-visible,
html body .cases-main .add-action:active {
  color: #2563eb !important;
}

/* Minimal Excel export action: same geometry as Save, quiet Excel-green glyph. */
html body .cases-main .report-action-strip #exportReportExcel.report-excel-action {
  color: #15803d !important;
}

html body .cases-main .report-action-strip #exportReportExcel.report-excel-action:hover,
html body .cases-main .report-action-strip #exportReportExcel.report-excel-action:focus-visible {
  color: #047857 !important;
  background: transparent !important;
}

/* Runtime parity with Save: both action containers are exactly 38 × 34px. */
html body .cases-main .report-action-strip #exportReportExcel.report-excel-action,
html body .cases-main .report-action-strip #exportReportExcel.report-excel-action:hover,
html body .cases-main .report-action-strip #exportReportExcel.report-excel-action:focus-visible {
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  flex: 0 0 38px !important;
}

/* 2026-07-12 — keep the Settings navigation at its established full-row geometry. */

html body .cases-main .settings-sidebar .settings-nav-icon,
html body .cases-main .settings-sidebar .settings-nav-icon svg {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 24px !important;
}

/* Calendar actions belong to the same 18 × 18 in-page pictogram system. */
html body .cases-main .cases-editor-panel button.date-picker-button,
html body .cases-main .cases-editor-panel button.date-picker-button:hover,
html body .cases-main .cases-editor-panel button.date-picker-button:focus,
html body .cases-main .cases-editor-panel button.date-picker-button:active,
html body .cases-main .cases-editor-panel button.date-picker-button svg {
  box-sizing: border-box !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  flex: 0 0 18px !important;
  padding: 0 !important;
}

/* Reference blocks use the panel's 20px padding equally above the first and below the last field. */
html body .settings-content .reference-block.settings-single-panel {
  padding-top: 20px !important;
  /* 43px + the 1px panel border matches the measured 43.875px top distance. */
  padding-bottom: 43px !important;
}

html body .settings-content .reference-block .settings-list,
html body .settings-content .reference-block .settings-list-expanded {
  padding-bottom: 0 !important;
  scroll-padding-bottom: 0 !important;
}

html body .settings-content .reference-block .settings-list::after,
html body .settings-content .reference-block .settings-list-expanded::after {
  content: none !important;
  display: none !important;
}

/* Match the lower edge to the measured 21px gap from the upper edge to the label text. */
html body .settings-content .reference-block.settings-single-panel {
  padding-bottom: 20px !important;
}

/* Blue is the final color for every add pictogram, including legacy high-specificity rules. */
html body .cases-main .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn,
html body .cases-main .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn:hover,
html body .cases-main .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn:focus-visible,
html body .cases-main .settings-content .reference-add-row > button.add-reference.add-action.settings-action-btn svg{
  color: #2563eb !important;
  stroke: currentColor !important;
}

/* The long Municipality list keeps its final row clear of the scroll viewport edge. */
html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list,
html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list-expanded {
  box-sizing: border-box !important;
  padding-bottom: 10px !important;
  scroll-padding-bottom: 10px !important;
}

html body .settings-content .reference-block.settings-single-panel:has(.municipality-settings-item) {
  padding-bottom: 10px !important;
}

/* Align Settings-sidebar rows to the exact horizontal lanes of the main sidebar. */


/* Active and Archive: centered transparent case tables. */
html body .cases-main .case-list-page {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  height: calc(100vh - 118px) !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 12px !important;
  overflow: hidden !important;
}





html body .cases-main .cases-table-wrap {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 100% !important;
  max-height: none !important;
  padding: 0 0 12px !important;
  overflow: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  scroll-padding-bottom: 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .cases-main .cases-table-wrap::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

html body .cases-main .cases-table {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: transparent !important;
}

html body .cases-main .cases-table :where(thead, tbody, tr, th, td),
html body .cases-main .cases-table tr:hover td {
  background: transparent !important;
}

html body .cases-main .cases-table th,
html body .cases-main .cases-table td {
  box-sizing: border-box !important;
  padding: 10px 6px !important;
  text-align: center !important;
  vertical-align: middle !important;
  border-left: 0 !important;
  border-right: 0 !important;
}


html body .cases-main .cases-table th:nth-child(1), html body .cases-main .cases-table td:nth-child(1),
html body .cases-main .cases-table th:nth-child(2), html body .cases-main .cases-table td:nth-child(2),
html body .cases-main .cases-table th:nth-child(7), html body .cases-main .cases-table td:nth-child(7),
html body .cases-main .cases-table th:nth-child(9), html body .cases-main .cases-table td:nth-child(9),
html body .cases-main .cases-table th:nth-child(10), html body .cases-main .cases-table td:nth-child(10) { width: 10% !important; }




html body .cases-main :is(.cases-table, .report-preview-table) .status-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 100% !important;
  padding: 4px 8px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  white-space: normal !important;
  line-height: 1.2 !important;
}







/* Case-table refinement: framed at the common page line, with the search in the action lane. */

html body .cases-main .case-table-search {
  display: block !important;
  width: 220px !important;
  max-width: 220px !important;
  margin: 0 !important;
  transform: translateX(1px) !important;
}

html body .cases-main .case-table-search > span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
}

html body .cases-main .case-table-search > input {
  box-sizing: border-box !important;
  width: 220px !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  text-align: center !important;
  border-radius: 17px !important;
  background: transparent !important;
}

html body .cases-main .case-list-page {
  height: 100% !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 0 !important;
}

html body .cases-main .cases-table-wrap {
  height: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  background: transparent !important;
}

html body .cases-main .cases-table {
  height: 100% !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

html body .cases-main .cases-table thead,
html body .cases-main .cases-table tbody {
  display: block !important;
  width: 100% !important;
}

html body .cases-main .cases-table thead {
  position: relative !important;
  z-index: 2 !important;
  border-bottom: 1px solid var(--line) !important;
  background: transparent !important;
}

html body .cases-main .cases-table tbody {
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-bottom: 12px !important;
  scroll-padding-bottom: 12px !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}



/* Case list pages: keep Note as the final column after outgoing date. */


html body .cases-main .cases-table th:nth-child(11),
html body .cases-main .cases-table td:nth-child(11) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 40px !important;
  padding: 10px 6px !important;
  white-space: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: center !important;
  line-height: 1.25 !important;
}

/* Case list pages: final 11-column layout. Note is the last column after outgoing date. */


html body .cases-main .cases-table th:nth-child(11),
html body .cases-main .cases-table td:nth-child(11),
html body .cases-main .cases-table td.case-note-cell {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 10px 6px !important;
  white-space: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: center !important;
  line-height: 1.25 !important;
}

html body .cases-main .cases-table td.case-note-cell > span {
  display: block !important;
  width: 100% !important;
  max-height: 3.75em !important;
  overflow: hidden !important;
  line-height: 1.25 !important;
}

/* Case tables include a final Note column. */
html body .cases-main .cases-table thead tr,
html body .cases-main .cases-table tbody tr {
  grid-template-columns: 7.4fr 8.5fr 8.5fr 10fr 10.5fr 13fr 8.5fr 8.5fr 7.5fr 7.5fr 10.1fr !important;
}


html body .cases-main .cases-table thead tr,
html body .cases-main .cases-table tbody tr {
  display: table !important;
  width: 100% !important;
  table-layout: fixed !important;
}

html body .cases-main .cases-table th {
  position: static !important;
  top: auto !important;
  background: transparent !important;
}

html body .cases-main .cases-table th:nth-child(1), html body .cases-main .cases-table td:nth-child(1),
html body .cases-main .cases-table th:nth-child(2), html body .cases-main .cases-table td:nth-child(2),
html body .cases-main .cases-table th:nth-child(3), html body .cases-main .cases-table td:nth-child(3),
html body .cases-main .cases-table th:nth-child(6), html body .cases-main .cases-table td:nth-child(6),
html body .cases-main .cases-table th:nth-child(7), html body .cases-main .cases-table td:nth-child(7) { width: 11% !important; }



/* Keep the compact search geometry while drawing its complete outline inside the control. */
html body .cases-main .case-table-search > input,
html body .cases-main .case-table-search > input:hover {
  -webkit-appearance: none !important;
  appearance: none !important;
  border-color: transparent !important;
  box-shadow: inset 0 0 0 1px #cfddea !important;
}

html body .cases-main .case-table-search > input:focus,
html body .cases-main .case-table-search > input:focus-visible {
  border-color: transparent !important;
  outline: 0 !important;
  box-shadow: inset 0 0 0 1px var(--primary), 0 0 0 3px rgba(2, 132, 199, .10) !important;
}

html body .cases-main .cases-table th {
  font-weight: 400 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* Ten fully visible columns at one unified 9px type size. */

html body .cases-main .cases-table th,
html body .cases-main .cases-table td {
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
}

/* Measured minimums for numbers/dates; reclaimed width goes to descriptive fields. */
html body .cases-main .cases-table th:nth-child(1), html body .cases-main .cases-table td:nth-child(1) { width: 8.2% !important; }
html body .cases-main .cases-table th:nth-child(2), html body .cases-main .cases-table td:nth-child(2) { width: 9.4% !important; white-space: nowrap !important; }


/* Every status badge uses the longest current status as one fixed visual width. */
html body .cases-main :is(.cases-table, .report-preview-table) .status-pill {
  box-sizing: border-box !important;
  width: 92px !important;
  min-width: 92px !important;
  max-width: 92px !important;
  white-space: nowrap !important;
}

html body .cases-main :is(.cases-table, .report-preview-table) .case-status-link {
  margin: 0 !important;
  font-family: inherit !important;
  text-align: center !important;
  cursor: pointer !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html body .cases-main :is(.cases-table, .report-preview-table) .case-status-link:focus-visible {
  outline: 2px solid rgba(2, 132, 199, .45) !important;
  outline-offset: 2px !important;
}

/* Settings content frames align to the New Card frame start; the Settings sidebar keeps its own lane. */
html body .cases-main .cases-page-root:has(.settings-layout),
html body .cases-main .cases-page-root:has(.settings-layout) > .settings-layout {
  overflow: visible !important;
}

html body .cases-main .settings-layout > .settings-content {
  margin-top: -14px !important;
  height: calc(100% + 14px) !important;
  padding-top: 0 !important;
}

html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list,
html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list-expanded {
  padding-bottom: 26px !important;
  scroll-padding-bottom: 26px !important;
}

html body .settings-content .reference-block.settings-single-panel:has(.municipality-settings-item) {
  padding-bottom: 20px !important;
}

/* Home dashboard: one-line summary cards and mobile-group status matrix. */
html body .cases-main .home-summary-grid {
  display: grid !important;
  grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 10px !important;
  min-width: 0 !important;
}

html body .cases-main .home-summary-card {
  box-sizing: border-box !important;
  min-width: 0 !important;
  height: 86px !important;
  min-height: 86px !important;
  max-height: 86px !important;
  padding: 12px 10px !important;
  display: grid !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 8px !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-sm) !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
}

html body .cases-main .home-summary-card > span {
  min-width: 0 !important;
  max-width: 100% !important;
  color: var(--muted) !important;
  font-size: var(--type-caption) !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

html body .cases-main .home-count-button,
html body .cases-main .home-table-count {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--primary-strong) !important;
  font: inherit !important;
  font-variant-numeric: tabular-nums !important;
  cursor: pointer !important;
}



html body .cases-main .home-count-button:hover,
html body .cases-main .home-count-button:focus-visible,
html body .cases-main .home-table-count:hover,
html body .cases-main .home-table-count:focus-visible {
  color: var(--primary) !important;
  text-decoration: underline !important;
  outline: 0 !important;
}



html body .cases-main .home-mobile-table-wrap::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

html body .cases-main .home-mobile-table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  table-layout: fixed !important;
}

html body .cases-main .home-mobile-table th,
html body .cases-main .home-mobile-table td {
  padding: 9px 8px !important;
  text-align: center !important;
  vertical-align: middle !important;
  border-bottom: 1px solid var(--line) !important;
  white-space: nowrap !important;
}

html body .cases-main .home-mobile-table th:first-child,
html body .cases-main .home-mobile-table td:first-child {
  width: 28% !important;
  text-align: left !important;
}








/* Home final alignment: summary cards and matrix columns share one 7-column grid. */


html body .cases-main .home-summary-card {
  height: 104px !important;
  min-height: 104px !important;
  max-height: 104px !important;
  padding: 14px 10px !important;
  border-color: rgba(148, 163, 184, .52) !important;
}

html body .cases-main .home-summary-card[data-summary-key="active"] {
  color: #7c3aed !important;
  background: rgba(245, 243, 255, .72) !important;
  border-color: rgba(196, 181, 253, .74) !important;
}

html body .cases-main .home-summary-card[data-summary-key="current"] {
  color: #b91c1c !important;
  background: rgba(254, 226, 226, .55) !important;
  border-color: rgba(252, 165, 165, .72) !important;
}

html body .cases-main .home-summary-card[data-summary-key="investigation"] {
  color: #92400e !important;
  background: rgba(254, 243, 199, .62) !important;
  border-color: rgba(252, 211, 77, .74) !important;
}

html body .cases-main .home-summary-card[data-summary-key="registration"] {
  color: #1d4ed8 !important;
  background: rgba(219, 234, 254, .62) !important;
  border-color: rgba(147, 197, 253, .74) !important;
}

html body .cases-main .home-summary-card[data-summary-key="signing"] {
  color: #0f766e !important;
  background: rgba(204, 251, 241, .42) !important;
  border-color: rgba(45, 212, 191, .62) !important;
}

html body .cases-main .home-summary-card[data-summary-key="archive"] {
  color: #15803d !important;
  background: rgba(220, 252, 231, .58) !important;
  border-color: rgba(134, 239, 172, .74) !important;
}

html body .cases-main .home-summary-card[data-summary-key="all"] {
  color: #0369a1 !important;
  background: rgba(224, 242, 254, .66) !important;
  border-color: rgba(125, 211, 252, .82) !important;
}

html body .cases-main .home-summary-card > span {
  color: currentColor !important;
}

html body .cases-main .home-summary-card .home-count-button {
  color: currentColor !important;
}




html body .cases-main .home-mobile-table :where(thead, tbody, tr, th, td) {
  background: transparent !important;
}


html body .cases-main .home-mobile-table th:first-child,
html body .cases-main .home-mobile-table td:first-child {
  width: calc(100% / 7) !important;
  text-align: left !important;
}



/* Match Home table columns to the summary-card grid exactly, including the 8px gutters. */
html body .cases-main .home-mobile-table-wrap {
  border: 0 !important;
  border-radius: 0 !important;
}

html body .cases-main .home-mobile-table {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
}

html body .cases-main .home-mobile-table thead,
html body .cases-main .home-mobile-table tbody {
  display: grid !important;
  width: 100% !important;
}

html body .cases-main .home-mobile-table tr {
  display: grid !important;
  grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
}

html body .cases-main .home-mobile-table th,
html body .cases-main .home-mobile-table td,
html body .cases-main .home-mobile-table th:first-child,
html body .cases-main .home-mobile-table td:first-child {
  width: auto !important;
  min-width: 0 !important;
}

/* Shared table rhythm: case lists use the same separated fields as the Home matrix. */
html body .cases-main .cases-table thead tr,
html body .cases-main .cases-table tbody tr {
  display: grid !important;
  grid-template-columns: 8.2fr 9.4fr 9.8fr 11.5fr 11.8fr 15.5fr 9.1fr 9.2fr 8.1fr 7.4fr !important;
  gap: 8px !important;
  width: 100% !important;
  table-layout: auto !important;
}

html body .cases-main .cases-table th,
html body .cases-main .cases-table td,
html body .cases-main .cases-table th:nth-child(n),
html body .cases-main .cases-table td:nth-child(n) {
  width: auto !important;
  min-width: 0 !important;
}

html body .cases-main .cases-table th,
html body .cases-main .cases-table td {
  background: transparent !important;
  font-variant-numeric: tabular-nums !important;
}


html body .cases-main .cases-table td.empty-state {
  grid-column: 1 / -1 !important;
}

/* Home matrix typography: a touch larger while preserving the fixed column grid. */






/* Case tables: vertically centered cells and two-line-height headers. */
html body .cases-main .cases-table th,
html body .cases-main .cases-table td {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 40px !important;
  line-height: 1.25 !important;
}


html body .cases-main .cases-table td.empty-state {
  justify-content: center !important;
}

/* Editor value states: filled controls turn green; status keeps its semantic color. */
html body .cases-main .cases-editor-panel :is(input, select, textarea).has-value:not(#statusId),
html body .cases-main .cases-editor-panel :is(input, select, textarea).has-value:not(#statusId):-webkit-autofill,
html body .cases-main .cases-editor-panel :is(input, select, textarea).has-value:not(#statusId):-webkit-autofill:hover,
html body .cases-main .cases-editor-panel :is(input, select, textarea).has-value:not(#statusId):-webkit-autofill:focus {
  border-color: rgba(34, 197, 94, .58) !important;
  background: rgba(220, 252, 231, .52) !important;
  background-color: rgba(220, 252, 231, .52) !important;
  box-shadow: inset 0 0 0 9999px rgba(220, 252, 231, .52) !important;
  -webkit-text-fill-color: var(--ink) !important;
}

html body .cases-main .cases-editor-panel #statusId.has-value {
  font-weight: 500 !important;
  background-image: none !important;
}

html body .cases-main .cases-editor-panel .date-entry {
  grid-template-columns: minmax(112px, 1fr) 34px !important;
  gap: 8px !important;
  padding-right: 4px !important;
}

html body .cases-main .cases-editor-panel .date-picker-button {
  margin-right: 2px !important;
}

/* Case tables: status is now the leading column. */
html body .cases-main .cases-table thead tr,
html body .cases-main .cases-table tbody tr {
  grid-template-columns: 9.2fr 8.2fr 9.4fr 9.8fr 11.5fr 11.8fr 15.5fr 9.1fr 8.1fr 7.4fr !important;
}

html body .cases-main .cases-table th:nth-child(3),
html body .cases-main .cases-table td:nth-child(3),
html body .cases-main .cases-table th:nth-child(9),
html body .cases-main .cases-table td:nth-child(9) {
  white-space: nowrap !important;
}

html body .cases-main form#caseForm.cases-editor-panel input.has-value:not(.native-date-picker):not(#statusId),
html body .cases-main form#caseForm.cases-editor-panel select.has-value:not(#statusId),
html body .cases-main form#caseForm.cases-editor-panel textarea.has-value {
  border-color: rgba(34, 197, 94, .62) !important;
  background-color: rgba(220, 252, 231, .64) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 9999px rgba(220, 252, 231, .64) !important;
}

html body .cases-main form#caseForm.cases-editor-panel input.has-value:not(.native-date-picker):not(#statusId):focus,
html body .cases-main form#caseForm.cases-editor-panel select.has-value:not(#statusId):focus,
html body .cases-main form#caseForm.cases-editor-panel textarea.has-value:focus {
  border-color: rgba(22, 163, 74, .78) !important;
  box-shadow: inset 0 0 0 9999px rgba(220, 252, 231, .68), 0 0 0 3px rgba(34, 197, 94, .16) !important;
}

/* Final editor spacing: calendar actions sit away from the field edge; registration fields are equal. */
html body .cases-main .cases-editor-panel .date-entry {
  grid-template-columns: minmax(112px, 1fr) 48px !important;
  gap: 10px !important;
  padding-right: 12px !important;
}

html body .cases-main .cases-editor-panel .date-picker-button {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  margin-right: 0 !important;
  justify-self: start !important;
}


html body .cases-main .cases-editor-panel .date-entry:has(.date-text-input.has-value) .date-text-input {
  background: transparent !important;
  box-shadow: none !important;
}


html body .cases-main .cases-editor-panel .field-mobile-group #mobileGroup.has-value {
  background: transparent !important;
  box-shadow: inset 0 0 0 1px rgba(34, 197, 94, .62) !important;
}

html body .cases-main .cases-editor-panel button.date-picker-button,
html body .cases-main .cases-editor-panel button.date-picker-button:hover,
html body .cases-main .cases-editor-panel button.date-picker-button:focus,
html body .cases-main .cases-editor-panel button.date-picker-button:active {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  flex: 0 0 34px !important;
  justify-self: start !important;
}

html body .cases-main .cases-editor-panel button.date-picker-button svg {
  width: 17px !important;
  min-width: 17px !important;
  max-width: 17px !important;
  height: 17px !important;
  min-height: 17px !important;
  max-height: 17px !important;
  flex: 0 0 17px !important;
}

/* Authoritative date/mobile field states. Calendar button sits away from the right edge. */
html body .cases-main .cases-editor-panel .date-entry {
  position: relative !important;
  display: block !important;
  height: 38px !important;
  padding: 0 !important;
  overflow: visible !important;
}

html body .cases-main .cases-editor-panel .date-entry .date-text-input {
  width: 100% !important;
  height: 38px !important;
  padding-right: 68px !important;
}

html body .cases-main .cases-editor-panel .date-entry .date-picker-button,
html body .cases-main .cases-editor-panel .date-entry .date-picker-button:hover,
html body .cases-main .cases-editor-panel .date-entry .date-picker-button:focus,
html body .cases-main .cases-editor-panel .date-entry .date-picker-button:active {
  position: absolute !important;
  top: 50% !important;
  right: 18px !important;
  transform: translateY(-50%) !important;
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  margin: 0 !important;
}

html body .cases-main .cases-editor-panel .date-entry:has(.date-text-input.has-value),
html body .cases-main .cases-editor-panel .date-entry:has(.date-text-input.has-value) .date-text-input {
  border-color: rgba(34, 197, 94, .62) !important;
  background: rgba(220, 252, 231, .70) !important;
  background-color: rgba(220, 252, 231, .70) !important;
  box-shadow: inset 0 0 0 1px rgba(34, 197, 94, .62) !important;
}

html body .cases-main .cases-editor-panel .field-mobile-group #mobileGroup.has-value,
html body .cases-main .cases-editor-panel .field-mobile-group #mobileGroup.has-value[readonly] {
  border-color: rgba(34, 197, 94, .62) !important;
  background: rgba(220, 252, 231, .70) !important;
  background-color: rgba(220, 252, 231, .70) !important;
  box-shadow: inset 0 0 0 1px rgba(34, 197, 94, .62) !important;
}

html body .cases-main .cases-editor-panel input#mobileGroup.has-value[readonly],
html body .cases-main .cases-editor-panel input#mobileGroup.has-value[readonly]:focus,
html body .cases-main .cases-editor-panel input#mobileGroup.has-value[readonly]:hover {
  color: var(--ink) !important;
  border-color: rgba(34, 197, 94, .62) !important;
  background: rgba(220, 252, 231, .70) !important;
  background-color: rgba(220, 252, 231, .70) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 1px rgba(34, 197, 94, .62) !important;
}

html body .cases-main .cases-registration-row {
  grid-template-columns: repeat(3, minmax(0, 1fr)) 18px !important;
}


html body .cases-main .cases-registration-row input,
html body .cases-main .cases-registration-row .date-entry {
  width: 100% !important;
  min-width: 0 !important;
}

/* Final correction: green only the actual controls, without extra date frames or label tint. */

html body .cases-main .cases-editor-panel .field-mobile-group #mobileGroup.has-value,
html body .cases-main .cases-editor-panel input#mobileGroup.has-value[readonly],
html body .cases-main .cases-editor-panel input#mobileGroup.has-value[readonly]:focus,
html body .cases-main .cases-editor-panel input#mobileGroup.has-value[readonly]:hover {
  color: var(--ink) !important;
  border-color: rgba(34, 197, 94, .62) !important;
  background: rgba(220, 252, 231, .70) !important;
  background-color: rgba(220, 252, 231, .70) !important;
  background-image: none !important;
  box-shadow: none !important;
}


html body .cases-main .cases-editor-panel .date-entry:has(.date-text-input.has-value) .date-text-input {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}


html body .cases-main .cases-editor-panel .field-mobile-group:has(#mobileGroup.has-value) {
  position: relative !important;
}

html body .cases-main .cases-editor-panel .field-mobile-group #mobileGroup {
  position: relative !important;
  z-index: 1 !important;
}

html body .cases-main .cases-editor-panel .field-mobile-group #mobileGroup.has-value,
html body .cases-main .cases-editor-panel input#mobileGroup.has-value[readonly] {
  background: transparent !important;
  background-color: transparent !important;
}

/* Reference panels must not stretch to the full settings viewport. */
html body .settings-layout > .settings-content {
  overflow: visible !important;
}

html body .settings-content .reference-block.settings-single-panel {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  align-self: start !important;
  overflow: visible !important;
}

html body .settings-content .reference-block .settings-list,
html body .settings-content .reference-block .settings-list-expanded {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

html body .settings-content .reference-block.settings-single-panel:has(.municipality-settings-item) {
  height: auto !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
  padding-bottom: 20px !important;
}

html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list,
html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list-expanded {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-bottom: 26px !important;
  scroll-padding-bottom: 26px !important;
}

/* Settings content aligns to the same visual top line as the main sidebar first row. */
html body .cases-main .settings-layout > .settings-content {
  box-sizing: border-box !important;
  margin-top: 0 !important;
  height: 100% !important;
  padding-top: 36px !important;
}

/* Municipality is the long reference list; keep it scrollable and clear of the lower frame. */
html body .settings-content .reference-block.settings-single-panel:has(.municipality-settings-item) {
  display: block !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding-bottom: 20px !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-sm) !important;
  background-clip: padding-box !important;
}

html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list,
html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list-expanded {
  height: auto !important;
  min-height: 0 !important;
  /* 17 fully visible rows: 17 * 34px row + 16 * 10px gap. */
  max-height: 738px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-bottom: 0 !important;
  scroll-padding-bottom: 0 !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list::-webkit-scrollbar,
html body .settings-content .reference-block:has(.municipality-settings-item) .settings-list-expanded::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* Report aligns to the same visual top line as the main sidebar first row. */

html body .cases-main .cases-page-root:has(#reportPanel.report-builder-page) > .report-action-strip {
  top: 51px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  align-items: center !important;
}

html body .cases-main .cases-page-root:has(#reportPanel.report-builder-page) .report-action-strip .report-source-select,
html body .cases-main .cases-page-root:has(#reportPanel.report-builder-page) .report-action-strip #exportReportExcel.report-excel-action{
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
}

html body .cases-main .cases-page-root:has(#reportPanel.report-builder-page) .report-action-strip #exportReportExcel.report-excel-action {
  width: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  flex: 0 0 32px !important;
}

/* New Card: keep actions above, while the first frame starts at the 96px line. */
html body .cases-main .cases-page-root:has(.cases-editor-panel) {
  box-sizing: border-box !important;
  padding-top: 51px !important;
  grid-template-rows: 32px auto !important;
  gap: 13px !important;
}






html body .cases-main .home-overall-panel {
  display: grid !important;
  gap: 18px !important;
  min-width: 0 !important;
}







/* Case tables: remove the filter title and align search with the editor action inset. */



html body .cases-main .case-table-action-strip .page-actions {
  width: auto !important;
  flex: 0 0 auto !important;
}

html body .cases-main .case-table-search {
  transform: none !important;
}

/* Home statistics table: fixed 32px header and cell height. */

html body .cases-main .home-mobile-table thead {
  display: none !important;
}

html body .cases-main .home-mobile-table tbody td {
  vertical-align: middle !important;
  line-height: 1.2 !important;
}



html body .cases-main .home-mobile-table .home-table-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 64px !important;
}

/* Case list pages: keep the lower frame visible and leave room after the last row. */
html body .cases-main .case-list-page {
  height: calc(100vh - 132px) !important;
  min-height: 0 !important;
  overflow: visible !important;
}

html body .cases-main .cases-table-wrap {
  box-sizing: border-box !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  background: transparent !important;
}


html body .cases-main .cases-table tbody {
  box-sizing: border-box !important;
  padding-bottom: 0 !important;
  scroll-padding-bottom: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html body .cases-main .cases-table tbody::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* Case list pages: keep Note as the final column after outgoing date. */
html body .cases-main .cases-table thead tr,
html body .cases-main .cases-table tbody tr {
  grid-template-columns: 7.4fr 8.4fr 8.8fr 10.2fr 10.6fr 10.0fr 8.4fr 8.4fr 7.3fr 9.9fr 10.6fr !important;
}


html body .cases-main .cases-table td.case-note-cell > span {
  display: block !important;
  width: 100% !important;
  max-height: 3.75em !important;
  overflow: hidden !important;
  line-height: 1.25 !important;
  color: inherit !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
}

/* Home lower insights: compact overall and yearly statistics. */
html body .cases-main .home-overall-panel {
  display: grid !important;
  grid-template-columns: minmax(210px, .8fr) minmax(320px, 1.25fr) minmax(320px, 1.35fr) !important;
  gap: 12px !important;
  min-width: 0 !important;
}































/* Home fit: keep the full dashboard visible without page scrolling. */

html body .cases-main .cases-page-root:has(.home-summary-grid) > .home-summary-grid {
  margin-top: 82px !important;
}







html body .cases-main .home-mobile-table th,
html body .cases-main .home-mobile-table td,
html body .cases-main .home-mobile-table tbody td:first-child {
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-size: var(--type-caption) !important;
  line-height: 1.15 !important;
}



html body .cases-main .home-overall-panel {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
}





















/* Home final layout: restore top start and place lower statistics in two columns. */




html body .cases-main .home-overall-panel {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}





















/* Home final three-block layout: yearly cards, yearly mobile matrix, compact all-time stats. */

html body .cases-main .cases-page-root:has(.home-summary-grid) > .home-summary-grid {
  margin-top: 96px !important;
}






html body .cases-main .home-overall-panel {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
  min-height: 292px !important;
  max-height: 292px !important;
}

























/* Home final stats block: municipalities 12/12/10, right side matched to the same height. */



























/* Home stats spacing polish: larger readable fields and aligned bottoms. */
























/* Home stats final visual alignment from screenshot feedback. */
html body .cases-main .home-overall-panel {
  margin-top: -42px !important;
  min-height: 380px !important;
  max-height: 380px !important;
  align-items: stretch !important;
}





















/* Home final spacing: three auto-height blocks with equal gaps and aligned lower fields. */

html body .cases-main .home-overall-panel {
  margin-top: 0 !important;
  min-height: 354px !important;
  max-height: 354px !important;
  align-items: stretch !important;
}





















/* Home final request: summary cards match main sidebar row height; total block above years. */







/* Align right-column stats with municipality rows: years start at top, groups end at bottom. */










/* Home stats final: total block above years; municipality rows start aligned with 2020. */












/* Home numeric alignment: match matrix numbers to insight chips and right-align year totals. */
html body .cases-main .home-mobile-table .home-table-count {
  font-size: var(--type-caption) !important;
  line-height: 1.1 !important;
  font-weight: 600 !important;
}



/* Align the Years block title with the Zugdidi / Khoni / Kharagauli municipality row. */


/* Align the Mobile Groups block title with the Zestafoni / Tsalenjikha / Shuakhevi municipality row. */


/* Match Years and Mobile Groups field spacing to municipality fields. */


/* Exact row alignment for the lower right statistics column. */






















/* Final alignment: sub-block titles match field text size; mobile groups sits on its target row. */




/* Authoritative exact row map for the lower statistics block. */
















/* Final home lower-statistics row map.
   Left side: title + 12 municipality rows.
   Right side follows the same 13-row grid exactly. */





























/* Bottom total cards match the top summary-card structure and status colors. */














/* Lower statistics cleanup: chips are borderless; total cards keep their colored frames. */






/* Home non-card fields use one text color; summary and total cards keep their status colors. */
html body .cases-main .home-mobile-table,
html body .cases-main .home-mobile-table :is(th, td, span, button){
  color: #0f6094 !important;
}







/* Home lower statistics without subheadings: fields move one row up, leaving room for growth. */
















/* Final lower stats order: active, archive, all. Regular fields are no longer centered. */












/* Years and mobile-group ratings use only global columns 5 and 6; column 7 stays empty. */


/* Final lower-right layout: years in global columns 5/6, mobile groups in global column 7. */












/* Revised lower stats: no bottom total cards; years in column 4, groups in column 5. */










/* Home vertical guide lines continue the middle table rhythm into the lower block. */



html body .cases-main .home-overall-panel > * {
  position: relative !important;
  z-index: 1 !important;
}

/* Middle table horizontal rules stay detached from vertical separators. */

html body .cases-main .home-mobile-table tr {
  position: relative !important;
}

html body .cases-main .home-mobile-table thead tr::after,
html body .cases-main .home-mobile-table tbody tr::after {
  display: none !important;
  content: none !important;
}

/* One shared vertical guide layer keeps middle-table and lower-stat lines aligned. */

html body .cases-main .cases-page-root:has(.home-summary-grid)::before {
  display: none !important;
  content: none !important;
}

html body .cases-main .cases-page-root:has(.home-summary-grid) > * {
  position: relative !important;
  z-index: 1 !important;
}



html body .cases-main .home-mobile-panel {
  position: relative !important;
}

html body .cases-main .home-mobile-panel::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  background:
    linear-gradient(to bottom, rgba(186, 208, 225, .58), rgba(186, 208, 225, .58)) calc((100% - 48px) / 7 + 4px) 0 / 1px 100% no-repeat,
    linear-gradient(to bottom, rgba(186, 208, 225, .58), rgba(186, 208, 225, .58)) calc(((100% - 48px) / 7) * 2 + 12px) 0 / 1px 100% no-repeat,
    linear-gradient(to bottom, rgba(186, 208, 225, .58), rgba(186, 208, 225, .58)) calc(((100% - 48px) / 7) * 3 + 20px) 0 / 1px 100% no-repeat,
    linear-gradient(to bottom, rgba(186, 208, 225, .58), rgba(186, 208, 225, .58)) calc(((100% - 48px) / 7) * 4 + 28px) 0 / 1px 100% no-repeat,
    linear-gradient(to bottom, rgba(186, 208, 225, .58), rgba(186, 208, 225, .58)) calc(((100% - 48px) / 7) * 5 + 36px) 0 / 1px 100% no-repeat,
    linear-gradient(to bottom, rgba(186, 208, 225, .58), rgba(186, 208, 225, .58)) calc(((100% - 48px) / 7) * 6 + 44px) 0 / 1px 100% no-repeat !important;
}

html body .cases-main .home-mobile-panel > * {
  position: relative !important;
  z-index: 1 !important;
}



/* Home lower band: three equal, interactive bar charts. */
html body .cases-main .home-overall-panel.home-charts-panel {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 12px !important;
  width: 100% !important;
  height: 354px !important;
  min-height: 354px !important;
  max-height: 354px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

html body .cases-main .home-overall-panel.home-charts-panel::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

html body .cases-main .home-charts-panel .home-chart-card {
  box-sizing: border-box !important;
  display: grid !important;
  grid-column: auto !important;
  grid-row: auto !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 10px !important;
  min-width: 0 !important;
  width: 100% !important;
  height: 354px !important;
  min-height: 354px !important;
  max-height: 354px !important;
  margin: 0 !important;
  padding: 12px !important;
  overflow: hidden !important;
  border: 1px solid rgba(148, 163, 184, .42) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .22) !important;
  box-shadow: none !important;
}

html body .cases-main .home-chart-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  min-width: 0 !important;
  min-height: 20px !important;
  padding: 6px 8px 2px !important;
}

html body .cases-main .home-chart-heading h3 {
  min-width: 0 !important;
  margin: 0 !important;
  color: #355f7c !important;
  font-size: var(--type-caption) !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body .cases-main .home-chart-heading > span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  flex: 0 0 auto !important;
  color: var(--v2-muted) !important;
  font-size: var(--type-micro) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body .cases-main .home-chart-heading > span > i {
  display: block !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 2px !important;
  background: #2f7fd3 !important;
}

html body .cases-main .home-chart-body {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  gap: 6px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
}

html body .cases-main .home-chart-scale {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  min-width: 0 !important;
  height: 100% !important;
  padding: 21px 0 50px !important;
  color: var(--v2-muted) !important;
  font-size: var(--type-micro) !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums !important;
}

html body .cases-main .home-chart-scroll {
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(47, 127, 211, .42) transparent !important;
}

html body .cases-main .home-chart-scroll::-webkit-scrollbar {
  height: 5px !important;
}

html body .cases-main .home-chart-scroll::-webkit-scrollbar-track {
  background: transparent !important;
}

html body .cases-main .home-chart-scroll::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: rgba(47, 127, 211, .42) !important;
}

html body .cases-main .home-chart-plot {
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: var(--chart-min-width) !important;
  height: 100% !important;
}

html body .cases-main .home-chart-grid {
  position: absolute !important;
  z-index: 0 !important;
  top: 21px !important;
  right: 0 !important;
  bottom: 50px !important;
  left: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  pointer-events: none !important;
}


html body .cases-main .home-chart-columns {
  position: relative !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: repeat(var(--chart-columns), minmax(34px, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 6px !important;
}

html body .cases-main .home-chart-column,
html body .cases-main .home-chart-column:hover,
html body .cases-main .home-chart-column:focus,
html body .cases-main .home-chart-column:focus-visible,
html body .cases-main .home-chart-column:active {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-rows: 18px minmax(0, 1fr) 46px !important;
  gap: 3px !important;
  align-items: stretch !important;
  justify-items: center !important;
  min-width: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  cursor: pointer !important;
}

html body .cases-main .home-chart-value {
  align-self: end !important;
  color: #245f93 !important;
  font-size: var(--type-micro) !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums !important;
}

html body .cases-main .home-chart-bar-track {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 0 !important;
}

html body .cases-main .home-chart-bar-track > i {
  display: block !important;
  width: min(24px, 72%) !important;
  min-height: 2px !important;
  border-radius: 4px 4px 1px 1px !important;
  background: linear-gradient(180deg, #398de4 0%, #2f7fd3 100%) !important;
  box-shadow: 0 2px 5px rgba(47, 127, 211, .16) !important;
  transition: filter .16s ease, transform .16s ease !important;
  transform-origin: center bottom !important;
}

html body .cases-main .home-chart-column:hover .home-chart-bar-track > i,
html body .cases-main .home-chart-column:focus-visible .home-chart-bar-track > i {
  filter: saturate(1.18) brightness(1.04) !important;
  transform: scaleX(1.08) !important;
}

html body .cases-main .home-chart-column:focus-visible .home-chart-label {
  color: #1d5f91 !important;
  text-decoration: underline !important;
}

html body .cases-main .home-chart-label {
  display: -webkit-box !important;
  align-self: start !important;
  width: 100% !important;
  min-width: 0 !important;
  max-height: 34px !important;
  overflow: hidden !important;
  color: var(--v2-muted) !important;
  font-size: var(--type-micro) !important;
  line-height: 1.15 !important;
  font-weight: 400 !important;
  text-align: center !important;
  overflow-wrap: anywhere !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
}

html body .cases-main .home-chart-empty {
  align-self: center !important;
  justify-self: center !important;
  margin: 0 !important;
}

/* Single dashboard chart with a persistent selector and mode-specific palette. */
html body .cases-main .home-overall-panel.home-charts-panel.home-single-chart-panel {
  grid-template-columns: minmax(0, 1fr) !important;
}

html body .cases-main .home-single-chart-panel[data-chart-mode="municipalities"] {
  --home-chart-color: #398de4;
  --home-chart-color-strong: #2f7fd3;
  --home-chart-color-text: #245f93;
  --home-chart-color-shadow: rgba(47, 127, 211, .18);
}

html body .cases-main .home-single-chart-panel[data-chart-mode="mobileGroups"] {
  --home-chart-color: #2fc69e;
  --home-chart-color-strong: #0f9f83;
  --home-chart-color-text: #0f766e;
  --home-chart-color-shadow: rgba(15, 159, 131, .18);
}







html body .cases-main .home-single-chart-panel #homeChartMode {
  box-sizing: border-box !important;
  width: 196px !important;
  min-width: 196px !important;
  max-width: 196px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  margin: 0 !important;
  padding: 5px 0 3px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  color: #355f7c !important;
  font-size: var(--type-caption) !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
  overflow: visible !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html body .cases-main .home-single-chart-panel #homeChartMode:focus {
  border-color: transparent !important;
  box-shadow: none !important;
}


html body .cases-main .home-single-chart-panel .home-chart-bar-track > i {
  background: linear-gradient(180deg, var(--home-chart-color) 0%, var(--home-chart-color-strong) 100%) !important;
  box-shadow: 0 2px 5px var(--home-chart-color-shadow) !important;
}


html body .cases-main .home-single-chart-panel .home-chart-scroll::-webkit-scrollbar-thumb {
  background: var(--home-chart-color) !important;
}


/* Middle matrix: no vertical rules and seven equal-width horizontal fields. */
html body .cases-main .home-mobile-panel::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

html body .cases-main .home-mobile-table {
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

html body .cases-main .home-mobile-table th,
html body .cases-main .home-mobile-table td,
html body .cases-main .home-mobile-table th:first-child,
html body .cases-main .home-mobile-table td:first-child,
html body .cases-main .home-mobile-table tbody td:first-child {
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  border-right: 0 !important;
  border-left: 0 !important;
  border-bottom: 1px solid var(--line) !important;
}

html body .cases-main .home-mobile-table th + th,
html body .cases-main .home-mobile-table td + td {
  border-left: 0 !important;
}

/* The final matrix row uses identical full-cell rules, including the edge cells. */
html body .cases-main .home-mobile-table tbody tr:last-child td {
  position: relative !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}



/* Home typography, neutral summary cards, and one shared rule color. */
html body .cases-main .cases-page-root:has(.home-summary-grid) {
  --home-text-color: #355f7c;
  --home-rule-color: var(--line);
  color: var(--home-text-color) !important;
}

html body .cases-main .cases-page-root:has(.home-summary-grid) :is(h1, h2, h3, p, span, strong, th, td, button, select, option) {
  color: var(--home-text-color) !important;
}

html body .cases-main .home-summary-card[data-summary-key] {
  color: var(--home-text-color) !important;
  border-color: var(--home-rule-color) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .cases-main .home-summary-card[data-summary-key] > span,
html body .cases-main .home-summary-card[data-summary-key] .home-count-button,
html body .cases-main .home-summary-card[data-summary-key] .home-count-button:hover,
html body .cases-main .home-summary-card[data-summary-key] .home-count-button:focus-visible {
  color: var(--home-text-color) !important;
}




/* The graph selector is a regular-weight card title with inset menu labels. */
html body .cases-main .home-single-chart-panel #homeChartMode {
  padding: 5px 0 3px 10px !important;
  color: var(--home-text-color) !important;
  font-size: var(--type-micro) !important;
  line-height: 1.5 !important;
  font-weight: 400 !important;
}

html body .cases-main .home-single-chart-panel #homeChartMode option {
  padding: 6px 12px !important;
  padding-inline-start: 12px !important;
  color: var(--home-text-color) !important;
  font-size: var(--type-micro) !important;
  font-weight: 400 !important;
  text-indent: 6px !important;
}

/* Every graph inscription uses one larger regular-weight type treatment. */
html body .cases-main .home-single-chart-panel :is(#homeChartMode, #homeChartMode option, .home-chart-scale, .home-chart-scale span, .home-chart-value, .home-chart-label) {
  font-size: var(--type-caption) !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
}

/* One 11.5px regular-weight type scale, except the large top-card values. */
html body .cases-main .cases-page-root:has(.home-summary-grid) :is(h1, h2, h3, p, span, strong, th, td, button:not(.home-count-button), select, option) {
  font-size: var(--type-caption) !important;
  font-weight: 400 !important;
}

/* The final row in the middle matrix has no lower rules. */


/* Final Home alignment: neutral cards, left-aligned Y axis, and equal block rhythm. */
html body .cases-main .home-summary-card[data-summary-key] {
  border-color: transparent !important;
}


html body .cases-main .home-chart-scale,
html body .cases-main .home-chart-scale > span {
  align-items: flex-start !important;
  width: 100% !important;
  text-align: left !important;
}


html body .cases-main .cases-page-root:has(.home-summary-grid) > .home-summary-grid,
html body .cases-main .cases-page-root:has(.home-summary-grid) > .home-mobile-panel,
html body .cases-main .cases-page-root:has(.home-summary-grid) > .home-single-chart-panel {
  box-sizing: border-box !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

html body .cases-main .cases-page-root:has(.home-summary-grid) > .home-mobile-panel,
html body .cases-main .cases-page-root:has(.home-summary-grid) > .home-single-chart-panel {
  margin: 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

/* Clean lower blocks: no Y-axis labels or horizontal rules. */
html body .cases-main .home-chart-scale {
  display: none !important;
}

html body .cases-main .home-chart-body {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

html body .cases-main .home-chart-scroll {
  grid-column: 1 !important;
  width: 100% !important;
}





/* Graph grid returns without Y-axis labels; card and matrix typography spacing. */
html body .cases-main .home-chart-grid {
  display: flex !important;
}


html body #pageRoot .home-mobile-table .home-table-count {
  font-size: var(--type-title) !important;
}

/* Embedded Inter handles Latin/numerals; embedded Noto Sans Georgian handles Georgian. */
html body,
html body :where(*) {
  font-family: var(--cases-ui-font) !important;
  font-optical-sizing: auto !important;
}

html body .cases-main .home-mobile-table-wrap {
  box-sizing: border-box !important;
  padding-right: 13px !important;
  padding-left: 13px !important;
}

html body #pageRoot .home-mobile-table :is(th, td) {
  border-bottom: 1px solid var(--home-rule-color) !important;
  box-shadow: none !important;
}


/* The seven summary cards share the matrix/chart 13px horizontal inset exactly. */

/* App-owned autofill surface replaces Chromium's native black/white popup. */
html body .styled-autofill-popup {
  position: fixed !important;
  z-index: 20000 !important;
  box-sizing: border-box !important;
  display: grid !important;
  gap: 3px !important;
  /* Five 40px rows + four 3px gaps + 12px padding + 2px border. */
  max-height: 226px !important;
  padding: 6px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  border: 1px solid rgba(148, 163, 184, .42) !important;
  border-radius: 12px !important;
  background: rgba(248, 246, 253, .82) !important;
  background-color: rgba(248, 246, 253, .82) !important;
  box-shadow: 0 14px 30px rgba(48, 65, 92, .14) !important;
  backdrop-filter: blur(18px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.08) !important;
  transform: translateY(-4px) !important;
  transition: opacity .14s ease, transform .14s ease, visibility .14s ease !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(53, 95, 124, .28) transparent !important;
}

html body .styled-autofill-popup.visible {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

html body .styled-autofill-popup::-webkit-scrollbar {
  width: 5px !important;
}

html body .styled-autofill-popup::-webkit-scrollbar-track {
  background: transparent !important;
}

html body .styled-autofill-popup::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: rgba(53, 95, 124, .28) !important;
}

html body .styled-autofill-popup .styled-autofill-option,
html body .styled-autofill-popup .styled-autofill-option:hover,
html body .styled-autofill-popup .styled-autofill-option:focus,
html body .styled-autofill-popup .styled-autofill-option:focus-visible,
html body .styled-autofill-popup .styled-autofill-option:active {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 34px !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  overflow: hidden !important;
  color: #355f7c !important;
  font-size: var(--type-caption) !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  border: 0 !important;
  border-radius: 8px !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  cursor: pointer !important;
}

html body .styled-autofill-popup .styled-autofill-option:hover,
html body .styled-autofill-popup .styled-autofill-option:focus-visible,
html body .styled-autofill-popup .styled-autofill-option.selected {
  color: #244f70 !important;
  background: rgba(219, 234, 254, .62) !important;
}

html body .styled-select-popup .styled-select-option {
  position: relative !important;
  padding-right: 32px !important;
}

html body .styled-select-popup .styled-select-option::after {
  content: "✓" !important;
  position: absolute !important;
  top: 50% !important;
  right: 10px !important;
  color: #2563eb !important;
  font-size: var(--type-caption) !important;
  line-height: 1 !important;
  opacity: 0 !important;
  transform: translateY(-50%) !important;
}

html body .styled-select-popup .styled-select-option.selected::after {
  opacity: 1 !important;
}

html body .styled-select-popup .styled-select-option:disabled {
  color: rgba(53, 95, 124, .46) !important;
  background: transparent !important;
  cursor: default !important;
}

html body .styled-calendar-popup {
  gap: 8px !important;
  max-height: none !important;
  padding: 10px !important;
  overflow: visible !important;
}

html body .styled-calendar-header {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 34px !important;
  align-items: center !important;
  gap: 6px !important;
}

html body .styled-calendar-title {
  min-width: 0 !important;
  color: #355f7c !important;
  font-size: var(--type-caption) !important;
  line-height: 1.2 !important;
  font-weight: 400 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

html body .styled-calendar-nav,
html body .styled-calendar-nav:hover,
html body .styled-calendar-nav:focus,
html body .styled-calendar-nav:focus-visible,
html body .styled-calendar-nav:active {
  display: inline-grid !important;
  place-items: center !important;
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #355f7c !important;
  font-size: var(--type-heading) !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  border: 0 !important;
  border-radius: 8px !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html body .styled-calendar-nav:hover,
html body .styled-calendar-nav:focus-visible {
  color: #244f70 !important;
  background: rgba(219, 234, 254, .62) !important;
}

html body .styled-calendar-weekdays,
html body .styled-calendar-days {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  gap: 3px !important;
}

html body .styled-calendar-weekdays > span {
  display: grid !important;
  place-items: center !important;
  min-width: 0 !important;
  height: 24px !important;
  color: rgba(53, 95, 124, .70) !important;
  font-size: var(--type-micro) !important;
  line-height: 1 !important;
  font-weight: 400 !important;
}

html body .styled-calendar-empty {
  display: block !important;
  min-width: 0 !important;
  height: 34px !important;
}

html body .styled-calendar-day,
html body .styled-calendar-day:hover,
html body .styled-calendar-day:focus,
html body .styled-calendar-day:focus-visible,
html body .styled-calendar-day:active {
  display: inline-grid !important;
  place-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #355f7c !important;
  font-size: var(--type-caption) !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html body .styled-calendar-day:hover,
html body .styled-calendar-day:focus-visible {
  color: #244f70 !important;
  background: rgba(219, 234, 254, .62) !important;
}

html body .styled-calendar-day.today {
  border-color: rgba(37, 99, 235, .36) !important;
}

html body .styled-calendar-day.selected,
html body .styled-calendar-day.selected:hover,
html body .styled-calendar-day.selected:focus-visible {
  color: #1d4ed8 !important;
  border-color: rgba(37, 99, 235, .30) !important;
  background: rgba(219, 234, 254, .82) !important;
}

html body .styled-calendar-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding-top: 2px !important;
}

html body .styled-calendar-footer-action,
html body .styled-calendar-footer-action:hover,
html body .styled-calendar-footer-action:focus,
html body .styled-calendar-footer-action:focus-visible,
html body .styled-calendar-footer-action:active {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  color: #355f7c !important;
  font-size: var(--type-micro) !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  border: 0 !important;
  border-radius: 7px !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html body .styled-calendar-footer-action:hover,
html body .styled-calendar-footer-action:focus-visible {
  color: #244f70 !important;
  background: rgba(219, 234, 254, .62) !important;
}

/* One app-owned hover tooltip for charts, tables, icon actions, and navigation. */
html body .styled-hover-tooltip {
  position: fixed !important;
  z-index: 24000 !important;
  box-sizing: border-box !important;
  display: block !important;
  width: max-content !important;
  max-width: min(320px, calc(100vw - 16px)) !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  overflow-wrap: anywhere !important;
  color: #355f7c !important;
  font-size: var(--type-caption) !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  text-align: left !important;
  white-space: normal !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  border: 1px solid rgba(148, 163, 184, .42) !important;
  border-radius: 10px !important;
  background: rgba(248, 246, 253, .82) !important;
  background-color: rgba(248, 246, 253, .82) !important;
  box-shadow: 0 10px 24px rgba(48, 65, 92, .14) !important;
  backdrop-filter: blur(18px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.08) !important;
  transform: translateY(4px) !important;
  transition: opacity .14s ease, transform .14s ease, visibility .14s ease !important;
}

html body .styled-hover-tooltip.visible {
  visibility: visible !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
}

html body .styled-hover-tooltip.has-segments {
  min-width: 164px !important;
  padding: 9px 10px !important;
}

html body .styled-hover-tooltip-heading {
  margin: 0 0 7px !important;
  color: #355f7c !important;
  font-size: var(--type-caption) !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
}

html body .styled-hover-tooltip-segments {
  display: grid !important;
  gap: 5px !important;
}

html body .styled-hover-tooltip-segment {
  display: grid !important;
  grid-template-columns: 8px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  color: #355f7c !important;
  font-size: var(--type-caption) !important;
  line-height: 1.2 !important;
  font-weight: 400 !important;
}

html body .styled-hover-tooltip-segment > i {
  display: block !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 3px !important;
}

html body .styled-hover-tooltip-segment > span:last-child {
  font-variant-numeric: tabular-nums !important;
  text-align: right !important;
}

html body .cases-main .home-single-chart-panel .home-chart-mode-button,
html body .cases-main .home-single-chart-panel .home-chart-mode-button:hover,
html body .cases-main .home-single-chart-panel .home-chart-mode-button:focus,
html body .cases-main .home-single-chart-panel .home-chart-mode-button:focus-visible,
html body .cases-main .home-single-chart-panel .home-chart-mode-button:active {
  position: relative !important;
  box-sizing: border-box !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  flex: 0 0 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #718397 !important;
  border: 1px solid transparent !important;
  outline: 0 !important;
  background: transparent !important;
  transform: none !important;
}


html body .cases-main .home-chart-mode-button[data-home-chart-mode="municipalities"] {
  --chart-mode-action-color: #2f7fd3;
  --chart-mode-action-bg: rgba(47, 127, 211, .12);
}

html body .cases-main .home-chart-mode-button[data-home-chart-mode="mobileGroups"] {
  --chart-mode-action-color: #0f9f83;
  --chart-mode-action-bg: rgba(15, 159, 131, .12);
}

html body .cases-main .home-single-chart-panel .home-chart-mode-button:hover,
html body .cases-main .home-single-chart-panel .home-chart-mode-button:focus-visible,
html body .cases-main .home-single-chart-panel .home-chart-mode-button[aria-pressed="true"] {
  color: var(--chart-mode-action-color) !important;
  border-color: color-mix(in srgb, var(--chart-mode-action-color) 24%, transparent) !important;
  background: var(--chart-mode-action-bg) !important;
}

/* Mobile-group totals reveal a stable year-colored stack on hover/focus. */

html body .cases-main .home-chart-bar-fill {
  position: relative !important;
  overflow: hidden !important;
}

html body .cases-main .home-chart-year-segments {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  flex-direction: column-reverse !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  visibility: hidden !important;
  opacity: 0 !important;
  border-radius: inherit !important;
  transition: opacity .16s ease !important;
  pointer-events: none !important;
}

html body .cases-main .home-chart-year-segment {
  display: block !important;
  flex: var(--year-segment-value) 1 0% !important;
  min-height: 1px !important;
  background: var(--year-segment-color) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .58) !important;
}

html body .cases-main .home-single-chart-panel[data-chart-mode="mobileGroups"] .home-chart-column:hover .home-chart-year-segments,
html body .cases-main .home-single-chart-panel[data-chart-mode="mobileGroups"] .home-chart-column:focus-visible .home-chart-year-segments {
  visibility: visible !important;
  opacity: 1 !important;
}

/* Virtual case tables keep only the visible 64px rows in the DOM. */
html body .cases-main .cases-table.is-virtualized tbody tr.virtual-case-row {
  box-sizing: border-box !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  margin: 0 !important;
  overflow: hidden !important;
}

html body .cases-main .cases-table.is-virtualized tbody tr.virtual-case-row > td,
html body .cases-main .cases-table.is-virtualized tbody tr.virtual-case-row > td:nth-child(n) {
  box-sizing: border-box !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  overflow: hidden !important;
}

html body .cases-main .cases-table.is-virtualized tbody tr.virtual-case-spacer,
html body .cases-main .cases-table.is-virtualized tbody tr.virtual-case-spacer:hover {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: var(--virtual-case-spacer-height) !important;
  min-height: var(--virtual-case-spacer-height) !important;
  max-height: var(--virtual-case-spacer-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  background: transparent !important;
  pointer-events: none !important;
}

html body .cases-main .cases-table.is-virtualized tbody tr.virtual-case-spacer > td,
html body .cases-main .cases-table.is-virtualized tbody tr.virtual-case-spacer > td:nth-child(n) {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body .cases-main .cases-table.is-virtualized tbody tr:last-child {
  margin-bottom: 0 !important;
}

html body .cases-main .cases-table.is-virtualized tbody tr.virtual-case-empty {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  min-height: 64px !important;
}

html body .cases-main .cases-table.is-virtualized tbody tr.virtual-case-empty > td.empty-state {
  grid-column: 1 !important;
  min-height: 64px !important;
}

/* App-owned confirmation dialog matches the translucent popup system. */
html body.app-confirm-open {
  overflow: hidden !important;
}

html body .app-confirm-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 30000 !important;
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  padding: 20px !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  background: rgba(44, 62, 82, .12) !important;
  backdrop-filter: blur(3px) !important;
  -webkit-backdrop-filter: blur(3px) !important;
  transition: opacity .16s ease, visibility .16s ease !important;
}

html body .app-confirm-backdrop.visible {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html body .app-confirm-dialog {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 9px !important;
  width: min(240px, calc(100vw - 40px)) !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 12px !important;
  color: #355f7c !important;
  border: 1px solid rgba(148, 163, 184, .42) !important;
  border-radius: 12px !important;
  outline: 0 !important;
  background: rgba(248, 246, 253, .86) !important;
  background-color: rgba(248, 246, 253, .86) !important;
  box-shadow: 0 16px 38px rgba(48, 65, 92, .18) !important;
  backdrop-filter: blur(22px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.08) !important;
  transform: translateY(8px) scale(.985) !important;
  transition: transform .16s ease !important;
}

html body .app-confirm-backdrop.visible .app-confirm-dialog {
  transform: translateY(0) scale(1) !important;
}

html body .app-confirm-copy {
  align-self: center !important;
  min-width: 0 !important;
  text-align: center !important;
}

html body .app-confirm-copy h2,
html body .app-confirm-copy p {
  margin: 0 !important;
  color: #355f7c !important;
  font-size: var(--type-caption) !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
}

html body .app-confirm-copy p {
  margin-top: 4px !important;
  color: rgba(53, 95, 124, .80) !important;
}

html body .app-confirm-actions {
  grid-column: 1 / -1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
}

html body .app-confirm-actions .app-confirm-cancel,
html body .app-confirm-actions .app-confirm-accept,
html body .app-confirm-actions .app-confirm-cancel:hover,
html body .app-confirm-actions .app-confirm-accept:hover,
html body .app-confirm-actions .app-confirm-cancel:focus,
html body .app-confirm-actions .app-confirm-accept:focus,
html body .app-confirm-actions .app-confirm-cancel:focus-visible,
html body .app-confirm-actions .app-confirm-accept:focus-visible,
html body .app-confirm-actions .app-confirm-cancel:active,
html body .app-confirm-actions .app-confirm-accept:active {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: var(--type-caption) !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  border-radius: 9px !important;
  outline: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}


html body .app-confirm-actions .app-confirm-cancel {
  color: #b34f4f !important;
  border: 1px solid rgba(201, 102, 102, .30) !important;
  background: rgba(254, 226, 226, .56) !important;
}

html body .app-confirm-actions .app-confirm-cancel:hover,
html body .app-confirm-actions .app-confirm-cancel:focus-visible {
  color: #963c3c !important;
  border-color: rgba(185, 70, 70, .38) !important;
  background: rgba(254, 202, 202, .68) !important;
}

html body .app-confirm-actions .app-confirm-accept {
  color: #16866f !important;
  border: 1px solid rgba(22, 134, 111, .26) !important;
  background: rgba(209, 250, 229, .54) !important;
}

html body .app-confirm-actions .app-confirm-accept:hover,
html body .app-confirm-actions .app-confirm-accept:focus-visible {
  color: #0f745f !important;
  border-color: rgba(15, 116, 95, .36) !important;
  background: rgba(167, 243, 208, .64) !important;
}

html body .app-credential-dialog {
  width: min(320px, calc(100vw - 40px)) !important;
  gap: 12px !important;
  text-align: left !important;
}

html body .app-credential-dialog .app-confirm-copy {
  text-align: left !important;
}

html body .app-prompt-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

html body .app-prompt-field > span {
  font-size: var(--type-caption) !important;
  color: rgba(53, 95, 124, .80) !important;
}

html body .app-prompt-field > input {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 34px !important;
  padding: 0 10px !important;
  font-size: var(--type-body) !important;
  color: #355f7c !important;
  border: 1px solid rgba(148, 163, 184, .42) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, .6) !important;
  outline: 0 !important;
}

html body .app-prompt-field > input:focus,
html body .app-prompt-field > input:focus-visible {
  border-color: rgba(94, 129, 172, .68) !important;
}

html body .app-prompt-error {
  margin: 0 !important;
  font-size: var(--type-caption) !important;
  color: #b34f4f !important;
}

html body .app-prompt-error:empty {
  display: none !important;
}

html body .kancelaria-loader {
  position: fixed !important;
  inset: 0 !important;
  /* The blur covers the whole window; the card waits in the page's frame (sidebar + 24 left, top row 84, 24 right, 15 bottom). */
  box-sizing: border-box !important;
  padding: 84px 24px 15px var(--page-frame-left, 324px) !important;
  z-index: 30000 !important;
  display: grid !important;
  place-items: center !important;
  visibility: hidden !important;
  opacity: 0 !important;
  background: rgba(44, 62, 82, .12) !important;
  backdrop-filter: blur(3px) !important;
  -webkit-backdrop-filter: blur(3px) !important;
  transition: opacity .2s ease, visibility .2s ease !important;
}

html body .kancelaria-loader.visible {
  visibility: visible !important;
  opacity: 1 !important;
}

html body .kancelaria-loader-card {
  display: grid !important;
  justify-items: center !important;
  gap: 16px !important;
  padding: 24px 32px 20px !important;
  color: #355f7c !important;
  border: 1px solid rgba(148, 163, 184, .42) !important;
  border-radius: 14px !important;
  background: rgba(248, 246, 253, .9) !important;
  box-shadow: 0 16px 38px rgba(48, 65, 92, .18) !important;
  backdrop-filter: blur(22px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.08) !important;
}

html body .kancelaria-loader-card > p {
  margin: 0 !important;
  font-size: var(--type-body) !important;
  color: rgba(53, 95, 124, .86) !important;
}

html body .kancelaria-loader-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 14px) !important;
  gap: 6px !important;
}

html body .kancelaria-loader-grid > span {
  width: 14px !important;
  height: 14px !important;
  border-radius: 4px !important;
  background: var(--kancelaria-loader-color, #6f5bd6) !important;
  animation: kancelaria-loader-pulse 1.3s ease-in-out infinite !important;
  animation-delay: var(--kancelaria-loader-delay, 0ms) !important;
}

html body .kancelaria-loader-grid > span:nth-child(1) { --kancelaria-loader-color: #6f5bd6; --kancelaria-loader-delay: 0ms; }
html body .kancelaria-loader-grid > span:nth-child(2) { --kancelaria-loader-color: #6f7bd9; --kancelaria-loader-delay: 120ms; }
html body .kancelaria-loader-grid > span:nth-child(3) { --kancelaria-loader-color: #4a9bd8; --kancelaria-loader-delay: 240ms; }
html body .kancelaria-loader-grid > span:nth-child(4) { --kancelaria-loader-color: #7a86c8; --kancelaria-loader-delay: 120ms; }
html body .kancelaria-loader-grid > span:nth-child(5) { --kancelaria-loader-color: #58b0c9; --kancelaria-loader-delay: 240ms; }
html body .kancelaria-loader-grid > span:nth-child(6) { --kancelaria-loader-color: #3fb8a5; --kancelaria-loader-delay: 360ms; }
html body .kancelaria-loader-grid > span:nth-child(7) { --kancelaria-loader-color: #4a9bd8; --kancelaria-loader-delay: 240ms; }
html body .kancelaria-loader-grid > span:nth-child(8) { --kancelaria-loader-color: #3fb8a5; --kancelaria-loader-delay: 360ms; }
html body .kancelaria-loader-grid > span:nth-child(9) { --kancelaria-loader-color: #e2b04a; --kancelaria-loader-delay: 480ms; }

@keyframes kancelaria-loader-pulse {
  0%, 100% { transform: scale(.55); opacity: .4; }
  40% { transform: scale(1); opacity: 1; }
}

html[data-theme="dark"] body .kancelaria-loader-card {
  color: var(--v2-ink) !important;
  border-color: rgba(148, 163, 184, .26) !important;
  background: rgba(30, 38, 50, .9) !important;
}

html[data-theme="dark"] body .kancelaria-loader-card > p {
  color: var(--v2-ink) !important;
}

@media (prefers-reduced-motion: reduce) {
  html body .kancelaria-loader-grid > span {
    animation: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .app-confirm-backdrop,
  html body .app-confirm-dialog {
    transition: none !important;
  }
}

/* Unified regular typography throughout the application. */
html body,
html body :where(*):not(#cases-fw-a):not(#cases-fw-b):not(#cases-fw-c):not(#cases-fw-d):not(#cases-fw-e),
html body :where(*):not(#cases-fw-a):not(#cases-fw-b):not(#cases-fw-c):not(#cases-fw-d):not(#cases-fw-e)::before,
html body :where(*):not(#cases-fw-a):not(#cases-fw-b):not(#cases-fw-c):not(#cases-fw-d):not(#cases-fw-e)::after {
  font-weight: 400 !important;
}

/* Table statuses retain only their semantic text color. */
html body .cases-main :is(.cases-table, .report-preview-table) .status-pill,
html body .cases-main :is(.cases-table, .report-preview-table) .status-pill:hover,
html body .cases-main :is(.cases-table, .report-preview-table) .status-pill:focus,
html body .cases-main :is(.cases-table, .report-preview-table) .status-pill:focus-visible,
html body .cases-main :is(.cases-table, .report-preview-table) .status-pill:active {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Home chart dimensions and period range stay visually separate. */
html body .cases-main .home-chart-controls {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  width: 100% !important;
  min-width: 0 !important;
}

html body .cases-main .home-chart-period-button,
html body .cases-main .home-chart-period-button:hover,
html body .cases-main .home-chart-period-button:focus,
html body .cases-main .home-chart-period-button:focus-visible,
html body .cases-main .home-chart-period-button:active {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  margin: 0 !important;
  padding: 0 9px !important;
  color: var(--home-text-color) !important;
  font-size: var(--type-caption) !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  white-space: nowrap !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html body .cases-main .home-chart-period-button:hover,
html body .cases-main .home-chart-period-button:focus-visible,
html body .cases-main .home-chart-period-button[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--home-chart-color-strong) 24%, transparent) !important;
  background: color-mix(in srgb, var(--home-chart-color) 11%, transparent) !important;
}

/* Deadline settings, notification geometry, and unobtrusive table state markers. */
html body .cases-main .home-notification-action-strip .deadline-notification-button {
  position: relative !important;
  box-sizing: border-box !important;
  display: inline-grid !important;
  place-items: center !important;
  width: var(--pactum-action-size, 38px) !important;
  min-width: var(--pactum-action-size, 38px) !important;
  max-width: var(--pactum-action-size, 38px) !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  flex: 0 0 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #718397 !important;
}



html body .cases-main .home-notification-action-strip .deadline-notification-button.has-notifications {
  color: #c47a16 !important;
}

html body .cases-main .home-notification-action-strip .deadline-notification-button.has-overdue {
  color: #c44f5d !important;
}

html body .cases-main .home-notification-action-strip #deadlineNotificationButton[data-deadline-state="empty"] {
  color: #7f8b96 !important;
}

html body .cases-main .home-notification-action-strip #deadlineNotificationButton[data-deadline-state="upcoming"] {
  color: #c47a16 !important;
}

html body .cases-main .home-notification-action-strip #deadlineNotificationButton[data-deadline-state="overdue"] {
  color: #c44f5d !important;
}

html body .cases-main .home-notification-action-strip .deadline-notification-button.is-ringing > svg {
  transform-origin: 50% 18% !important;
  animation: deadline-bell-ring 1s ease-in-out 5 !important;
  will-change: transform !important;
}

@keyframes deadline-bell-ring {
  0%, 42%, 100% { transform: rotate(0deg); }
  8% { transform: rotate(12deg); }
  16% { transform: rotate(-11deg); }
  24% { transform: rotate(8deg); }
  32% { transform: rotate(-6deg); }
}

@media (prefers-reduced-motion: reduce) {
  html body .cases-main .home-notification-action-strip .deadline-notification-button.is-ringing > svg {
    animation: none !important;
  }
}

html body .deadline-notification-popup {
  position: fixed !important;
  z-index: 1200 !important;
  top: var(--deadline-popup-top, 38px) !important;
  right: var(--deadline-popup-right, 54px) !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  width: min(380px, calc(100vw - 28px)) !important;
  max-height: min(520px, calc(100vh - 58px)) !important;
  overflow: hidden !important;
  color: var(--home-text-color, #355f7c) !important;
  border: 1px solid rgba(148, 163, 184, .34) !important;
  border-radius: 14px !important;
  background: rgba(246, 249, 255, .84) !important;
  box-shadow: 0 16px 38px rgba(30, 64, 93, .17) !important;
  backdrop-filter: blur(18px) saturate(1.15) !important;
}

html body .deadline-notification-popup-head,
html body .deadline-notification-popup-foot {
  display: flex !important;
  align-items: center !important;
  min-height: 38px !important;
  padding: 0 12px !important;
  font-size: var(--type-caption) !important;
  font-weight: 400 !important;
  border-color: rgba(148, 163, 184, .24) !important;
}

html body .deadline-notification-popup-head {
  justify-content: space-between !important;
  border-bottom: 1px solid rgba(148, 163, 184, .24) !important;
}

html body .deadline-notification-popup-foot {
  justify-content: flex-end !important;
  border-top: 1px solid rgba(148, 163, 184, .24) !important;
}

html body .deadline-notification-popup-close,
html body .deadline-notification-popup-close:hover,
html body .deadline-notification-popup-close:focus-visible {
  display: grid !important;
  place-items: center !important;
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 !important;
  color: #718397 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .deadline-notification-popup-close svg {
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
}

html body .deadline-notification-list {
  display: grid !important;
  gap: 3px !important;
  min-height: 0 !important;
  padding: 7px !important;
  overflow-y: auto !important;
}

html body .deadline-notification-row,
html body .deadline-notification-row:hover,
html body .deadline-notification-row:focus-visible {
  box-sizing: border-box !important;
  display: grid !important;
  gap: 4px !important;
  width: 100% !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 8px 10px 8px 13px !important;
  color: var(--home-text-color, #355f7c) !important;
  font-size: var(--type-caption) !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
  text-align: left !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  transform: none !important;
}



html body .deadline-notification-row:hover,
html body .deadline-notification-row:focus-visible {
  background: rgba(255, 255, 255, .42) !important;
}

html body .deadline-notification-row > span:last-child,
html body .deadline-notification-empty {
  color: var(--v2-muted) !important;
}

html body .deadline-notification-empty {
  margin: 20px 12px !important;
  font-size: var(--type-caption) !important;
  text-align: center !important;
}

html body .settings-content .deadline-settings-panel {
  box-sizing: border-box !important;
  align-self: start !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 20px !important;
  overflow: visible !important;
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .settings-content .deadline-settings-fields {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
  max-width: 620px !important;
}

html body .settings-content .deadline-settings-fields label {
  display: grid !important;
  gap: 8px !important;
  color: var(--home-text-color, #355f7c) !important;
  font-size: var(--type-caption) !important;
  font-weight: 400 !important;
}

html body .settings-content .deadline-settings-fields input {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 38px !important;
  padding: 0 12px !important;
  color: var(--home-text-color, #355f7c) !important;
  font-size: var(--type-caption) !important;
  font-weight: 400 !important;
  border: 1px solid var(--line) !important;
  border-radius: 9px !important;
  background: rgba(255, 255, 255, .20) !important;
  box-shadow: none !important;
}







/* Completion-speed mode: one standard column for the average duration. */
html body .cases-main .home-single-chart-panel[data-chart-mode="performance"] {
  --home-chart-color: #ec7b94;
  --home-chart-color-strong: #d45270;
  --home-chart-color-text: #a93e59;
  --home-chart-color-shadow: rgba(212, 82, 112, .18);
}

html body .cases-main .home-chart-mode-button[data-home-chart-mode="performance"] {
  --chart-mode-action-color: #d45270;
  --chart-mode-action-bg: rgba(212, 82, 112, .11);
}

html body .cases-main .home-performance-column {
  position: relative !important;
}

html body .cases-main .home-performance-column.is-empty {
  cursor: default !important;
}