/* Minification failed. Returning unminified contents. (1189,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1190,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1191,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1192,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1193,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1194,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1195,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1196,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1197,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1198,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1199,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1200,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1201,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1213,28): run-time error CSS1039: Token not allowed after unary operator: '-bg' (1214,17): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1221,17): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1225,28): run-time error CSS1039: Token not allowed after unary operator: '-panel' (1229,24): run-time error CSS1039: Token not allowed after unary operator: '-panel-border' (1233,28): run-time error CSS1039: Token not allowed after unary operator: '-panel-hover' (1237,28): run-time error CSS1039: Token not allowed after unary operator: '-panel-hover' (1241,17): run-time error CSS1039: Token not allowed after unary operator: '-ink-strong' (1249,17): run-time error CSS1039: Token not allowed after unary operator: '-muted' (1253,17): run-time error CSS1039: Token not allowed after unary operator: '-muted-2' (1261,17): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1303,32): run-time error CSS1039: Token not allowed after unary operator: '-chip-border' (1341,26): run-time error CSS1039: Token not allowed after unary operator: '-brand' (1366,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (1376,49): run-time error CSS1039: Token not allowed after unary operator: '-accent' (1376,84): run-time error CSS1039: Token not allowed after unary operator: '-accent' (1391,17): run-time error CSS1039: Token not allowed after unary operator: '-ink' (1393,56): run-time error CSS1039: Token not allowed after unary operator: '-ink-strong' (1395,56): run-time error CSS1039: Token not allowed after unary operator: '-muted' (1997,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (2005,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (2015,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (2061,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (2078,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (2084,22): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (2085,24): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (2093,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (2622,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (2647,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2648,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2649,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2650,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2651,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2652,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2653,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2654,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2655,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2656,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2657,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2658,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2659,17): run-time error CSS1039: Token not allowed after unary operator: '-ink' (2665,32): run-time error CSS1039: Token not allowed after unary operator: '-border' (2666,29): run-time error CSS1039: Token not allowed after unary operator: '-radius' (2667,26): run-time error CSS1039: Token not allowed after unary operator: '-card' (2682,21): run-time error CSS1039: Token not allowed after unary operator: '-muted' (2713,28): run-time error CSS1039: Token not allowed after unary operator: '-border' (2716,17): run-time error CSS1039: Token not allowed after unary operator: '-ink' (2732,17): run-time error CSS1039: Token not allowed after unary operator: '-muted' (2744,24): run-time error CSS1039: Token not allowed after unary operator: '-brand' (2757,26): run-time error CSS1039: Token not allowed after unary operator: '-brand' (2762,30): run-time error CSS1039: Token not allowed after unary operator: '-brand-2' (2794,28): run-time error CSS1039: Token not allowed after unary operator: '-border' (2800,17): run-time error CSS1039: Token not allowed after unary operator: '-ink' (2804,26): run-time error CSS1039: Token not allowed after unary operator: '-brand' (2806,28): run-time error CSS1039: Token not allowed after unary operator: '-brand' (2822,17): run-time error CSS1039: Token not allowed after unary operator: '-ink2' (2827,32): run-time error CSS1039: Token not allowed after unary operator: '-border' (2843,21): run-time error CSS1039: Token not allowed after unary operator: '-ok' (2847,21): run-time error CSS1039: Token not allowed after unary operator: '-sell' (2851,21): run-time error CSS1039: Token not allowed after unary operator: '-hold' (2869,28): run-time error CSS1039: Token not allowed after unary operator: '-border' (2879,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2880,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2881,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2882,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2883,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2884,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2885,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2886,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2890,17): run-time error CSS1039: Token not allowed after unary operator: '-ex-ink' (2891,22): run-time error CSS1039: Token not allowed after unary operator: '-ex-panel' (2892,34): run-time error CSS1039: Token not allowed after unary operator: '-ex-border' (2906,5): run-time error CSS1035: Expected colon, found ' padding' (2910,21): run-time error CSS1039: Token not allowed after unary operator: '-ex-ink' (2914,21): run-time error CSS1039: Token not allowed after unary operator: '-ex-ink-strong' (2918,21): run-time error CSS1039: Token not allowed after unary operator: '-ex-ink-soft' (2922,21): run-time error CSS1039: Token not allowed after unary operator: '-ex-muted' (2926,28): run-time error CSS1039: Token not allowed after unary operator: '-ex-border' (2930,32): run-time error CSS1039: Token not allowed after unary operator: '-ex-panel-hover' (2934,32): run-time error CSS1039: Token not allowed after unary operator: '-ex-panel-hover' (2943,26): run-time error CSS1039: Token not allowed after unary operator: '-ex-tip-bg' (2962,21): run-time error CSS1039: Token not allowed after unary operator: '-ex-ink' (2966,17): run-time error CSS1039: Token not allowed after unary operator: '-ex-ink' (2970,17): run-time error CSS1039: Token not allowed after unary operator: '-ex-ink' (3623,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3624,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3625,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3626,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3627,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3628,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3629,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3630,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3631,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3632,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3633,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3634,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3635,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3637,28): run-time error CSS1039: Token not allowed after unary operator: '-bg' (3644,21): run-time error CSS1039: Token not allowed after unary operator: '-text' (3652,22): run-time error CSS1039: Token not allowed after unary operator: '-brand' (3673,27): run-time error CSS1062: Expected semicolon or closing curly-brace, found ':' (3772,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (3792,21): run-time error CSS1039: Token not allowed after unary operator: '-brand' (4050,17): run-time error CSS1039: Token not allowed after unary operator: '-muted' (4073,22): run-time error CSS1039: Token not allowed after unary operator: '-green' (4078,22): run-time error CSS1039: Token not allowed after unary operator: '-brand' (4100,17): run-time error CSS1039: Token not allowed after unary operator: '-muted' (4121,28): run-time error CSS1039: Token not allowed after unary operator: '-line' (4122,17): run-time error CSS1039: Token not allowed after unary operator: '-text' (4161,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4162,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4163,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4164,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4165,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4166,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4167,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4168,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4173,17): run-time error CSS1039: Token not allowed after unary operator: '-text' (4197,21): run-time error CSS1039: Token not allowed after unary operator: '-text' (4202,21): run-time error CSS1039: Token not allowed after unary operator: '-muted' (4212,32): run-time error CSS1039: Token not allowed after unary operator: '-line' (4214,21): run-time error CSS1039: Token not allowed after unary operator: '-text' (4236,32): run-time error CSS1039: Token not allowed after unary operator: '-line' (4238,29): run-time error CSS1039: Token not allowed after unary operator: '-r' (4239,26): run-time error CSS1039: Token not allowed after unary operator: '-shadow' (4246,39): run-time error CSS1039: Token not allowed after unary operator: '-line' (4265,32): run-time error CSS1039: Token not allowed after unary operator: '-line' (4268,21): run-time error CSS1039: Token not allowed after unary operator: '-text' (4281,32): run-time error CSS1039: Token not allowed after unary operator: '-line' (4282,21): run-time error CSS1039: Token not allowed after unary operator: '-muted' (4289,25): run-time error CSS1039: Token not allowed after unary operator: '-text' (4295,21): run-time error CSS1039: Token not allowed after unary operator: '-muted' (4476,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4477,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4478,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4479,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4480,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4481,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4482,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4483,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4484,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4485,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4486,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4487,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4488,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4489,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4490,28): run-time error CSS1039: Token not allowed after unary operator: '-strat-bg' (4491,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (4522,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (4528,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (4579,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4580,46): run-time error CSS1039: Token not allowed after unary operator: '-tw-space-y-reverse' (4581,40): run-time error CSS1039: Token not allowed after unary operator: '-tw-space-y-reverse' (4586,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4587,46): run-time error CSS1039: Token not allowed after unary operator: '-tw-space-y-reverse' (4588,40): run-time error CSS1039: Token not allowed after unary operator: '-tw-space-y-reverse' (4602,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (4662,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (4686,28): run-time error CSS1039: Token not allowed after unary operator: '-strat-chip-border' (4688,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (4701,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (4708,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (4713,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (4718,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (4738,28): run-time error CSS1039: Token not allowed after unary operator: '-strat-chip-border' (4740,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (4750,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (4756,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (4776,66): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (4786,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (4848,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (4897,26): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (4898,28): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (4915,28): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (4923,30): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (4932,28): run-time error CSS1039: Token not allowed after unary operator: '-strat-amber' (4944,25): run-time error CSS1039: Token not allowed after unary operator: '-strat-amber' (4973,26): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (4977,53): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (4977,73): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (4988,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (4993,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5007,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (5013,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (5019,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-amber' (5053,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5054,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5055,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5056,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5057,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5058,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5059,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5060,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5061,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5062,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5063,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5064,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5065,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5069,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5070,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5071,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5072,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5073,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5074,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5075,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5076,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5077,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5078,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5079,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5080,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5081,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (5082,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (5087,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5121,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5127,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5163,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5195,22): run-time error CSS1039: Token not allowed after unary operator: '-strat-panel' (5196,28): run-time error CSS1039: Token not allowed after unary operator: '-strat-panel-border' (5197,25): run-time error CSS1039: Token not allowed after unary operator: '-strat-radius' (5203,26): run-time error CSS1039: Token not allowed after unary operator: '-strat-panel-hover' (5215,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5228,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5234,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5240,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5285,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (5289,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5294,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5301,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5347,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5352,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5373,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5379,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5414,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5421,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5467,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5474,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5485,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5490,25): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5499,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5510,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5515,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5563,89): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5564,72): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5568,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5574,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5584,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5592,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5598,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5656,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5660,60): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5664,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5684,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5723,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5749,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5770,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5782,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5787,48): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5836,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5858,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5868,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (5879,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5916,24): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (5922,24): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (5942,24): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (5951,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5957,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (5962,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (5977,26): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (5981,49): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (5981,69): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (5992,30): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (6040,22): run-time error CSS1039: Token not allowed after unary operator: '-strat-panel' (6041,28): run-time error CSS1039: Token not allowed after unary operator: '-strat-panel-border' (6044,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (6076,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6082,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6086,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6093,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6105,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6149,22): run-time error CSS1039: Token not allowed after unary operator: '-strat-panel' (6157,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (6166,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6174,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-green' (6178,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (6190,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6197,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6223,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6227,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6353,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (6359,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6365,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6373,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6423,28): run-time error CSS1039: Token not allowed after unary operator: '-strat-chip-border' (6425,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6435,21): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6445,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6465,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6494,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6499,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (6508,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-brand' (6525,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6532,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (6533,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (6534,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (6535,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (6546,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (6556,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (6561,115): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6563,146): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6564,74): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6568,75): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6569,59): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6578,101): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6580,82): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6586,73): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6607,147): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink-strong' (6608,44): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6609,47): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted-2' (6610,76): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6611,65): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6631,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (6639,47): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6644,112): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6645,38): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (6666,55): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6673,66): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6674,47): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (6680,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6706,57): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6707,47): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (6708,57): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6722,17): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (6727,54): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6738,34): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6743,138): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6763,54): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6772,35): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' (6775,116): run-time error CSS1039: Token not allowed after unary operator: '-strat-ink' (6788,53): run-time error CSS1039: Token not allowed after unary operator: '-strat-muted' */ /******** FIXES ********/ .navbar-fixed-top, .navbar-fixed-bottom{ z-index: 1; } .col-form-label { padding-top: calc(0.375rem + 1px); padding-bottom: calc(0.375rem + 1px); margin-bottom: 0; font-size: inherit; line-height: 1.5; } .card-image-cont { position: relative; } span { padding: unset; } div.container{ max-width: 100%; } .landingBgColor{ padding-top: 0px; } .dropdown-menu{ z-index: 10000; } .flex-container-hidden{ overflow: hidden; } .seo-info{ display: none; } .owl-carousel { display: none; } .no-js .owl-carousel { display: block; } .owl-carousel.owl-loaded { display: block; } @media screen and (max-width: 992px) { .half-stripe div, .half-stripe label, .half-stripe .control-label, .half-stripe h1 { color: white; } .half-stripe select { background-color: white; } .half-stripe .btn-primary { background-color: #23527c; border-color: #23527c; } .half-stripe a { text-decoration: underline; color: #366fff; } .half-stripe .container .row>div { padding-bottom: 0; } .half-stripe .container .row>div:not(:first-child) { padding-top: 0; } } @media screen and (max-width: 1200px) { .landingBgColor { padding-top: 108px; } } .BFDataTable-loadmore h5 { color: #eb3a24; } .landingBgImg { background: url(/assets/images/bgs/homepage-v2.png) no-repeat top left; background-color: #243c52; } @media screen and (max-width: 1200px) { .landingBgImg { padding-top: 108px; background: url(/assets/images/bgs/tabletHomepage.png) no-repeat top left; background-color: black; background-size: contain; } } .rewardFooter { height: 500px; } @media screen and (max-width: 767px) { .landingBgImg { background: black; } .rewardFooter { height: 450px; } } .footer a, .themeProject a, .summery_hero_area a { color: white; } ._jq-expandable p { margin-bottom: 0.5em; } [data-redir] { cursor: pointer; } .distributorCarousel img { width: 250px; height: 150px; object-fit: scale-down; } [style*="--aspect-ratio"] iframe, [style*="--aspect-ratio"] img { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; object-fit: cover; object-position: top; border: none; } .headerUser-vm-container { display: flex; align-items: center; gap: 0.25em; margin-right: 1em; } .headerUser-vm-container-base { margin-top: 4px; margin-bottom: 4px; } .headerUser-vm-label { color: white; } .nav-search-text{ border-radius: 0.33em; border: 0; padding: 0 0.5em; margin-top: 0.1em; } .nav-search-text { outline: none; } ul.ui-autocomplete { padding: 0 5px; overflow-y: auto; max-height: 300px; } .ui-autocomplete .ui-menu-item-wrapper { white-space: nowrap; text-overflow: ellipsis; max-width: 400px; overflow: hidden; } .ui-autocomplete li.ui-menu-item{ list-style-type: none; } .news_pic { position: relative; } .about_hero_area .about_hero_pic { max-width: 860px; } .audience_hero .about_hero_pic { max-width: 392px; } .contact_details_social li a img { max-height: 24px; } .summery_hero_area .ProjectTitleContainer { height: 300px; } .summery_hero_area .ProjectTitleContainer span { color: white; text-transform: capitalize; } .testimonial_slide img { border-radius: 50%; } .partners_item { height: 260px; margin: auto; display: flex; align-items: center; justify-content: center; padding: 0 30px; } .partners_item_txt h4 { text-decoration: none; } .for-card a { color: white; } .for-card a:hover { text-decoration: none; } .for-card svg { color: white; } .rewards_tickets_box { position: relative; } .rewards_tickets_box_icon { top: 25%; transform: translate(25%, -30%); } .dashboardCreator .rewards_tickets_box_icon { margin-left: -55px; } @media only screen and (max-width: 15000px) and (min-width: 1025px) { .video_slider_ext li { width: 940px !important; max-width: 100vw; } } @media only screen and (max-width: 1025px) and (min-width: 768px) { .video_slider_ext li { width: 500px !important; max-width: 100vw; } } @media only screen and (max-width: 768px) and (min-width: 400px) { .video_slider_ext li { width: calc(100vw - 40px) !important; } } /***************** Project Summary *********************/ .marketing_video_iframe { padding-top: 56.25%; } .marketing_video_iframe iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } /******** ADDITIONAL ********/ .RME-inline { max-height: 30px; } .fa-sort-down { transform: translate(0,-25%); margin-left: 8px; } .fa-sort-up { transform: translate(0,25%); margin-left: 8px; } .fa-sort { margin-left: 8px; } .jcarouselLoadingContainer { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } .jcarouselLoadingContainer > .LoadingSpin { left: 50%; top: 50%; position: absolute; z-index: 100; transform: translate(-50%, -50%); } .BFDataTable img.proj-icon1 { position: absolute; left: 16px; width: 56px; height: 56px; top: 16px; z-index: 3; } .BFDataTable img.proj-icon2 { position: absolute; left: 88px; width: 56px; height: 56px; top: 16px; z-index: 3; } select.BFDataTable-filter { min-width: 20em; } select.BFDataTable-filter.shorter { min-width: 10em; } .BFDataTable-filter-popupselect-item { display: none; } .BFDataTable-filter-popupselect-popup img { height: 1em; } .PopupSelectPopupUI label { display: flex; } .PopupSelectPopupUI label input { margin: 0 0.5em; transform: scale(1.5); } .BFTooltip { padding: 0.5em; position: absolute; z-index: 9999; max-width: 400px; -webkit-box-shadow: 0 0 5px #aaa; box-shadow: 0 0 5px #aaa; font-size: 15px; line-height: 1em; text-align: center; background-color: white; } .BFTooltipIcon { display: inline-block; width: 20px; height: 20px; background-image: url(/Content/images/bf-tooltip.png); background-position: center; background-size: contain; margin-left: 5px; vertical-align: top; } .BF-mandatory { color: #a94442; } i.BF-mandatory::after { content: '*'; } div.VideoPlayIcon { width: 100px; height: 100px; background-image: url(/Content/images/playicon.png); background-position: center; background-size: contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); cursor: pointer; } div.VideoPlayIconSmall { width: 40px; height: 40px; background-image: url(/Content/images/playicon.png); background-position: center; background-size: contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); cursor: pointer; } .LoadingSpin { max-height: 200px; max-width: 200px; display: block; margin: auto; } table.BFUITable { width: 100%; } table.BFUITable th { padding: 0 10px 5px 0; font-size: 20px; line-height: 1.75; font-weight: 600; color: #636466; } table.BFUITable td { padding: 0 10px 10px 0; vertical-align: top; } table.BFUITable td input { width: 100%; } table.BFUITable td input[type='radio'] { width: auto; } table.BFUITable td label { display: inline; font-weight: normal; } table.BFUITable td.TeamMemberRole { min-width: 10em; } table.BFUITable td.ReceiptsColumn { min-width: 25em; } table.BFUITable td.DebtOfferRevShareAmount input { width: calc( 100% - 30px); } .BFDebtOfferRevShare table.BFUITable th { font-weight: 400; color: unset; } div.TermsDiv { width: 100%; height: 400px; } div.TermsDiv iframe { width: 100%; height: 100%; overflow: scroll; } .subtitle_area h6 { font-size: 1.25rem; color: #636466; } table.BFLotterySetupTable td { padding: 0.5em; } table.BFLotterySetupTable select { width: 5em; } .DonatePresetCard { cursor: pointer; } .lottery-card { position: relative; background-image: url(/Content/images/LotteryDonation.png); background-position: center; background-size: cover; padding-top: 125%; margin-bottom: 1em; width: 100%; } .lottery-card-chances { background-image: url(/Content/images/LotteryDonationChances.png); } .lottery-card p { top: 48%; left: 50%; transform: translate(-50%, -50%); position: absolute; text-align: center; color: white; font-size: 25px; margin: 0; } .lottery-card p.MoreChancesLabel { top: 0.5em; height: 1.5em; line-height: 1.5em; left: 50%; font-size: 65%; padding: 0 1em; background-color: #e6096c; transform: translate(-50%, 0); } .lottery-card input { position: absolute; top: 75%; transform: translate(-50%, -50%); left: 50%; background-color: #636466; border-radius: 1.5em; padding: 8px 16px; font-size: 18px; font-weight: normal; } .FanRewardTypeSubtitle { margin-top: 5px; } .RewardAmountTradeRow h2 { margin-top: 36px; margin-bottom: 12px; } .RewardAmountTradeRow p { margin-top: 12px; margin-bottom: 24px; } .RewardTradeTiersTable { width: 100%; } .RewardTradeTiersTable td, .RewardTradeTiersTable th { padding: 5px 10px; } .TradeRewardTiersLabel { margin-right: 5px; } .title_area { gap: 20px; align-items: center; } .title_area_icon { top: 25%; } .radio-row { padding-top: 7px; display: flex; } .radio-row input[type='radio'] { margin-right: 1em; } .tour-close-container { cursor: pointer; margin-left: 1em; } .BFTalentShortBio { display: none; } .BFTalentOfficer { display: none; } .BFTalentRole { display: none; } .BFTalentTeamRole { display: none; } .BFTalentsShowShortBio .BFTalentShortBio { display: block; } .BFTalentsShowOfficer .BFTalentOfficer { display: block; } .BFTalentsShowRole .BFTalentRole { display: block; } .BFTalentsShowTeamRole .BFTalentTeamRole { display: block; } .BFPreSalesFilmLabel { display: none; } .BFPreSalesOtherLabel { display: none; } .BFPreSalesFilm .BFPreSalesFilmLabel { display: initial; } .BFPreSalesOther .BFPreSalesOtherLabel { display: initial; } svg.removeIcon { border-radius: 50%; font-size: 24px; width: 24px; height: 24px; padding: 4px; background: #eaeaea; opacity: .9; border-radius: 50%; } /*MarketQuotes*/ .mrkt-q-detailed > div { display: table-row; } .mrkt-q-detailed > div > div { display: table-cell; } .mrkt-q-detailed > div > div:first-child { text-align: right; padding: 0 4px 0 0; } .mrkt-q-detailed > div > div:last-child { text-align: left; padding: 0 0 0 4px; } /*rme-topup*/ .rme-topup-status { color: blue; } .rme-topup-enable { cursor: pointer; } /*private assets*/ .crypto-header { margin-top: 48px; } .invest-payment-row { display: flex; height: 3em; margin-bottom: 1.5em; gap: 0.25em; align-items: center; } .invest-payment-row.Banxa { flex-wrap: wrap; } .invest-payment-row-mm { display: flex; margin-bottom: 1.5em; align-items: center; } .invest-payment-row > div:first-child { width: 1em; justify-content: center; } .invest-payment-row label { display: inline; font-weight: 400; margin: 0; } .invest-payment-row-mm label { display: inline-block; font-weight: 400; } .invest-payment-row label.long-label { width: 25em; } .invest-payment-row img { max-width: fit-content; height: 3em; } img.VisaMC-Inline { max-height: 1.5em; } .partners-color { color: #09d7ee; } .copy-clipboard { max-height: 35px; cursor: pointer; } .copy-clipboard.small { max-height: 1.2em; margin: 0.1em 0.2em -0.1em 0.2em; } .copy-clipboard.small.inline { margin: -0.2em 0.2em 0.1em 0.2em; } .form-control.copy-followed { max-width: 500px; } .metamask-token-add-icon { max-height: 1.2em; margin: 0 0.2em; cursor: pointer; } .order-ex-statusline { display: flex; flex-direction: row; align-items: center; } .order-ex-statusline img { height: 0.75em; width: 0.75em; margin-right: 0.25em; } .rrr-chart-ticker-container { display: flex; flex-direction: row; align-items: baseline; margin-bottom: 1vw; gap: 2em; } .rrr-chart-ticker-container input, .rrr-chart-ticker-container select { max-width: 10em; } .AssetAllocationTable td { min-width: 120px; } .AssetAllocationTable th { width: 150px; } .AssetAllocationTable td.AssetAllocationSymbol, .AssetAllocationTable td.AssetAllocationQuantity { min-width: 60px; } .AssetAllocationTable td.AssetAllocationName { min-width: 275px; } .AssetAllocationTable td.AssetAllocationUrl { min-width: 225px; } .AssetAllocationTable td.AssetAllocationFreq { min-width: 225px; } .col-md-6.Register-right { padding: 0; } .RegisterRMCPromoBanner { display: flex; flex-direction: row; height: 150px; background-color: #243b52; justify-content: space-evenly; margin-right: -50px; } .RegisterRMCPromoBanner-text { width: 375px; font-size: 32px; color: white; margin: auto 25px; } .RegisterRMCPromoBanner-image { display: flex; flex-direction: column; justify-content: center; } .RegisterRMCPromoBanner-image img { width: 150px; } .socialLoginList { display: flex; flex-direction: row; gap: 15px; } .socialLoginList button { background-color: transparent; border-radius: 5px; border: 1px solid black; padding: 5px 15px; width: 195px; height: 50px; } .socialLoginList button img { max-height: 100%; } .socialLoginsSeparator { margin-top: 30px; display: flex; justify-content: center; max-width: 405px; } .socialLoginsSeparator-bar { border-top: 1px solid #aaaaaa; width: 100%; margin-top: 0.65em; } .socialLoginsSeparator-label { margin: 0 10px; color: #aaaaaa; } @media screen and (max-width: 768px) { .form-control.copy-followed { max-width: calc(100vw - 80px); } .col-md-6.Register-right { padding: 0 10px; } } /*ai-chat*/ /* Scope default typography with low specificity so utility classes (e.g., .text-xs) can override */ .ai-container .ai-chat-container * { color: inherit; font-size: inherit; } .ai-container .ai-chat-container .btn { color: #fff; font-size: 15px; } .ai-container .ai-chat-container .btn.btn-primary { background: #4f7cff; border-color: #4f7cff; } .ai-container .ai-chat-container .btn.primary { background: #253985; color: #fff; height: 40px; border-radius: 10px; border: 1px solid transparent; font-weight: 800; cursor: pointer; margin: 10px; } .ai-container .ai-chat-container .btn.primary:hover { background: #1d4ed8; } /* Let inline icons inherit current text color instead of forced black */ .ai-container .ai-chat-container svg { color: inherit; stroke: currentColor; fill: none; } .ai-container .content { max-width: none; /*margin: 15px;*/ } .ai-container.ai-home-sample div, .ai-container.ai-home-sample p, .ai-container.ai-home-sample span { color: white; } .ai-container.ai-home-sample div.chat-ai-request { color: black; } .ai-container a { color: darkblue; font-size: 1em; } .ai-chat-container { display: flex; flex-direction: row; justify-content: stretch; /*gap: 2em;*/ } .tab-container.ai .ai-chat-container { background: #132b47; } .ai-chat-nav-container { width: 20em; min-width: 20em; position: sticky; top: 0; height: fit-content; } .ai-alerts .ai-chat-nav-container { width: 30em; min-width: 30em; } .ai-trading .ai-chat-nav-container { width: 30em; min-width: 30em; } .ai-chat-nav { display: flex; flex-direction: column; padding: 1em; background-color: #ebeff8; border-radius: 1em; position: relative; margin: 25px 15px; } .ai-chat-nav div, .ai-chat-nav li, .ai-chat-nav span { font-size: 1em; } .ai-chat-nav-titles-mobile{ display: none; } div.ai-chat-nav-title { font-weight: bold; margin-bottom: 0.5em; font-size: 1.33em; } div.ai-chat-nav-subtitle { font-size: 0.9em; } div.ai-chat-nav-title:not(:first-child) { margin-top: 1em; } div.ai-chat-nav-title .ai-chat-nav-title-new { margin-left: 2em; color: #00008b; font-size: 75%; cursor: pointer; } .ai-chat-nav div.ai-chat-nav-section { display: inline-block; font-weight: bold; color: #5b7a93 } .ai-chat-nav ul { margin: 0; padding: 0; } .ai-chat-nav li { margin: 0; padding: 0.5em 0 0.5em 1.75em; list-style: none; background-image: url(/Content/images/chat-bullet.png); background-repeat: no-repeat; background-position: left center; background-size: 1.25em; cursor: pointer; /*make it appear on single line with ellipsis*/ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ai-chat-nav div.ai-chat-nav-container-chats { margin-top: 20px; } img.ai-chat-prompt-icon { display: inline-block; height: 1.25em; margin-right: 0.5em; width: auto; } .ai-chat-folder-active { background: #f0f7ff; border-color: #3498db; } .ai-chat-folder-hover { background: #e1f0ff; border-color: #2980b9; } li.ai-chat-folder-chat { cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ai-chat-nav-alerts-edit { background-image: url(/Content/images/gear-icon.png); background-size: contain; background-repeat: no-repeat; width: 1.5em; height: 1.5em; cursor: pointer; position: absolute; right: 1em; top: 2em; } .chat-ai-settings-overlay, .ai-monitoring-confirm-overlay { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.55); z-index: 10000; align-items: center; justify-content: center; } .chat-ai-settings-overlay.visible, .ai-monitoring-confirm-overlay.visible { display: flex; } .ai-monitoring-confirm-overlay .ai-approve-modal { max-width: 380px; } .chat-ai-settings-overlay .ai-approve-modal { animation: chat-ai-settings-fadein .2s ease; } @keyframes chat-ai-settings-fadein { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: scale(1); } } .chat-ai-settings-overlay .chat-ai-settings-option-error { font-size: 11px; color: #f87171; margin-top: 4px; } .chat-ai-settings-overlay .chat-ai-settings-test-send-result { font-size: 12px; margin-top: 0; } .ai-chat-upload-portfolio-container { text-align: center; } .btn.ai-chat-upload-portfolio { font-size: 0.9em; height: 2.25em; padding: 0 0.75em; border-radius: 0.75em; margin: 1em; } .ai-chat-your-header{ font-weight: bold; } .sidebar-folder-history div.folder-items>div { display: none; } .sidebar-folder-history div.folder-items > div:nth-child(-n+5) { display: block; } .sidebar-folder-history div.folder-items > div:last-child { display: block; } .ai-chat-showmore, .ai-chat-your-list-loadmore { cursor: pointer; display: flex; flex-direction: row; align-items: center; } .ai-container .fa { margin: 0.5em 0.65em 0.5em 0.15em; color: #5a5a5a; font-size: 1.5em; line-height: 0.75em; margin: 0.25em; } .ai-chat-main { width: calc(100% - 20em); padding: 25px 15px; background-color: white; } /* .ai-chat-main p { text-align: center; }*/ /* ai-portf-dashboard */ .ai-portf-dashboard, .ai-portf-dashboard * { --bg: #0e2239; --panel: #132b47; --panel-hover: #173556; --panel-border: #1d3b5c; --ink: #d7e4f7; --ink-strong: #e9f2ff; --muted: #9fb3cc; --muted-2: #87a0bb; --brand: #4f7cff; --risk: #ef4444; --opp: #16a34a; --reb: #f59e0b; --chip-border: rgba(187,210,245,.14); } .ai-portf-dashboard *, .ai-portf-dashboard ::after, .ai-portf-dashboard ::before { box-sizing: border-box; border-width: 0; border-style: solid; border-color: #e5e7eb; } .ai-portf-dashboard { background-color: var(--bg); color: var(--ink); font-family: system-ui,ui-sans-serif; padding: 2em; width: 100%; } .ai-container .ai-portf-dashboard * { color: var(--ink); } .ai-portf-dashboard .bg-zinc-900 { background-color: var(--panel) !important } .ai-portf-dashboard .border-zinc-800 { border-color: var(--panel-border) !important } .ai-portf-dashboard .hover\:bg-zinc-800\/60:hover { background-color: var(--panel-hover) !important } .ai-portf-dashboard .hover\:bg-zinc-800\/50:hover { background-color: var(--panel-hover) !important } .ai-portf-dashboard .text-zinc-200 { color: var(--ink-strong) !important } .ai-portf-dashboard .text-zinc-300 { color: #cfe1ff !important } .ai-portf-dashboard .text-zinc-400 { color: var(--muted) !important } .ai-portf-dashboard .text-zinc-500 { color: var(--muted-2) !important } .ai-portf-dashboard .bg-zinc-950\/60 { background-color: rgba(12,26,44,.6) !important } .ai-portf-dashboard select { color: var(--ink) } .ai-portf-dashboard .font-medium { font-weight: 500; } .ai-portf-dashboard .text-sm { font-size: 0.875rem; line-height: 1.25rem; } .ai-portf-dashboard .text-xs { font-size: 0.75rem; line-height: 1rem; } .ai-portf-dashboard .text-2xl { font-size: 1.5rem; line-height: 2rem; } .ai-portf-dashboard .py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; } .ai-portf-dashboard .px-2 { padding-left: 0.5rem; padding-right: 0.5rem; } .ai-portf-dashboard .ai-portf-items .BFDataTable-data { margin: 1.5rem 0; display: grid; gap: 1.5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); } .ai-portf-dashboard .badge { padding: .2rem .55rem; border-radius: 9999px; border: 1px solid var(--chip-border); font-size: .72rem } .ai-portf-dashboard .badge.badge-light { background-color: #1E2730; color: #AAB4BD; border-color: #2A333D; } .ai-portf-dashboard .pill { padding: .2rem .55rem; border-radius: .5rem; font-size: .72rem; font-weight: 700 } .ai-portf-dashboard .pill-risk { background: rgba(239,68,68,.14); color: #ffb4b4 } .ai-portf-dashboard .pill-op { background: rgba(22,163,74,.14); color: #aef2c9 } .ai-portf-dashboard .pill-reb { background: rgba(245,158,11,.16); color: #ffe1a6 } .ai-portf-dashboard .pill-neu { background-color: #1E2730; color: #AAB4BD; } .ai-portf-dashboard .cta { background: var(--brand); color: #fff } .ai-portf-dashboard .cta:hover { filter: brightness(1.05) } .ai-portf-dashboard .client-chip { padding: .08rem .5rem; border-radius: .5rem; border: 1px solid rgba(255,255,255,.15); color: #e9f2ff; font-weight: 600; background: rgba(255,255,255,.03) } .ai-portf-dashboard .card { position: relative; background: linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02)); border: 1px solid rgba(187,210,245,.14); border-radius: 16px; box-shadow: 0 6px 16px rgba(10,20,35,.18); overflow: hidden; /* per-card accent variable; set inline: style="--accent: var(--risk)" etc. */ --accent: var(--reb); } .ai-portf-dashboard .card .accent { position: absolute; left: 0; top: 0; bottom: 0; width: 4px; opacity: .95; background: linear-gradient(to bottom, var(--accent), color-mix(in oklab, var(--accent) 60%, transparent)); } .ai-portf-dashboard .card-header { padding: 14px 16px 0 20px } .ai-portf-dashboard .card-meta { padding: 0 16px 10px 20px } .ai-portf-dashboard .card, .ai-portf-dashboard .card div, .ai-portf-dashboard .card span, .ai-portf-dashboard .card a { color: var(--ink); } .ai-portf-dashboard .card .text-zinc-200 { color: var(--ink-strong) !important; } .ai-portf-dashboard .card .text-zinc-300 { color: #cfe1ff !important; } .ai-portf-dashboard .card .text-zinc-400 { color: var(--muted) !important; } .ai-portf-dashboard .card-body { padding: 12px 16px 14px 20px } .ai-portf-dashboard .card-footer { padding: 12px 16px 16px 20px; border-top: 1px dashed rgba(187,210,245,.14) } .ai-portf-dashboard .mini { background: rgba(12,26,44,.35); border: 1px solid rgba(187,210,245,.12); border-radius: 12px; padding: 12px } .ai-portf-dashboard .glass { background: linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)); border: 1px solid rgba(187,210,245,.12) } /*end of ai-portf-dashboard*/ .ai-container .ai-main-nav { position: sticky; top: 0; z-index: 100; background-color: white; padding: 1em 0; } .ai-container .ai-main-nav-title { margin: 0.5em 0; font-size: 2em; color: #c4c4c4; font-weight: 600; } .ai-container .ai-main-nav .ai-chat-nav-tabs { margin: 1em 0; gap: 1em; } .ai-container .ai-main-nav .ai-chat-nav-tabs .container-tab { text-decoration: none; width: fit-content; font-size: 1.2em; } .ai-container .ai-main-nav .ai-chat-nav-tabs .container-tab.selected { border-bottom: 2px solid red; } .ai-container .ai-main-nav .get-started-cont { max-width: 100%; } .ai-container .ai-main-nav .get-started-cont .owl-container { height: 8em; } .ai-container .ai-main-nav .get-started-cont .chatCarousel{ width: calc(100% - 40px); margin: 0 20px; } .ai-container .ai-main-nav .get-started-cont .jcarousel-control-prev, .ai-container .ai-main-nav .get-started-cont .jcarousel-control-next { margin: 0; width: 15px; } .ai-container .ai-main-nav .get-started-cont .jcarousel-control-prev i, .ai-container .ai-main-nav .get-started-cont .jcarousel-control-next i{ font-size: 2em; margin: 0; } .ai-container .ai-main-nav .get-started-cont ul { display: flex; padding: 0; margin: 0.5em 0; flex-wrap: nowrap; height: 8em; } .ai-container .ai-main-nav .get-started-cont li { height: 8em; width: 15em; min-width: 15em; border-radius: 0.5em; padding: 0.5em; background-color: #ebeff8; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .ai-container .ai-main-nav .get-started-cont .owl-nav { position:absolute; left: -20px; top: 50%; transform: translateY(-50%); width: calc(100% + 40px); display: flex; justify-content: space-between; z-index: -1; } .ai-container .ai-main-nav .get-started-cont .owl-nav button{ width: 20px; outline: none; } .ai-container .ai-main-nav .get-started-cont .owl-nav button span { color: #aaa; font-size: 3em; } .ai-container .ai-main-nav-cont { display: flex; flex-direction: row; gap: 1em; justify-content: left; /*max-width: 650px;*/ } .ai-container .ai-main-nav-cell { font-size: 15px; line-height: 1.5em; margin-top: 2em; margin: 2em auto 0 auto; width: 9.5em; height: 10em; padding: 0.95em; background-color: #ebeff8; position: relative; cursor: pointer; } .ai-container .ai-main-nav-cell:hover { background-color: #cfd4e3; } .ai-container .ai-main-nav-cell img { position: absolute; right: 0.5em; bottom: 0.5em; max-height: 2em; margin: 0 auto; } .ai-container .ai-chat-nav-create-strategy-row .ai-chat-showmore-your-chats { display: none; } .ai-chat-conv-container { width: 90%; padding: 1em; /*background-color: #eaeff9;*/ border-radius: 1em; min-height: 500px; } .ai-chat-conv { display: flex; flex-direction: column; } .ai-chat-conv h1{ font-size: 22px; } .ai-chat-conv h2{ font-size: 21px; } .ai-chat-conv h3{ font-size: 20px; } .ai-chat-conv h4{ font-size: 18px; } .ai-chat-conv h5{ font-size: 17px; } .ai-chat-conv h6{ font-size: 16px; } .ai-chat-conv .finsec-chart-tabs h5 { font-size: 15px; } .ai-chat-send-container { width: 100%; display: flex; flex-direction: row; gap: 1em; align-items: center; margin-top: 1em; justify-content: stretch; } .ai-chat-send { background-color: transparent; background-image: url(/Content/images/send-msg-button-light.png); background-position: center; background-size: contain; background-repeat: no-repeat; height: 2em; width: 2em; } .ai-chat-send img { max-height: 2em; } .ai-chat-msg { border: 0; outline: none; padding: 1em; border-radius: 1em; width: 100%; color: black; background-color: #ebeff8; height: 5em; } .ai-alert-msg::-webkit-input-placeholder { white-space: pre-line; position: relative; top: -0.5em; } .chat-ai-request, .chat-ai-response { border-radius: 1em; padding: 0.75em; max-width: 80%; font-size: 0.75em; margin-bottom: 0.5em; } .chat-ai-request { background-color: beige; align-self: flex-end; } .chat-ai-request-edit { background-image: url(/Content/images/pencil-icon.png); background-size: contain; background-repeat: no-repeat; width: 1.5em; height: 1.5em; cursor: pointer; margin: 1em 0 0 1em; float: right; } .chat-ai-response { background-color: transparent /*honeydew*/; align-self: flex-start; overflow: hidden; } .chat-ai-preresponse { background-color: transparent; align-self: flex-start; overflow: hidden; } .chat-ai-response img { display: block; max-width: 80%; max-height: 400px; margin: 2em auto; } .chat-ai-response ul { margin: 1em 0 0 0; } .chat-ai-response table { display: block; margin: 0 auto 2em auto; width: 100%; overflow: auto; padding: 0 0 1em 0; } .chat-ai-response-chart { min-width: 90%; } .ai-container .chat-ai-exp { display: inline-block; font: normal normal normal 14px / 1 FontAwesome; font-size: 1.5em; text-rendering: auto; -webkit-font-smoothing: antialiased; margin: 0 10px; } .chat-ai-exp.collapsed:before { content: "\f107"; } .chat-ai-exp.expanded:before { content: "\f106"; } .ai-chat-main .chat-ai-buy div { display: inline-block; margin: 0.2em 0.4em 0.2em 0; } .ai-chat-main .chat-ai-buy div > .chat-ai-sec-cont { display: flex; flex-direction: column; gap: 10px; } .ai-chat-main .chat-ai-button { border-radius: 0.5em; background-color: #e8641b; padding: 0.33em; color: white; display: inline; cursor: pointer; } .ai-chat-main .chat-ai-fus { margin-bottom: 1em; } .ai-chat-main .chat-ai-fus-label { margin: 1em 0; } .ai-chat-main .chat-ai-fu { display: inline-block; margin: 0.2em; border-radius: 0.5em; /*border: 1px solid #2649db;*/ background-color: beige; padding: 0.75em; /*color: #2649db;*/ cursor: pointer; } .chat-ai-response li{ font-size: unset; } /* Table header styles */ .chat-ai-response th { background-color: #f2f2f2; } /* Table cell styles */ .chat-ai-response td, th { border: 1px solid #ddd; /* Inner row lines color */ padding: 8px; text-align: left; } /* Alternating row colors for better readability */ .chat-ai-response tr:nth-child(even) { background-color: #f9f9f9; } .chat-ai-response tr:nth-child(odd) { background-color: #ffffff; } .ai-chat-loading img { max-height: 3em; } .ai-chat-loading img { max-height: 3em; } .ai-container div.ai-coming-soon { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 500px; margin: 1em auto; } .ai-container div.ai-coming-soon p { font-size: 1.5em; } .chat-ai-response-share-container { margin-top: 2em; display: flex; flex-direction: row; align-items: center; gap: 0.33em; } /*.chat-ai-response-share img{ max-height: 1.5em; margin: 0 0.5em; }*/ .ai-chat-share-icon { width: 2em; height: 2em; background-image: url(/Content/images/share_icon_light.png); background-position: center; background-size: contain; background-repeat: no-repeat; } .ai-chat-market-insight-icon { width: 2em; height: 2em; background-image: url(/Content/images/market_insights.png); background-position: center; background-size: contain; background-repeat: no-repeat; } .chat-ai-response-share a:hover { text-decoration: none; } .chat-ai-share-content-buttons-social img { max-height: 2.5em; margin: 0 0.5em; } .chat-ai-publish-content-text { margin: 1em 0; } button.chat-ai-share-content-pdf{ border-radius: 0; } .chat-ai-dlg input[type='text'], .chat-ai-dlg textarea, .chat-ai-dlg select { width: 100%; padding: 0.5em; border-radius: 0.5em; margin: 0 0 1em 0; color: black; background-color: #ebeff8; } .chat-ai-dlg .BFImageUpload img { max-height: 100px; max-width: 100px; } .chat-ai-dlg-buttons { display: flex; align-content: center; justify-content: center; gap: 1em; } .chat-ai-share-content-title, .chat-ai-share-content-link { margin-bottom: 1em; } .chat-ai-content-comments textarea { height: 50px; } .chat-ai-spacer { height: 200px; } .chat-ai-dlg-title { font-weight: bold; } .ai-chat-mobile-title { display: none; } .ai-insight-details-image { max-width: 600px; max-height: 300px; } .ai-insight-share-buttons { display: flex; } .ai-chat-chart-icon { width: 3em; height: 2em; background-image: url(/Content/images/ai-chart-icon.png); background-position: center; background-size: contain; background-repeat: no-repeat; cursor: pointer; } .ai-chat-alert-icon { width: 3em; height: 1.5em; background-image: url(/Content/images/ai-alert-icon.png); background-position: center; background-size: contain; background-repeat: no-repeat; cursor: pointer; } .ai-chat-alert-create-icon { display: inline-block; width: 3em; height: 1.5em; background-image: url(/Content/images/ai-alert-icon.png); background-position: center; background-size: contain; background-repeat: no-repeat; cursor: pointer; } .ai-chat-alert-create-icon.buy { background-image: url(/Content/images/ai-alert-icon-buy.png); } .ai-chat-alert-create-icon.sell { background-image: url(/Content/images/ai-alert-icon-sell.png); } .ai-container.ai-chat-chart-label { width: 3em; height: 2em; } .chat-ai-alert-suggestion { display: flex; width: 100%; justify-content: start; margin: 0.75em 0; align-items: center; margin: 0.5em 0; } .chat-ai-alert-suggestion-header{ font-weight: bold; font-size : 1.25em; margin: 1em 0; } .ai-container .ai-chat-chart-button { height: 1.5em; } .ai-container .ai-chat-chart-label { height: 2em; align-content: center; } .ai-container .ai-chat-alert-label { height: 1.5em; align-content: center; } .ai-container .ai-chat-form-field { display: flex; flex-direction: column; align-items: start; margin: 1em 0; } .ai-container .ai-chat-form-field .ai-chat-onb-val { width: 100%; } .ai-container .ai-chat-form-field input, .ai-container .ai-chat-form-field textarea, .ai-container .ai-chat-form-field select { border: 0; outline: none; padding: 1em; border-radius: 1em; width: 100%; color: black; background-color: #ebeff8; } .ai-container .ai-chat-form-field select { height: 3.2em; } .ai-chat-form-field input[type=checkbox]{ width: auto; } .ai-container .ai-chat-cs-form { background: rgba(255,255,255,.02); border: 1px solid rgba(187,210,245,.12); box-shadow: 0 20px 55px rgba(0,0,0,.18); border-radius: 16px; padding: 18px 18px 16px; margin-top: 12px; max-width: 980px; } .ai-container .ai-chat-form-subtitle { color: var(--strat-muted-2); margin-bottom: 14px; font-size: 0.92rem; } .ai-container .ai-chat-form-field label { min-width: 12em; margin: 0 0 6px 0; color: var(--strat-muted-2); font-weight: 600; } .ai-container .ai-chat-form-field input, .ai-container .ai-chat-form-field textarea, .ai-container .ai-chat-form-field select { max-width: 100%; background: rgba(255,255,255,.04); border: 1px solid rgba(187,210,245,.18); color: var(--strat-ink-strong); padding: 12px 14px; border-radius: 12px; box-shadow: inset 0 1px 0 rgba(255,255,255,.02); transition: border-color .15s, box-shadow .15s, background .15s; } .ai-alert-confirmation-container .ai-chat-form-field input, .ai-alert-confirmation-container .ai-chat-form-field textarea, .ai-alert-confirmation-container .ai-chat-form-field select { color: black; } .ai-container .ai-chat-form-field select option { background: #0f172a; color: #e5e7eb; } .ai-container .ai-chat-form-field input:focus, .ai-container .ai-chat-form-field textarea:focus, .ai-container .ai-chat-form-field select:focus { border-color: rgba(79,124,255,.65); box-shadow: 0 0 0 3px rgba(79,124,255,.16); outline: none; background: rgba(255,255,255,.06); } .ai-container .ai-chat-form-field textarea { min-height: 120px; resize: vertical; } .ai-container .ai-chat-checkbox-group { display: flex; flex-wrap: wrap; gap: 8px; } .ai-container .ai-chat-checkbox { display: inline-flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid rgba(187,210,245,.18); border-radius: 10px; background: rgba(255,255,255,.03); color: var(--strat-ink-strong); } .ai-container .ai-chat-checkbox input { width: auto; } .ai-container .ai-chat-cs-buttons { margin: 1rem 0 0.5rem; display: flex; gap: 10px; } .ai-container .ai-chat-cs-buttons .btn { border-radius: 12px; border: 1px solid rgba(79,124,255,.45); background: linear-gradient(145deg, rgba(79,124,255,.22), rgba(79,124,255,.12)); color: var(--strat-ink-strong); font-weight: 700; box-shadow: 0 6px 18px rgba(79,124,255,.18); } .ai-container .ai-chat-cs-buttons .btn.button-home { background: var(--strat-brand); border-color: var(--strat-brand); color: #fff; box-shadow: 0 10px 28px rgba(79,124,255,.32); } .ai-container .ai-chat-cs-buttons .btn:nth-child(2) { background: rgba(255,255,255,.04); border-color: rgba(187,210,245,.28); color: var(--strat-ink-strong); box-shadow: none; } .ai-container .ai-chat-form-buttons { margin: 1em 0; } .ai-container .ai-chat-form-validation { color: #f87171; margin-top: 8px; font-weight: 600; } .ai-container .ai-chat-cs-askai-error { color: red; clear: both; } .ai-container .ai-chat-cs-askai-loading { display: none; max-height: 3em; } .ai-container .ai-chat-cs-createclient { margin-left: 2em; } .ai-container .ai-clients-table .ai-clients-name-cell .ai-clients-edit { display: none; } .ai-container .ai-chat-cc-head { margin-bottom: 2em; display: flex; flex-direction: row; align-items: center; gap: 2em; } .ai-container .ai-chat-cc-head-title { font-size: 2em; font-weight: bold; } .ai-container .ai-chat-cc-head-image { max-height: 5em; max-width: 5em; } .ai-container .ai-chat-cc-step { padding-top: 2em; padding-bottom: 2em; } .ai-container .ai-chat-cc-section-header { margin-top: 2em; text-transform: uppercase; font-size: 1.33em; font-weight: 600; } .ai-container .ai-chat-cc-section-sub-header { margin-top: 1em; font-size: 1.2em; } .ai-container .ai-chat-cc-field-line{ display: flex; flex-direction: row; align-items: center; gap: 1em; } .ai-container .ai-chat-field-pair{ display: flex; flex-direction: row; align-items: center; gap: 1em; } .ai-chat-form-field select.ai-chat-cc-field-val-area { max-width: 6em; } .ai-container .ai-chat-cc-field { flex-direction: column; align-items: flex-start; gap: 0.5em; } .ai-container .ai-chat-cc-field label{ margin-left: 0.1em; } .ai-create-icon { max-height: 1.5em; margin-left: 1em; } .ai-chat-cc-step{ display: none; } .ai-chat-cc-step.active{ display: block; } .ai-chat-cc-getclientlink-loading img{ max-height: 3em; } .chat-ai-brokerfeed-header { margin: 1em 0 0.75em 0; font-size: 1.25em; font-weight: bold; } .ai-chat-vcl-message{ color: blue; } /* Two-column layout */ .ai-chat-form-section { width: fit-content; display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; row-gap: 8px; } /* Each field stays stacked label/value */ .ai-chat-form-field { display: block; } /* Section headers span both columns */ .ai-chat-form-section-header { grid-column: 1 / -1; margin-top: 16px; margin-bottom: 8px; font-weight: 600; } .ai-chat-form-section-header { margin-top: 2em; font-size: 1.5em; font-weight: bold; } .ai-chat-onb-val { padding: 6px 8px; border-radius: 6px; border: 1px solid rgba(0,0,0,.08); background: rgba(0,0,0,.02); } @media screen and (max-width: 768px) { .ai-chat-form-field input { max-width: unset; } .ai-container .ai-chat-cc-field { width: 100%; } .ai-container .ai-chat-cc-field-line, .ai-container .ai-chat-cs-field { flex-direction: column; align-items: start; gap: 0; } .ai-container .ai-clients-table tr > td, .ai-container .ai-clients-table tr > th { display: inline-block; width: 33.33%; } .ai-container .ai-clients-table tr>td:first-child { width: 100%; } .ai-container .ai-clients-table tr>th:first-child, .ai-container .ai-clients-table tr > th:nth-child(5), .ai-container .ai-clients-table tr > th:nth-child(6) { display: none; } .ai-container .ai-clients-table tr > td:nth-child(5), .ai-container .ai-clients-table tr > td:nth-child(6) { display: none; } .ai-container .ai-clients-table .ai-clients-name-cell .ai-clients-edit{ display: inline-block; } } .ai-chat-nav-create-strategy:hover { text-decoration: none; } .ai-chat-nav-strategies table { width: 100%; } .ai-chat-nav-strategies td { padding: 5px 0; } .ai-strategies-edit, .ai-clients-edit { background-image: url(/Content/images/pencil-icon.png); background-size: contain; background-repeat: no-repeat; width: 1.5em; height: 1.5em; cursor: pointer; } .ai-container div.KYCPending { color: #ff7c37 } .ai-container div.KYCApproved { color: #218e00 } .ai-container div.KYCDeclined { color: #ff0000 } .ai-chat-form-loading { display: flex; flex-direction: row; align-items: center; gap: 2em; } .ai-chat-form-loading img { max-width: 5em; } .ai-chat-form-loading .ai-chat-form-loading-text { font-size: 1.25em; color: #2d4c9e; } .ai-container .chat-ai-response-upd-portfolio-err { padding: 1em 0; color: red; } .ai-container .chat-ai-response-upd-portfolio-msg { padding: 1em 0; color: blue; } .ai-chat-nav-aiportfolios td { padding: 0; } .ai-strategies-link { cursor: pointer; } .ai-chat-nav-savedalerts td { padding: 5px 0; } .ai-chat-nav-savedalerts td.ai-alerts-onoff-cell { padding: 3px 5px 3px 0; } .ai-chat-nav-savedalerts td.ai-alerts-freetext-cell, .ai-chat-nav-aitrades td.ai-alerts-freetext-cell { } .ai-chat-nav-savedalerts td.ai-alerts-freetext-cell div, .ai-chat-nav-aitrades td.ai-alerts-freetext-cell div { display: block; width: 23.5em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 0.95em; } .ai-alerts-savedalert-edit, .ai-aitrade-edit { background-image: url(/Content/images/pencil-icon.png); background-size: contain; background-repeat: no-repeat; width: 1.5em; height: 1.5em; cursor: pointer; } .ai-alert-confirmation-container { margin: 30px 10px; } .ai-alert-confirmation, .ai-alert-confirmation-entity-text, .ai-alert-confirmation-descr-text { margin: 15px 0; } .ai-alert-confirmation-name { margin: 15px 0; } .ai-alert-confirmation-name>input { color: black; } .ai-container .ai-alert-error { color: red; } .ai-trading-confirmation-label { margin-top: 0.75em; font-weight: bold; } .ai-trading-confirmation-buttons { margin-top: 1.5em; } .ai-trading-confirmation-step { margin-top: 2em; } .ai-trading-confirmation-value input, .ai-trading-confirmation-value select { color: black; } .ai-subscribe { width: 86vw; margin: 4em auto 2em auto; display: flex; flex-direction: column; } .ai-subscribe-header { margin-top: 20px; text-align: center; } .ai-subscribe-header h4 { font-size: 1.85em; } .ai-subscribe-header h2 { font-size: 1.5em; } .ai-subscribe-header p { margin-top: 24px; font-size: 1.1em; } .ai-subscribe-buttons { text-align: right; margin: 45px 0; } .ai-subscribe-popup-frame .ai-subscribe-buttons { margin: 15px 0; } .ai-subscribe-options { margin-top: 36px; display: flex; flex-direction: row; justify-content: space-between; } .ai-subscribe-option { width: 24vw; } .ai-subscribe-option-header { text-align: center; color: #1b55c0; font-size: 1.8em; } .ai-subscribe-option-header input { margin-left: 20px; } .ai-subscribe-option-content { border: 3px solid #8face0; background-color: #f3f6fc; color: #1b55c0; border-radius: 15px; padding: 15px; height: 23em; } .ai-subscribe-option-content.selected { border-color: #0000bd; } .ai-subscribe-option-content table.ai-subscribe-option-table-main { margin: auto; } .ai-subscribe-option-content table.ai-subscribe-option-table-main td { color: #1b55c0; font-size: 1.25em; padding: 7.5px 5px; } .ai-subscribe-option-content table.ai-subscribe-option-table-main td:last-child { text-align: right; } .ai-subscribe-option-content table.ai-subscribe-option-table-sub { margin: 1em auto 0 auto; } .ai-subscribe-option-content table.ai-subscribe-option-table-sub td { color: black; font-size: 1em; text-align: center; padding: 2px; } .ai-subscribe-confirm { width: 600px; margin: auto; } .ai-subscribe-option-label { font-size: 1.5em; margin: 0 auto 1em auto; background-color: #6b94d7; color: white; height: 3.25em; width: 18vw; border-radius: 0.3em; display: flex; justify-content: center; align-items: center; text-align: center; } .ai-subscribe-pm-label { margin-top: 48px; font-size: 1.25em; } .ai-subscribe-confirm .control-label { font-weight: bold; } .ai-subscribe-h { text-align: center; padding: 2rem 1rem 1rem; } h1.ai-subscribe-h1 { margin-bottom: 0.2rem; font-size: 2rem; } p.ai-subscribe-subtitle { color: #666; margin-bottom: 2rem; } .ai-subscribe-plans { display: flex; flex-wrap: wrap; justify-content: center; gap: 2rem; padding: 2rem; max-width: 1200px; margin: auto; } .ai-subscribe-plan { background: white; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05); padding: 2rem; width: 350px; text-align: left; transition: transform 0.3s ease, box-shadow 0.3s ease; display: flex; flex-direction: column; } .ai-subscribe-plan:hover { transform: translateY(-10px); box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15); } .ai-subscribe-plan h2 { margin: 0.5rem 0; color: #2a4365; text-align: center; } .ai-subscribe-toggle { margin-bottom: 1rem; text-align: center; } .ai-subscribe-price { font-size: 1.5rem; margin: 1rem 0; color: #1a202c; color: #1a202c; text-align: center; } .ai-subscribe-features { line-height: 1.6; flex-grow: 1; } .ai-subscribe-button-container { display: flex; justify-content: center; align-items: center; margin-top: 1rem; } .ai-subscribe-button { background: #2b6cb0; color: white; padding: 0.5rem 1.2rem; border-radius: 5px; text-decoration: none; transition: background 0.3s; white-space: nowrap; } .ai-subscribe-button:hover { background: #2c5282; } .ai-subscribe-footer { text-align: center; font-size: 0.9rem; color: #777; margin: 2rem; } .chat-ai-settings-overlay .input-section .input-label { font-size: 12px; color: var(--strat-muted, #9fb3cc); margin-bottom: 8px; } .chat-ai-settings-overlay .input-section .ai-approve-btn { display: inline-flex; align-items: center; gap: 5px; padding: 8px 14px; border-radius: 6px; font-size: 11px; font-weight: 500; cursor: pointer; border: 1px solid rgba(79,124,255,.25); background: rgba(79,124,255,.15); color: #93c5fd; white-space: nowrap; } div.chat-ai-dlg-validation { color: red; } .chat-ai-player { --card: #fff; --bg: #f5f7fb; --border: #e7eef6; --ink: #0c1b2a; --muted: #6b7f93; --ink2: #334155; --brand: #253985; --brand-2: #1d4ed8; --ok: #16a34a; --sell: #ef4444; --hold: #64748b; --radius: 14px; color: var(--ink); font: 14px/1.35 Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif } .chat-ai-player .card { border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); padding: 16px } .chat-ai-player .hdr { margin-bottom: 6px } .chat-ai-player .title { font-weight: 800; font-size: 22px; line-height: 1.15 } .chat-ai-player .sub { color: var(--muted); font-size: 12px } .chat-ai-player .grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 16px; margin-top: 8px } @media (max-width:900px) { .chat-ai-player .grid { grid-template-columns: 1fr } } .chat-ai-player .field { margin-top: 12px } .chat-ai-player .label { font-weight: 800; font-size: 13px; margin-bottom: 6px } .chat-ai-player .input { border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; color: var(--ink); } .chat-ai-player textarea { width: 100%; height: 7rem; } .chat-ai-player .inline { display: flex; align-items: center; gap: 8px } .chat-ai-player .muted { color: var(--muted); font-size: 12px } .chat-ai-player .player-slider { display: flex; align-items: center; gap: 10px } .chat-ai-player input[type="range"] { width: 100%; accent-color: var(--brand) } .chat-ai-player .btn { margin-top: 12px; height: 40px; border-radius: 10px; border: 1px solid transparent; cursor: pointer; font-weight: 800 } .chat-ai-player .btn.primary { background: var(--brand); color: #fff } .chat-ai-player .btn.primary:hover { background: var(--brand-2) } .chat-ai-player .hint { font-size: 0.75rem; color: black; margin-top: 12px; margin-bottom: 18px; } .chat-ai-player .section-h { font-size: 18px; font-weight: 800; margin: 2px 0 6px } .chat-ai-player .bar { height: 6px; background: #16a34a; border-radius: 6px; margin-bottom: 8px } .chat-ai-player .filters { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0 10px } .chat-ai-player .chip { border: 1px solid var(--border); background: #fff; border-radius: 999px; padding: 6px 12px; font-weight: 800; cursor: pointer; color: var(--ink); } .chat-ai-player .chip.active { background: var(--brand); color: #fff; border-color: var(--brand) } .chat-ai-player .table { width: 100%; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums } .chat-ai-player th, .chat-ai-player td { padding: 8px 6px } .chat-ai-player thead th { font-size: 12px; color: var(--ink2); text-align: left } .chat-ai-player tbody tr { border-top: 1px solid var(--border) } .chat-ai-player tbody tr:hover { background: #fbfdff } .chat-ai-player .sig { display: inline-block; padding: 4px 10px; border-radius: 8px; background: #f1f5f9; font-weight: 900 } .chat-ai-player .sig.buy { color: var(--ok) } .chat-ai-player .sig.sell { color: var(--sell) } .chat-ai-player .sig.hold { color: var(--hold) } .chat-ai-player .right { text-align: right } .chat-ai-player .shap { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px } .chat-ai-player .tag2 { background: #f8fafc; border: 1px solid var(--border); color: #475569; border-radius: 999px; padding: 4px 10px; font-size: 12px } /* Scope all overrides to the sidebar only */ #exnet-sidebar { /* Exnet colors */ --ex-panel: #132b47; --ex-panel-hover: #173556; --ex-border: #1d3b5c; --ex-ink: #d7e4f7; --ex-ink-strong: #e9f2ff; --ex-muted: #9fb3cc; --ex-ink-soft: #cfe1ff; --ex-tip-bg: rgba(15,22,34,.95); } /* Keep your font sizes & layout; only map colors/hover inside the sidebar */ #exnet-sidebar { color: var(--ex-ink); background: var(--ex-panel); border-right: 1px solid var(--ex-border); height: 100%; } /* --- STICKY SIDEBAR FOR EXNET --- */ #exnet-sidebar { position: sticky; top: 0; } /* push main content right to avoid overlay */ #exnet-main {  margin-left: 260px;   /* must match sidebar width */  padding: 20px; } #exnet-sidebar .text-zinc-100 { color: var(--ex-ink) !important; } #exnet-sidebar .text-zinc-200 { color: var(--ex-ink-strong) !important; } #exnet-sidebar .text-zinc-300 { color: var(--ex-ink-soft) !important; } #exnet-sidebar .text-zinc-400 { color: var(--ex-muted) !important; } #exnet-sidebar .border-zinc-800 { border-color: var(--ex-border) !important; } #exnet-sidebar .hover\:bg-zinc-800\/60:hover { background-color: var(--ex-panel-hover) !important; } #exnet-sidebar .hover\:bg-zinc-800\/50:hover { background-color: var(--ex-panel-hover) !important; } /* Tooltips (unchanged behavior, just styled for Exnet) */ #exnet-sidebar .tooltip { position: absolute; left: 100%; top: 50%; transform: translateY(-50%); background: var(--ex-tip-bg); color: #fff; padding: 6px 10px; border-radius: 8px; white-space: nowrap; font-size: 12px; margin-left: 8px; opacity: 0; pointer-events: none; transition: opacity .15s ease; z-index: 20; border: 1px solid rgba(255,255,255,.08); } #exnet-sidebar .group:hover .tooltip { opacity: 1; } #exnet-sidebar button { color: var(--ex-ink); background: none; } #exnet-sidebar button span{ color: var(--ex-ink); text-align: left; } #exnet-sidebar svg { color: var(--ex-ink) !important; stroke: currentColor !important; fill: none; } #exnet-sidebar button:focus-visible { outline: 2px solid #4f7cff; outline-offset: 2px; border-radius: 10px; } @media screen and (max-width: 768px) { /* .body-ai { background-color: #2a2a2a; color: white; } */ .ui-dialog { max-width: 100vw; } .ai-page-content { /*margin-top: -60px;*/ } .FinSecuritiesHeader.AITabHeader { margin: 0; /*padding: 0 45px 0 65px;*/ } .FinSecuritiesHeader.AITabHeader > div { gap: 5px; } .FinSecuritiesHeader.AITabHeader .container-tab-wrapper { text-align: left; margin: 0.2em 0.5em; } .FinSecuritiesHeader a h5 { font-size: 3vw; white-space: nowrap; } .FinSecuritiesHeader .container-tab.selected h5 { } #exnet-sidebar{ display: none; } .ai-container .content { max-width: 100vw; } /* .ai-container a { color: white; } */ .ai-container .ai-chat-nav-container { width: 100%; /*display: none;*/ position: unset; } .ai-container .ai-chat-nav-create-strategy-row { display: flex; flex-direction: row; justify-content: space-between; align-items: baseline; } .ai-container .ai-chat-nav-create-strategy-row .ai-chat-showmore-your-chats { display: block; } .ai-container .ai-chat-nav-container-chats .ai-chat-nav-section { display: none; } .ai-container .ai-main-nav .get-started-cont { max-width: 100%; width: 100%; } .ai-container .ai-main-nav .ai-chat-nav-tabs { gap: 0.75em; } .ai-container .ai-main-nav .ai-chat-nav-tabs .container-tab { /* color: white; */ font-size: 1em; } .ai-container .ai-main-nav .get-started-cont li { color: black; } .ai-portf-dashboard .ai-portf-items .BFDataTable-data { grid-template-columns: repeat(1, minmax(0, 1fr)); } .ai-portf-dashboard{ padding: 0.5em; } .ai-chat-container { flex-direction: column; /*gap: 1em;*/ } .ai-chat-conv-container { width: calc(100vw - 10px); padding: 0; margin: 0 -10px; } /* .ai-chat-conv-container tr:nth-child(odd) td { background-color: #2a2a2a; } .ai-chat-conv-container tr:nth-child(even) td { background-color: black; } .ai-chat-conv-container tr th { background-color: black; } .ai-home-container .ai-chat-conv-container tr:nth-child(odd) td, .ai-home-container .ai-chat-conv-container tr th { color: black; } */ .ai-chat-nav-container { align-self: center; } .ai-chat-nav { width: 100%; margin: 0 auto; padding: 0; /* background-color: black; */ } .ai-chat-nav-panel-cc{ padding: 1em; } .ai-chat-nav-title-cc{ padding: 0 1em; } .ai-chat-nav div.ai-chat-nav-section { /* color: white; */ margin-bottom: 4px; } .ai-chat-nav-titles-mobile { display: block; margin-bottom: 2em; } .chat-ai-spacer { height: 200px; background-color: #2a2a2a; } .ai-chat-main { width: 100%; } .chat-ai-request, .chat-ai-response { max-width: 95%; /* background-color: #000000; color: black; */ } .ai-home-container .chat-ai-request { background-color: beige; color: black; } .ai-chat-mobile-title { display: block; text-align: center; padding: 1em 1em 0 1em; } .ai-chat-mobile-title h3 { font-size: 1.25em; color: white; } .ai-chat-mobile-title p { font-size: 1.15em; color: white; } .ai-chat-container { /*margin-top: 1em;*/ } .ai-chat-share-icon { background-image: url(/Content/images/share_icon_dark.png); } .ai-chat-msg { height: 6em; /* color: white; background-color: black; */ } .ai-chat-msg::-webkit-input-placeholder { white-space: pre-line; position: relative; top: -0.5em; } .ai-chat-send { max-height: 1em; height: 1em; width: 1em; /* background-image: url(/Content/images/send-msg-button-dark.png); */ } .ai-chat-send-container { gap: 0.5em; } /* .ai-container div, .ai-container p, .ai-container td, .ai-container th, .ai-container span, .ai-container li, .ai-container label { color: white; } .ai-container th { background-color: black; } .ai-container .ui-dialog div, .ai-container .ui-dialog p { color: black; } .ai-container .ai-main-nav-cell { color: black; margin: 2vw; } .ai-container div.alert-condition-and { color: black; } */ .ai-container .ai-main-nav { margin-top: 1em; margin-bottom: 1em; } .ai-container div.ai-coming-soon p { font-size: 1.25em; } .ai-container .finsec-chart-tabs a { color: #b0b0b0; } .ai-container .finsec-chart-tabs a.selected { color: white; } .chat-ai-response th { background-color: transparent; } .chat-ai-response tr:nth-child(even) { background-color: transparent; } .ai-chat-nav-savedalerts td.ai-alerts-freetext-cell div { width: 60vw; } .ai-subscribe-options { flex-direction: column; gap: 36px; } .ai-subscribe-option { width: 86vw; } .ai-subscribe-option-table-main { margin: 0 auto; } .ai-subscribe-buttons { text-align: center; margin: 0; } .ai-subscribe-option-content { height: 23.5em; } .ai-subscribe-option-label { width: 60vw; } .ai-alerts .ai-chat-nav-container { width: 100%; min-width: unset; } .ai-chat-nav-alerts-edit { background-image: url(/Content/images/gear-icon-white.png); } .ai-alert-confirmation-buttons button.btn.smallerbtn { font-size: 16px; height: 32px; padding: 2.5px 12px; } .ai-subscribe-option-content.selected { border-color: red; } .ai-subscribe-option-header label { color: white; } .body-ai .menu-ai, .body-ai-home .menu-ai { display: none; } } .chat-ai-minimize:before { cursor: pointer; } .chat-ai-minimize:before { content: "▲"; } .chat-ai-response-min .chat-ai-minimize:before { content: "▼"; } .chat-ai-response-min .chat-ai-response-content { display: none; } .chat-ai-response-min .chat-ai-response-share-container { display: none; } .chat-ai-response-min .chat-ai-fus { display: none; } .chat-ai-response-min .chat-ai-buy { display: none; } .ai-home-sample { height: auto; } .ai-home-container { display: flex; flex-direction: row; background-color: black; align-items: start; justify-content: center; } .ai-home-image img { height: calc(100vh - 120px); width: calc(96.5vh - 115.8px); } .ai-home-sample { width: 70%; max-width: 1200px; padding-top: 50px; } .ai-home-sample .ai-chat-main { width: 100%; } .ai-home-info { width: 20%; display: flex; flex-direction: column; align-items: center; } .ai-home-info-inner { } .ai-home-inner { width: 100%; } .ai-home-label p { color: white; font-size: 2.5em; text-align: center; } .ai-home-sample { width: 98%; } .ai-home-buttons { justify-content: center; display: flex; flex-direction: row; gap: 55px; } .ai-home-buttons .btn-ai { width: 7vw; height: 2.5vw; font-size: 1.25vw; padding: 0 1vw; } .ai-container .ai-home-usefree { margin-top: 1.25em; font-size: 1.25vw; text-align: center; } button.btn-ai { background-color: #1b55c0; } .ai-home-label-sub { width: 100%; margin: 3.5vw 0 0 0; text-align: center; } @media screen and (max-width: 768px) { .ai-home-container { flex-direction: column; } .ai-home-image img { height: 80vw; width: 90vw; } .ai-home-info { display: none; } .ai-home-boxes { width: 95vw; } /*set ai-home-boxes to flex div row wrapping*/ .ai-home-boxes { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; } .ai-home-label p { font-size: 1.4em; } .ai-home-buttons { gap: 3vw; } .ai-home-buttons .btn-ai { width: 18vw; height: 9vw; font-size: 4vw; } } /*Sliding Switch*/ .switch { position: relative; display: inline-block; width: 50px; height: 28px; margin: 0; } .switch.smaller { width: 45px; height: 23px; } .switch input { opacity: 0; width: 0; height: 0; } .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; } .slider:before { position: absolute; content: ""; height: 22px; width: 22px; left: 3px; bottom: 3px; background-color: white; -webkit-transition: .4s; transition: .4s; } .switch.smaller .slider:before { height: 17px; width: 17px; } input:checked + .slider { background-color: #e8641b; } input:focus + .slider { box-shadow: 0 0 1px #e8641b; } input:checked + .slider:before { -webkit-transform: translateX(22px); -ms-transform: translateX(22px); transform: translateX(22px); } /* Rounded sliders */ .slider.round { border-radius: 28px; } .slider.round:before { border-radius: 50%; } /*end of Sliding Switch*/ .PosCell, .home2.home2i .PosCell { color: #5ac381; } .NegCell, .home2.home2i .NegCell { color: #ec4f6c; } .PriceDirectionImage { max-height: 10px; display: none; } .PriceDirectionImage.large { max-height: 15px; } .PosCell .PriceDirectionImage-Up { display: inline; } .NegCell .PriceDirectionImage-Down { display: inline; } .vix-low { color: #2ECC71; } .vix-moderate { color: #F1C40F; } .vix-high { color: #E74C3C; } .fng-fear-high { color: #ea3323; } .fng-fear-low { color: #FFA500; } .fng-neutral { color: #FFFF00; } .fng-greed-low { color: #90EE90; } .fng-greed-high { color: #006400; } .analyst-rating-1 { color: #FF0000; } .analyst-rating-2 { color: #FFA500; } .analyst-rating-3 { color: #FFFF00; } .analyst-rating-4 { color: #90EE90; } .analyst-rating-5 { color: #4ba530; } .alert-condition-and { display: inline-block; } .alert-condition-or, .ai-alert-confirmation-ptickers-text, .ai-alert-confirmation-entity-text, .ai-alert-confirmation-descr-text { display: inline-block; background-color: antiquewhite; border-radius: 5px; padding: 5px; } .tab-container.ai-clients, .tab-container.ai-clients .ai-chat-main-clients { --bg: #0e2239; --panel: #132b47; --card: #132b47; --text: #d7e4f7; --muted: #9fb3cc; --line: rgba(187,210,245,.12); --brand: #4f7cff; --green: #22c55e; --amber: #f59e0b; --red: #ef4444; --shadow: 0 12px 30px rgba(0,0,0,.35); --r: 16px; --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial; background-color: var(--bg); } .tab-container.ai-clients{ min-height: 500px; } .ai-container .ai-chat-main-clients span, .ai-container .ai-chat-main-clients div, .ai-container .ai-chat-main-clients button, .ai-container .ai-chat-main-clients label { color: var(--text); } .ai-container .ai-chat-main-clients .ai-chat-form-validation { color: #f87171; } .tab-container.ai-clients .btn-primary { background: var(--brand); color: #fff; } .ai-clients .ai-chat-container { justify-content: center; } .ai-container .ai-chat-nav-clients .BFDataTable-data table thead { background-color: transparent; } .ai-container .ai-chat-nav-clients .BFDataTable-data table.table-striped tbody tr:nth-of-type(odd) { background-color: transparent; } .ai-container .ai-chat-nav-clients .BFDataTable-data thead th { text-align: left; color: #9fb3cc; font-weight: 800; padding: 12px 14px; border-bottom: 1px solid rgba(187, 210, 245, .12); background: background: rgba(0,0,0,.10); } /* --- Exnet Clients Table (spec) --- */ /* IMPORTANT: do not scope to `.BFDataTable-table-response` (not persisted). */ /* Scope to the persisted clients nav container instead: `.ai-container .ai-chat-nav-clients .BFDataTable-data` */ .ai-container .ai-chat-nav-clients .BFDataTable-data table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; } .ai-container .ai-chat-nav-clients .BFDataTable-data thead th { text-align: left; color: #9fb3cc; /* --muted */ font-weight: 800; padding: 10px 8px; border-bottom: 1px solid rgba(187,210,245,.12); /* --line */ background: rgba(0,0,0,.10); white-space: nowrap; } .ai-container .ai-chat-nav-clients .BFDataTable-data tbody td { padding: 10px 8px; border-bottom: 1px solid rgba(187,210,245,.06); vertical-align: middle; } .ai-container .ai-chat-nav-clients .BFDataTable-data tbody tr:hover { background: rgba(255,255,255,.04); } .ai-container .ai-chat-nav-clients .BFDataTable-data .name { font-weight: 900; display: flex; flex-direction: column; gap: 2px; } .ai-container .ai-chat-nav-clients .BFDataTable-data .id { color: #9fb3cc; font-size: 12px; font-weight: 600; } .ai-container .ai-chat-nav-clients .BFDataTable-data .badge { display: inline-flex; align-items: center; padding: 3px 7px; border-radius: 999px; font-size: 12px; font-weight: 800; border: 1px solid rgba(187,210,245,.12); color: #9fb3cc; background: rgba(255,255,255,.03); white-space: nowrap; } .ai-container .ai-chat-nav-clients .BFDataTable-data .badge.green { color: #bbf7d0; border-color: rgba(34,197,94,.25); background: rgba(34,197,94,.10); } .ai-container .ai-chat-nav-clients .BFDataTable-data .badge.amber { color: #fde68a; border-color: rgba(245,158,11,.25); background: rgba(245,158,11,.10); } .ai-container .ai-chat-nav-clients .BFDataTable-data .badge.red { color: #fca5a5; border-color: rgba(239,68,68,.25); background: rgba(239,68,68,.10); } .ai-container .ai-chat-nav-clients .BFDataTable-data .badge.gray { color: #cbd5e1; border-color: rgba(148,163,184,.18); background: rgba(148,163,184,.08); } .ai-container .ai-chat-nav-clients .BFDataTable-data .badge.blue { color: #93c5fd; border-color: rgba(79,124,255,.25); background: rgba(79,124,255,.10); } .ai-container .ai-chat-nav-clients .holdings-cell { display: flex; flex-direction: column; gap: 4px; } .ai-container .ai-chat-nav-clients .holdings-sub { font-size: 10px; color: var(--strat-muted, #9fb3cc); font-weight: 600; padding-left: 2px; } .ai-container .ai-chat-nav-clients a.holdings-link { color: rgba(79,124,255,.95); text-decoration: none; font-weight: 800; font-size: 12px; padding-left: 2px; } .ai-container .ai-chat-nav-clients a.holdings-link:hover { text-decoration: underline; } .ai-container .ai-chat-nav-clients .holdings-update-btn { font-size: 10px; font-weight: 700; color: var(--brand, #4f7cff); background: rgba(79,124,255,.1); border: 1px solid rgba(79,124,255,.25); border-radius: 6px; padding: 1px 8px; cursor: pointer; text-decoration: none; display: inline-block; } .ai-container .ai-chat-nav-clients .holdings-update-btn:hover { background: rgba(79,124,255,.2); text-decoration: none; } .ai-container .ai-chat-nav-clients .configureBtn { display: inline-flex; align-items: center; gap: 5px; padding: 6px 10px; border-radius: 8px; font-weight: 700; font-size: 11px; border: 1px solid rgba(79,124,255,.28); background: rgba(79,124,255,.14); color: #93c5fd; cursor: pointer; white-space: nowrap; transition: all .12s; } .ai-container .ai-chat-nav-clients .configureBtn:hover { background: rgba(79,124,255,.22); } .ai-container .ai-chat-nav-clients .BFDataTable-data .badge.compact { padding: 4px 8px; font-size: 11px; } .ai-container .ai-chat-nav-clients .BFDataTable-data .muted-dash { color: #9fb3cc; } .ai-container .ai-chat-nav-clients .BFDataTable-data .created { color: #9fb3cc; font-weight: 800; } .ai-container .ai-chat-nav-clients .BFDataTable-data .link { color: rgba(79,124,255,.95); text-decoration: none; font-weight: 800; border: 0; background: transparent; padding: 0; } .ai-container .ai-chat-nav-clients .BFDataTable-data .link:hover { text-decoration: underline; } .ai-container .ai-chat-nav-clients .BFDataTable-data .inlinePrimary { display: inline-flex; align-items: center; justify-content: center; padding: 8px 10px; border-radius: 10px; font-weight: 900; font-size: 12px; border: 1px solid rgba(79,124,255,.28); background: rgba(79,124,255,.16); color: inherit; cursor: pointer; white-space: nowrap; } .ai-container .ai-chat-nav-clients .BFDataTable-data .inlinePrimary:hover { background: rgba(79,124,255,.22); } /* --- AI FLOW (compact + no-wrap) --- */ .ai-container .ai-chat-nav-clients .BFDataTable-data .flowRow { display: flex; gap: 5px; flex-wrap: nowrap; margin-top: 8px; align-items: center; overflow: hidden; max-width: 420px; -webkit-mask-image: linear-gradient(to right, #000 90%, transparent); mask-image: linear-gradient(to right, #000 90%, transparent); } .ai-container .ai-chat-nav-clients .BFDataTable-data .flowStep { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; line-height: 1; padding: 3px 6px; border-radius: 999px; border: 1px solid rgba(187,210,245,.10); background: rgba(255,255,255,.03); color: #9fb3cc; white-space: nowrap; flex: 0 0 auto; } .ai-container .ai-chat-nav-clients .BFDataTable-data .dot { width: 5px; height: 5px; border-radius: 999px; display: inline-block; } .ai-container .ai-chat-nav-clients .BFDataTable-data .flowStep.ok { color: #bbf7d0; border-color: rgba(34,197,94,.22); background: rgba(34,197,94,.08); } .ai-container .ai-chat-nav-clients .BFDataTable-data .flowStep.ok .dot { background: #22c55e; } .ai-container .ai-chat-nav-clients .BFDataTable-data .flowStep.run { color: #c7d2fe; border-color: rgba(79,124,255,.35); background: rgba(79,124,255,.12); } .ai-container .ai-chat-nav-clients .BFDataTable-data .flowStep.run .dot { background: #4f7cff; } /* Kebab (visual only; behavior handled elsewhere) */ .ai-container .ai-chat-nav-clients .BFDataTable-data .kebab { width: 38px; height: 38px; border-radius: 12px; border: 1px solid rgba(187,210,245,.12); background: rgba(255,255,255,.04); cursor: pointer; display: grid; place-items: center; position: relative; font-size: 18px; line-height: 1; } .ai-container .ai-chat-nav-clients .BFDataTable-data .kebab:hover { background: rgba(255,255,255,.07); } /* ── Next Action Badge ── */ .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 10px; font-size: 12px; font-weight: 800; white-space: nowrap; cursor: default; transition: all .15s ease; } .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action .na-icon { width: 16px; height: 16px; border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; font-size: 9px; flex-shrink: 0; } .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action.na-urgent { color: #fca5a5; background: rgba(239,68,68,.10); border: 1px solid rgba(239,68,68,.22); } .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action.na-urgent .na-icon { background: rgba(239,68,68,.25); color: #fca5a5; } .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action.na-action { color: #93c5fd; background: rgba(79,124,255,.10); border: 1px solid rgba(79,124,255,.22); } .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action.na-action .na-icon { background: rgba(79,124,255,.25); color: #93c5fd; } .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action.na-wait { color: #fde68a; background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.18); } .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action.na-wait .na-icon { background: rgba(245,158,11,.20); color: #fde68a; } .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action.na-done { color: #bbf7d0; background: rgba(34,197,94,.08); border: 1px solid rgba(34,197,94,.18); } .ai-container .ai-chat-nav-clients .BFDataTable-data .next-action.na-done .na-icon { background: rgba(34,197,94,.20); color: #bbf7d0; } .ai-container .ai-chat-nav-clients .BFDataTable-data .na-cell { display: flex; flex-direction: column; gap: 4px; min-width: 120px; } .ai-container .ai-chat-nav-clients .BFDataTable-data .na-go { display: inline-flex; align-items: center; font-size: 11px; font-weight: 800; text-decoration: none; padding-left: 2px; transition: all .15s ease; } .ai-container .ai-chat-nav-clients .BFDataTable-data .na-go:hover { text-decoration: underline; } .ai-container .ai-chat-nav-clients .BFDataTable-data .na-go-action { color: #93c5fd; } .ai-container .ai-chat-nav-clients .BFDataTable-data .na-go-urgent { color: #fca5a5; } .ai-container .ai-chat-nav-clients .BFDataTable-data .na-go-wait { color: #fde68a; } .ai-container .ai-chat-nav-clients .BFDataTable-data .na-go-done { color: #bbf7d0; opacity: .7; } /* ── Enhanced Status sub-label ── */ .ai-container .ai-chat-nav-clients .BFDataTable-data .status-wrap { display: flex; flex-direction: column; gap: 4px; } .ai-container .ai-chat-nav-clients .BFDataTable-data .status-detail { font-size: 10px; color: var(--muted); opacity: .8; font-weight: 600; padding-left: 2px; } /* ── Agent Progress 5-dot pipeline ── */ .ai-container .ai-chat-nav-clients .BFDataTable-data .agent-progress { display: flex; align-items: center; gap: 1px; margin-top: 6px; } .ai-container .ai-chat-nav-clients .BFDataTable-data .agent-progress .ap-step { position: relative; width: 7px; height: 7px; border-radius: 50%; transition: all .2s ease; } .ai-container .ai-chat-nav-clients .BFDataTable-data .agent-progress .ap-step.done { background: var(--green); box-shadow: 0 0 6px rgba(34,197,94,.4); } .ai-container .ai-chat-nav-clients .BFDataTable-data .agent-progress .ap-step.active { background: var(--brand); box-shadow: 0 0 8px rgba(79,124,255,.5); animation: pulse-dot 1.8s ease-in-out infinite; } .ai-container .ai-chat-nav-clients .BFDataTable-data .agent-progress .ap-step.pending { background: rgba(187,210,245,.2); border: 1px solid rgba(187,210,245,.15); } .ai-container .ai-chat-nav-clients .BFDataTable-data .agent-progress .ap-connector { width: 5px; height: 1px; background: rgba(187,210,245,.12); } .ai-container .ai-chat-nav-clients .BFDataTable-data .agent-progress .ap-connector.done { background: rgba(34,197,94,.35); } .ai-container .ai-chat-nav-clients .BFDataTable-data .agent-progress .ap-label { font-size: 10px; color: var(--muted); margin-left: 6px; font-weight: 700; } @keyframes pulse-dot { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .5; transform: scale(1.35); } } .ai-container .ai-chat-nav-clients .BFDataTable-data .ap-step[data-tip] { cursor: default; } .ai-container .ai-chat-nav-clients .BFDataTable-data .ap-step[data-tip]:hover::after { content: attr(data-tip); position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); background: rgba(10,20,40,.95); border: 1px solid var(--line); color: var(--text); padding: 4px 8px; border-radius: 6px; font-size: 10px; white-space: nowrap; z-index: 10; pointer-events: none; } /* ── Context Menu Dividers ── */ .ai-container .ai-chat-nav-clients .BFDataTable-data .menu .menu-divider { height: 1px; background: rgba(187,210,245,.10); margin: 4px 0; } .ai-container .ai-chat-nav-clients .BFDataTable-data .menu a.danger { color: #fecaca; } @media (max-width: 920px) { .ai-container .ai-chat-nav-clients .BFDataTable-data .flowRow { max-width: 280px; } .ai-container .ai-chat-nav-clients .BFDataTable-data .flowStep { padding: 2px 4px; } .ai-container .ai-chat-nav-clients .BFDataTable-data .flowStep span.label { display: none; } } /* ============================ Exnet Clients outer layout (append-only; scoped to ai-clients tab) ============================ */ .tab-container.ai-clients .ai-chat-main-clients { --bg: #0e2239; --panel: #132b47; --text: #d7e4f7; --muted: #9fb3cc; --line: rgba(187,210,245,.12); --brand: #4f7cff; --shadow: 0 12px 30px rgba(0,0,0,.35); --r: 16px; } /* main background already set by existing rule; keep margin/padding consistent */ .tab-container.ai-clients .ai-chat-main-clients { color: var(--text); font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial; width: fit-content; min-width: 100%; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-wrap { max-width: none; margin: auto; padding: 18px; width: fit-content; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-pagehead { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 10px 0 14px; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-h1 { margin: 0; font-size: 22px; color: var(--text); } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-sub { margin: 4px 0 0; color: var(--muted); font-size: 13px; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-pagehead-actions { display: flex; gap: 10px; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-btn { border: 1px solid var(--line); background: rgba(255,255,255,.04); color: var(--text); border-radius: 12px; padding: 10px 12px; font-weight: 700; font-size: 13px; cursor: pointer; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-btn:hover { background: rgba(255,255,255,.07); } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-btn.primary { border: 1px solid rgba(79,124,255,.28); background: rgba(79,124,255,.18); } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-btn.primary:hover { background: rgba(79,124,255,.24); } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-panel { border: 1px solid var(--line); background: rgba(17,31,57,.55); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden; width: fit-content; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-toolbar { padding: 12px 14px; border-bottom: 1px solid var(--line); display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: space-between; background: linear-gradient(180deg, rgba(255,255,255,.03), transparent); } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-lefttools { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-input { width: 180px; border-radius: 12px; border: 1px solid var(--line); background: rgba(0,0,0,.18); padding: 10px 12px; color: var(--text); outline: none; font-size: 13px; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-input::placeholder { color: rgba(215,228,247,.65); } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-chip { font-size: 12px; padding: 7px 10px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); background: rgba(255,255,255,.03); cursor: pointer; user-select: none; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-chip.active { color: var(--text); border-color: rgba(79,124,255,.25); background: rgba(79,124,255,.12); } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-count { color: var(--muted); font-size: 12px; font-weight: 800; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-tablewrap { overflow: auto; } .tab-container.ai-clients .ai-chat-main-clients .ai-clients-tablewrap table { width: 100%; } /* responsive */ @media (max-width: 920px) { .tab-container.ai-clients .ai-chat-main-clients .ai-clients-input { width: 100%; } /* keep spec behavior */ .tab-container.ai-clients .ai-chat-main-clients .hide-sm { display: none; } } /* --- Clients kebab menu (spec) --- */ .ai-container .ai-chat-nav-clients .kebab.ai-clients-edit { width: 38px; height: 38px; border-radius: 12px; border: 1px solid rgba(187,210,245,.12); background: rgba(255,255,255,.04); display: grid; place-items: center; cursor: pointer; position: relative; /* override legacy pencil icon */ background-image: none !important; } .ai-container .ai-chat-nav-clients .kebab.ai-clients-edit:hover { background: rgba(255,255,255,.07); } .ai-container .ai-chat-nav-clients .kebab.ai-clients-edit .menu { position: absolute; right: 0; top: 42px; width: 200px; background: rgba(19,43,71,.98); border: 1px solid rgba(187,210,245,.12); border-radius: 12px; box-shadow: 0 12px 30px rgba(0,0,0,.35); padding: 6px; display: none; z-index: 10; } .ai-container .ai-chat-nav-clients .kebab.ai-clients-edit .menu a { display: flex; justify-content: space-between; padding: 10px 10px; border-radius: 10px; color: #d7e4f7; text-decoration: none; font-weight: 700; font-size: 13px; } .ai-container .ai-chat-nav-clients .kebab.ai-clients-edit .menu a:hover { background: rgba(255,255,255,.06); } .ai-container .ai-chat-nav-clients .kebab.ai-clients-edit.open .menu { display: block; } /* Allow kebab menus to overflow outside the clients frame (prevent clipping). */ .ai-chat-main-clients .ai-clients-wrap, .ai-chat-main-clients .ai-clients-panel, .ai-chat-main-clients .ai-clients-tablewrap, .ai-chat-main-clients .ai-chat-nav-clients.BFDataTable, .ai-chat-main-clients .ai-chat-nav-clients .BFDataTable-data { overflow: visible !important; } .ai-container .copy-clipboard { filter: brightness(0) invert(0.88) sepia(0.15) saturate(0.8) hue-rotate(190deg); } /* Ensure the dropdown can stack above the table. */ .ai-chat-main-clients .kebab.ai-clients-edit { position: relative; } .ai-chat-main-clients .kebab.ai-clients-edit .menu { position: absolute; z-index: 9999; } /* Flow badges (client list) */ .ai-chat-main-clients .flowRow { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; align-items: center; } .ai-chat-main-clients .flowStep { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 12px; line-height: 1; font-weight: 600; border: 1px solid rgba(255, 255, 255, 0.12); background: rgba(255, 255, 255, 0.06); color: rgba(255, 255, 255, 0.88); white-space: nowrap; user-select: none; } .ai-chat-main-clients .flowStep .dot { width: 8px; height: 8px; border-radius: 999px; background: currentColor; opacity: 0.9; } /* OK (completed) */ .ai-chat-main-clients .flowStep.ok { color: #22c55e; /* green */ background: rgba(34, 197, 94, 0.12); border-color: rgba(34, 197, 94, 0.28); } /* RUN (in-progress) */ .ai-chat-main-clients .flowStep.run { color: #60a5fa; /* blue */ background: rgba(96, 165, 250, 0.12); border-color: rgba(96, 165, 250, 0.28); } .ai-chat-main-clients .flowStep.run .dot { animation: aiFlowPulse 1.1s ease-in-out infinite; } /* QUEUE (next / blocked) */ .ai-chat-main-clients .flowStep.queue { color: #f59e0b; /* amber */ background: rgba(245, 158, 11, 0.12); border-color: rgba(245, 158, 11, 0.28); } @keyframes aiFlowPulse { 0% { transform: scale(1); opacity: 0.45; } 50% { transform: scale(1.4); opacity: 1; } 100% { transform: scale(1); opacity: 0.45; } } /* ============================================================ */ /* AI STRATEGIES PAGE - NEW DESIGN */ /* ============================================================ */ .ai-container .ai-strategies-page { --strat-bg: #0e2239; --strat-panel: #132b47; --strat-panel-hover: #173556; --strat-panel-border: #1d3b5c; --strat-ink: #d7e4f7; --strat-ink-strong: #e9f2ff; --strat-muted: #9fb3cc; --strat-muted-2: #87a0bb; --strat-brand: #4f7cff; --strat-chip-border: rgba(187,210,245,.14); --strat-green: #22c55e; --strat-amber: #f59e0b; --strat-red: #ef4444; --strat-radius: 16px; background-color: var(--strat-bg); color: var(--strat-ink); font-family: system-ui, ui-sans-serif, -apple-system, Segoe UI, Roboto, sans-serif; padding: 1.5rem; min-height: 100vh; } .ai-container .ai-strategies-page *, .ai-container .ai-strategies-page ::after, .ai-container .ai-strategies-page ::before { box-sizing: border-box; } /* Header */ .ai-container header.ai-strategies-header { line-height: inherit; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; } .ai-container .ai-strategies-header-left { flex: 1; } .ai-container .ai-strategies-h1 { font-size: 1.875rem; font-weight: 600; color: var(--strat-ink-strong); margin: 0; } .ai-container .ai-strategies-subtitle { font-size: 0.875rem; color: var(--strat-muted); margin-top: 0.25rem; max-width: 40rem; } .ai-container .ai-strategies-header-actions { display: flex; gap: 0.5rem; } /* Main Grid */ .ai-container .ai-strategies-grid { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 1.5rem; width: 100%; } @media (max-width: 1024px) { .ai-container .ai-strategies-grid { grid-template-columns: 1fr; } } /* Sidebar */ .ai-container .ai-strategies-sidebar { background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); border: 1px solid rgba(187,210,245,.12); border-radius: 18px; box-shadow: 0 12px 30px rgba(6,16,35,.5); padding: 1rem; display: flex; flex-direction: column; gap: 1rem; } /* Main Content */ .ai-container .ai-strategies-main { background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); border: 1px solid rgba(187,210,245,.12); border-radius: 18px; box-shadow: 0 12px 30px rgba(6,16,35,.5); padding: 1.25rem; display: flex; flex-direction: column; gap: 1.25rem; width: 100%; min-width: 0; } .ai-container .ai-strat-empty-state > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(1.25rem * var(--tw-space-y-reverse)); } .ai-container .ai-strat-detail-container > :not([hidden]) ~ :not([hidden]), .ai-container .ai-strat-tab-content > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(1.25rem * var(--tw-space-y-reverse)); } /* Buttons */ .ai-container .ai-strat-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; font-size: 0.82rem; padding: 0.55rem 0.85rem; border-radius: 12px; border: 1px solid rgba(187,210,245,.18); background: rgba(255,255,255,.03); color: var(--strat-ink-strong); white-space: nowrap; cursor: pointer; transition: background 0.15s; } .ai-container .ai-strat-btn:hover { background: rgba(255,255,255,.06); } .ai-container .ai-strat-btn-primary { background: rgba(79,124,255,.22); border-color: rgba(79,124,255,.55); } .ai-container .ai-strat-btn-primary:hover { background: rgba(79,124,255,.32); } .ai-container .ai-strat-btn-disabled, .ai-container .ai-strat-btn-disabled:hover { opacity: .4; cursor: not-allowed; pointer-events: none; } .ai-container .ai-strat-btn-flex { flex: 1; } /* Strategy icons */ .ai-container .ai-strat-icon, .ai-container .ai-strat-icon-sm { display: inline-block; flex-shrink: 0; } .ai-container .ai-strat-icon { width: 16px; height: 16px; } .ai-container .ai-strat-icon-sm { width: 12px; height: 12px; } .ai-container .ai-strat-btn-flow .ai-strat-icon { width: 14px; height: 14px; } /* Input */ .ai-container .ai-strat-input { width: 100%; border-radius: 12px; border: 1px solid rgba(187,210,245,.18); background: rgba(255,255,255,.03); padding: 10px 12px; color: var(--strat-ink-strong); outline: none; font-size: 0.9rem; } .ai-container .ai-strat-input::placeholder { color: rgba(159,179,204,.75); } .ai-container .ai-strat-input:focus { border-color: rgba(79,124,255,.55); box-shadow: 0 0 0 3px rgba(79,124,255,.18); } /* Badges */ .ai-container .ai-strat-badges { display: flex; gap: 0.5rem; flex-wrap: wrap; } .ai-container .ai-strat-badge { padding: 0.18rem 0.6rem; border-radius: 9999px; border: 1px solid var(--strat-chip-border); font-size: 0.72rem; color: var(--strat-muted-2); background: rgba(255,255,255,.02); user-select: none; white-space: nowrap; cursor: pointer; transition: all 0.15s; } .ai-container .ai-strat-badge:hover { background: rgba(255,255,255,.05); } .ai-container .ai-strat-badge.active { color: var(--strat-ink-strong); border-color: rgba(79,124,255,.55); background: rgba(79,124,255,.12); } /* Status filter colors */ .ai-container .ai-strat-badge[data-filter="live"] { color: var(--strat-green); border-color: rgba(34,197,94,.35); background: rgba(34,197,94,.08); } .ai-container .ai-strat-badge[data-filter="live"].active { color: var(--strat-green); border-color: rgba(34,197,94,.55); background: rgba(34,197,94,.16); } .ai-container .ai-strat-badge[data-filter="generating"] { color: var(--strat-brand); border-color: rgba(79,124,255,.35); background: rgba(79,124,255,.08); } .ai-container .ai-strat-badge[data-filter="draft"] { color: #9aa7bf; border-color: rgba(154,167,191,.35); background: rgba(154,167,191,.14); } .ai-container .ai-strat-badge[data-filter="live"].active, .ai-container .ai-strat-badge[data-filter="generating"].active, .ai-container .ai-strat-badge[data-filter="draft"].active { box-shadow: 0 0 0 1px rgba(255,255,255,.06); } /* Strategy list item badges - scoped to avoid affecting other badges */ .ai-container .ai-strategies-page .ai-strategies-sidebar .ai-strategies-list-item .badge, .ai-container .ai-strategies-page .ai-chat-nav-strategies .BFDataTable-response .badge { padding: 0.18rem 0.6rem; border-radius: 9999px; border: 1px solid var(--strat-chip-border); font-size: 0.72rem; color: var(--strat-muted-2); background: rgba(255,255,255,.02); user-select: none; white-space: nowrap; font-weight: normal; line-height: normal; } .ai-container .ai-strategies-page .ai-strategies-sidebar .ai-strategies-list-item .badge.on, .ai-container .ai-strategies-page .ai-chat-nav-strategies .BFDataTable-response .badge.on { color: var(--strat-ink-strong); border-color: rgba(79,124,255,.55); background: rgba(79,124,255,.12); } .ai-container .ai-strategies-page .ai-strategies-sidebar .ai-strategies-list-item .badge-live, .ai-container .ai-strategies-page .ai-chat-nav-strategies .BFDataTable-response .badge-live { color: var(--strat-green); border-color: rgba(34,197,94,.35); background: rgba(34,197,94,.1); font-weight: 600; } .ai-container .ai-strategies-page .ai-strategies-sidebar .ai-strategies-list-item .badge-approved, .ai-container .ai-strategies-page .ai-chat-nav-strategies .BFDataTable-response .badge-approved { color: #0ea5e9; border-color: rgba(14,165,233,.35); background: rgba(14,165,233,.1); } .ai-container .ai-strategies-page .ai-strategies-sidebar .ai-strategies-list-item .badge-drafted, .ai-container .ai-strategies-page .ai-chat-nav-strategies .BFDataTable-response .badge-drafted { color: #9aa7bf; border-color: rgba(154,167,191,.35); background: rgba(154,167,191,.16); } /* Ensure filter pills and list pills share the same palette */ .ai-container .ai-strat-badge[data-filter="live"], .ai-container .ai-strategies-list-item .badge-live { color: var(--strat-green); } .ai-container .ai-strat-badge[data-filter="approved"], .ai-container .ai-strategies-list-item .badge-approved { color: #0ea5e9; } .ai-container .ai-strat-badge[data-filter="rejected"], .ai-container .ai-strategies-list-item .badge-rejected { color: #ef4444; } .ai-container .ai-strat-badge[data-filter="drafted"], .ai-container .ai-strategies-list-item .badge-drafted { color: #9aa7bf; } /* Global badge fallbacks for status pills */ .ai-container .badge-live { color: var(--strat-green) !important; border-color: rgba(34,197,94,.35); background: rgba(34,197,94,.1); } .ai-container .badge-approved { color: #0ea5e9 !important; border-color: rgba(14,165,233,.35); background: rgba(14,165,233,.1); } .ai-container .badge-rejected { color: #ef4444 !important; border-color: rgba(239,68,68,.35); background: rgba(239,68,68,.1); } .ai-container .badge-drafted { color: #9aa7bf !important; border-color: rgba(154,167,191,.35); background: rgba(154,167,191,.16); } /* Strategy List Items (within BFDataTable) */ .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies { /* Removed max-height and overflow-y to allow box to expand */ } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .BFDataTable-data table { width: 100%; } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .BFDataTable-data tbody tr { border: 1px solid rgba(187,210,245,.14); border-radius: 14px; padding: 0.75rem 0.8rem; background: rgba(255,255,255,.02); cursor: pointer; transition: all 0.15s; display: block; margin-bottom: 0.5rem; } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .BFDataTable-data tbody tr:hover { background: rgba(255,255,255,.05); } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .BFDataTable-data tbody tr.active, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .BFDataTable-data tbody tr.selected { border-color: rgba(79,124,255,.55); background: rgba(79,124,255,.12); } /* Workflow Panel */ .ai-container .ai-strat-workflow-panel { border: 1px solid rgba(187,210,245,.14); border-radius: 14px; padding: 0.85rem 0.95rem; background: rgba(255,255,255,.03); } .ai-container .ai-strat-workflow-title { font-size: 0.72rem; color: var(--strat-muted-2); font-weight: 600; margin-bottom: 0.75rem; } /* Workflow Steps */ .ai-container .ai-strat-workflow-steps { display: flex; flex-direction: column; } .ai-container .ai-strat-flow-step { display: flex; align-items: flex-start; gap: 0.7rem; padding: 0.5rem 0.6rem; border-radius: 10px; cursor: pointer; transition: all 0.15s; } .ai-container .ai-strat-flow-step:hover { background: rgba(255,255,255,.04); } .ai-container .ai-strat-flow-step.selected { background: rgba(79,124,255,.1); } .ai-container .ai-strat-flow-indicator { display: flex; flex-direction: column; align-items: center; padding-top: 2px; } .ai-container .ai-strat-flow-dot { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; border: 2px solid rgba(187,210,245,.25); background: transparent; position: relative; z-index: 2; transition: all 0.3s; } .ai-container .ai-strat-flow-dot.done { background: var(--strat-green); border-color: var(--strat-green); box-shadow: 0 0 6px rgba(34,197,94,.4); } .ai-container .ai-strat-flow-dot.done::after { content: '✓'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 7px; color: #fff; font-weight: 700; } .ai-container .ai-strat-flow-dot.run { border-color: var(--strat-brand); animation: stratDotPulse 1.8s ease-in-out infinite; } .ai-container .ai-strat-flow-dot.run::after { content: ''; width: 6px; height: 6px; background: var(--strat-brand); border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .ai-container .ai-strat-flow-dot.wait { border-color: var(--strat-amber); background: rgba(245,158,11,.08); } .ai-container .ai-strat-flow-dot.wait::after { content: '⏳'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 8px; color: var(--strat-amber); font-weight: 700; opacity: 0.9; } .ai-container .ai-strat-flow-dot.not { border-color: rgba(187,210,245,.25); opacity: 0.55; background: transparent; } @keyframes stratDotPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(79,124,255,.35); } 50% { box-shadow: 0 0 0 5px rgba(79,124,255,0); } } .ai-container .ai-strat-flow-line { width: 2px; height: 22px; background: rgba(187,210,245,.14); margin: 2px 0; } .ai-container .ai-strat-flow-line.done { background: var(--strat-green); } .ai-container .ai-strat-flow-line.active { background: linear-gradient(to bottom, var(--strat-green), var(--strat-brand)); } .ai-container .ai-strat-flow-body { flex: 1; min-width: 0; } .ai-container .ai-strat-flow-title { font-size: 0.82rem; font-weight: 500; color: var(--strat-ink-strong); } .ai-container .ai-strat-flow-sub { font-size: 0.7rem; color: var(--strat-muted-2); } .ai-container .ai-strat-flow-status { padding: 0.14rem 0.5rem; border-radius: 9999px; font-size: 0.66rem; font-weight: 500; border: 1px solid transparent; white-space: nowrap; flex-shrink: 0; } .ai-container .ai-strat-flow-status.done { color: var(--strat-green); background: rgba(34,197,94,.12); border-color: rgba(34,197,94,.28); } .ai-container .ai-strat-flow-status.run { color: var(--strat-brand); background: rgba(79,124,255,.12); border-color: rgba(79,124,255,.35); } .ai-container .ai-strat-flow-status.wait { color: var(--strat-amber); background: rgba(245,158,11,.1); border-color: rgba(245,158,11,.25); } .ai-container .ai-strat-flow-status.not { color: #9aa7bf; background: rgba(154,167,191,.18); border-color: rgba(154,167,191,.28); } /* View Agent Flow Button */ .ai-container .ai-strat-btn-flow { display: flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; font-size: 0.78rem; font-weight: 600; padding: 0.6rem 0.8rem; border-radius: 12px; border: 1px solid rgba(79,124,255,.45); background: rgba(79,124,255,.1); color: #6aa7ff; cursor: pointer; transition: all 0.2s; position: relative; overflow: hidden; margin-top: 0.75rem; } /* Design tokens fallback for strategies UI (ensures overlays inherit) */ .ai-container { --strat-bg: #0e2239; --strat-panel: #132b47; --strat-panel-hover: #173556; --strat-panel-border: #1d3b5c; --strat-ink: #d7e4f7; --strat-ink-strong: #e9f2ff; --strat-muted: #9fb3cc; --strat-muted-2: #87a0bb; --strat-brand: #4f7cff; --strat-chip-border: rgba(187,210,245,.14); --strat-green: #22c55e; --strat-amber: #f59e0b; --strat-red: #ef4444; } .ai-strat-flow-overlay { --strat-bg: #0e2239; --strat-panel: #132b47; --strat-panel-hover: #173556; --strat-panel-border: #1d3b5c; --strat-ink: #d7e4f7; --strat-ink-strong: #e9f2ff; --strat-muted: #9fb3cc; --strat-muted-2: #87a0bb; --strat-brand: #4f7cff; --strat-chip-border: rgba(187,210,245,.14); --strat-green: #22c55e; --strat-amber: #f59e0b; --strat-red: #ef4444; color: var(--strat-ink); } .ai-container .ai-strat-btn-flow:hover { background: rgba(79,124,255,.22); color: var(--strat-ink-strong); } .ai-container .ai-strat-btn-flow .shimmer { position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent); animation: stratShimmerSlide 3.5s infinite; } @keyframes stratShimmerSlide { 0% { left: -100%; } 100% { left: 200%; } } /* Detail Header */ .ai-container .ai-strat-detail-header { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0.75rem; } .ai-container .ai-strat-detail-title { font-size: 1.25rem; font-weight: 600; color: var(--strat-ink-strong); margin: 0; } .ai-container .ai-strat-detail-subtitle { font-size: 0.72rem; color: var(--strat-muted-2); margin-top: 0.25rem; } .ai-container .ai-strat-detail-actions { display: flex; gap: 0.5rem; } /* Tabs */ .ai-container .ai-strat-tabs { display: flex; gap: 0.5rem; } .ai-container .ai-strat-tab { display: inline-flex; align-items: center; padding: 0.28rem 0.65rem; border-radius: 999px; font-size: 0.78rem; border: 1px solid rgba(187,210,245,.18); color: rgba(215,228,247,.86); background: rgba(255,255,255,.02); cursor: pointer; user-select: none; transition: all 0.15s; } .ai-container .ai-strat-tab:hover { background: rgba(255,255,255,.05); } .ai-container .ai-strat-tab.active { border-color: rgba(79,124,255,.55); background: rgba(79,124,255,.14); color: var(--strat-ink-strong); } .ai-container .ai-strat-tab-flow { color: #6aa7ff; } /* Tab Content */ .ai-container .ai-strat-tab-content { display: none; } .ai-container .ai-strat-tab-content.active { display: block; } /* Panels Grid */ .ai-container .ai-strat-panels-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; } @media (max-width: 768px) { .ai-container .ai-strat-panels-grid { grid-template-columns: 1fr; } } /* Panel */ .ai-container .ai-strat-panel { background: var(--strat-panel); border: 1px solid var(--strat-panel-border); border-radius: var(--strat-radius); padding: 1rem; margin-bottom: 1rem; } .ai-container .ai-strat-panel:hover { background: var(--strat-panel-hover); } .ai-container .ai-strat-panel-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; } .ai-container .ai-strat-panel-label { font-size: 0.9rem; color: var(--strat-ink-strong); font-weight: 700; margin-bottom: 0.5rem; } .ai-container .ai-strat-panel-label span { font-size: inherit; font-weight: inherit; color: inherit; } .ai-container .ai-strat-panel-value { font-weight: 600; color: var(--strat-ink-strong); margin-top: 0.25rem; } .ai-container .ai-strat-panel-text { font-size: 0.875rem; color: var(--strat-muted); margin-top: 0.5rem; } .ai-container .ai-strat-panel-note { font-size: 0.72rem; color: var(--strat-muted); margin-top: 0.5rem; } .ai-container .ai-strat-panel-status { font-size: 0.72rem; font-weight: 500; } /* Progress Bar */ .ai-container .ai-strat-bar-bg { height: 8px; border-radius: 999px; background: rgba(15,31,55,1); overflow: hidden; margin-top: 0.75rem; } .ai-container .ai-strat-bar-fill { height: 100%; background: linear-gradient(90deg, #6aa7ff, #4f7cff); border-radius: 999px; } /* Allocation List */ .ai-container .ai-strat-alloc-list { margin-top: 0.75rem; display: flex; flex-direction: column; gap: 0.75rem; } .ai-container .ai-strat-alloc-item { display: flex; flex-direction: column; gap: 0.25rem; } .ai-container .ai-strat-alloc-item-header { display: flex; justify-content: space-between; font-size: 0.875rem; } .ai-container .ai-strat-alloc-item-header span:first-child { color: var(--strat-ink); } .ai-container .ai-strat-alloc-item-header span:last-child { color: var(--strat-muted-2); } /* Rationale */ .ai-container .ai-strat-rationale { color: var(--strat-muted); font-size: 0.92rem; line-height: 1.45; margin-top: 0.75rem; } .ai-container .ai-strat-rationale strong { color: var(--strat-ink-strong); } .ai-container .ai-strat-rationale ul { margin: 0.5rem 0 0 0; padding: 0; list-style: none; } .ai-container .ai-strat-rationale li { padding: 0.15rem 0; } /* Actions Bar */ .ai-container .ai-strat-actions-bar { display: flex; gap: 0.5rem; padding-top: 1rem; margin-top: 1rem; border-top: 1px solid rgba(187,210,245,.14); } /* Limits Grid */ .ai-container .ai-strat-limits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; } /* Rules rows (Rules tab profile panel) */ .ai-container .ai-strat-rule-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; font-size: 0.85rem; border-bottom: 1px solid rgba(187,210,245,.08); } .ai-container .ai-strat-rule-row:last-child { border-bottom: none; padding-bottom: 0; } .ai-container .ai-strat-rule-label { color: var(--strat-muted); font-weight: 400; } .ai-container .ai-strat-rule-value { color: var(--strat-ink-strong); font-weight: 600; } /* Allocation rules (Rules tab) */ .ai-container .ai-strat-alloc-rule-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 0.5rem; padding: 6px 0; border-bottom: 1px solid rgba(187,210,245,.08); font-size: 0.85rem; } .ai-container .ai-strat-alloc-rule-row:last-child { border-bottom: none; padding-bottom: 0; } .ai-container .ai-strat-alloc-rule-label { color: var(--strat-muted); } .ai-container .ai-strat-alloc-rule-pct { text-align: right; font-weight: 600; color: var(--strat-ink-strong); font-size: 0.82rem; } .ai-container .ai-strat-alloc-rule-row .ai-strat-bar-bg { height: 6px; border-radius: 999px; background: rgba(15,31,55,1); overflow: hidden; margin: initial; } .ai-container .ai-strat-alloc-rule-row .ai-strat-bar-fill { height: 100%; background: linear-gradient(90deg, #6aa7ff, #4f7cff); border-radius: 999px; } @media (max-width: 600px) { .ai-container .ai-strat-limits-grid { grid-template-columns: 1fr; } } .ai-container .ai-strat-limit-card { border: 1px solid rgba(187,210,245,.14); border-radius: 12px; padding: 0.7rem 0.85rem; background: rgba(255,255,255,.02); text-align: center; } .ai-container .ai-strat-limit-val { font-size: 1.25rem; font-weight: 700; color: var(--strat-ink-strong); line-height: 1; margin-bottom: 0.2rem; } .ai-container .ai-strat-limit-label { font-size: 0.68rem; color: var(--strat-muted-2); line-height: 1.2; } /* Chips */ .ai-container .ai-strat-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; } .ai-container .ai-strat-excl-chip { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.22rem 0.6rem; border-radius: 9999px; font-size: 0.72rem; font-weight: 500; border: 1px solid rgba(239,68,68,.35); background: rgba(239,68,68,.08); color: #f87171; } .ai-container .ai-strat-pref-chip { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.22rem 0.6rem; border-radius: 9999px; font-size: 0.72rem; font-weight: 500; border: 1px solid rgba(34,197,94,.35); background: rgba(34,197,94,.08); color: #4ade80; } /* Filter Grid */ .ai-container .ai-strat-filter-grid { display: grid; gap: 0; font-size: 0.78rem; overflow-x: auto; } .ai-container #filterProfileLabel { color: var(--strat-muted-2); font-weight: 600; } .ai-container .ai-strat-filter-grid .fh { padding: 0.4rem 0.6rem; font-weight: 600; color: var(--strat-muted-2); font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; border-bottom: 1px solid rgba(187,210,245,.14); white-space: nowrap; } .ai-container .ai-strat-filter-grid .fc { padding: 0.35rem 0.6rem; border-bottom: 1px solid rgba(187,210,245,.06); color: var(--strat-muted); white-space: nowrap; } .ai-container .ai-strat-filter-grid .fc.val { color: var(--strat-ink-strong); font-weight: 500; text-align: right; } /* Stock filter grid (Rules tab) - legacy class names */ .ai-container .ai-strat-fh { padding: 0.4rem 0.6rem; font-weight: 600; color: var(--strat-muted-2); font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; border-bottom: 1px solid rgba(187,210,245,.14); white-space: nowrap; } .ai-container .ai-strat-fc { padding: 0.35rem 0.6rem; border-bottom: 1px solid rgba(187,210,245,.06); color: var(--strat-muted); white-space: nowrap; } .ai-container .ai-strat-fc.ai-strat-fc-val { color: var(--strat-ink-strong); font-weight: 500; text-align: right; } /* Normalize icon sizing within strategies UI */ .ai-container .ai-strat-btn svg, .ai-container .ai-strat-panel svg, .ai-container .ai-strat-check-row svg, .ai-container .ai-strat-check-icon svg { width: 16px; height: 16px; stroke-width: 2; display: inline-block; vertical-align: middle; } /* Legacy check rows (Compliance) */ .ai-container .ai-strat-check-row { display: flex; align-items: flex-start; gap: 0.7rem; padding: 0.6rem 0; border-bottom: 1px solid rgba(187,210,245,.07); } .ai-container .ai-strat-check-row:last-child { border-bottom: none; } .ai-container .ai-strat-check-icon { width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; background: rgba(34,197,94,.15); color: #22c55e; } .ai-container .ai-strat-check-icon.warn { background: rgba(245,158,11,.15); color: #f59e0b; } .ai-container .ai-strat-check-icon.fail { background: rgba(239,68,68,.15); color: #ef4444; } .ai-container .ai-strat-check-icon.pending { background: rgba(79,124,255,.12); color: #4f7cff; } .ai-container .ai-strat-check-body { flex: 1; min-width: 0; } .ai-container .ai-strat-check-title { font-size: 0.84rem; font-weight: 500; color: var(--strat-ink-strong); } .ai-container .ai-strat-check-detail { font-size: 0.76rem; color: var(--strat-muted-2); margin-top: 0.1rem; line-height: 1.4; } /* Exclusion audit rows */ .ai-container .ai-strat-audit-summary { color: var(--strat-muted); font-size: 0.78rem; line-height: 1.5; } .ai-container .ai-strat-audit-summary strong { color: var(--strat-ink-strong); } .ai-container .ai-strat-audit-row { display: grid; grid-template-columns: 70px 1fr auto; gap: 0.4rem; padding: 0.3rem 0; border-bottom: 1px solid rgba(187,210,245,.05); font-size: 0.76rem; color: var(--strat-muted-2); } .ai-container .ai-strat-audit-row:last-child { border-bottom: none; } .ai-container .ai-strat-audit-ticker { color: var(--strat-ink-strong); font-weight: 500; font-family: monospace; } .ai-container .ai-strat-audit-reason { color: var(--strat-muted-2); } .ai-container .ai-strat-audit-status { color: #f87171; font-size: 0.68rem; font-weight: 500; text-align: right; } /* Advisor approval block */ .ai-container .ai-strat-approval-box { border: 1px solid rgba(187,210,245,.14); border-radius: 14px; padding: 1rem 1.1rem; background: rgba(255,255,255,.02); } .ai-container .ai-strat-approval-box.approved { border-color: rgba(34,197,94,.35); background: rgba(34,197,94,.04); } .ai-container .ai-strat-approval-box.rejected { border-color: rgba(239,68,68,.35); background: rgba(239,68,68,.04); } .ai-container .ai-strat-approval-box.changes { border-color: rgba(245,158,11,.35); background: rgba(245,158,11,.04); } .ai-container .ai-strat-approval-box.activated { border-color: rgba(34,197,94,.35); background: rgba(34,197,94,.04); } .ai-container .ai-strat-approval-stamp { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.3rem 0.7rem; border-radius: 9999px; font-size: 0.74rem; font-weight: 600; letter-spacing: 0.02em; margin-bottom: 0.5rem; } .ai-container .ai-strat-approval-stamp svg { width: 14px; height: 14px; } .ai-container .ai-strat-approval-stamp.approved { background: rgba(34,197,94,.14); border: 1px solid rgba(34,197,94,.35); color: #22c55e; } .ai-container .ai-strat-approval-stamp.activated { background: rgba(34,197,94,.14); border: 1px solid rgba(34,197,94,.35); color: #22c55e; } .ai-container .ai-strat-approval-stamp.rejected { background: rgba(239,68,68,.14); border: 1px solid rgba(239,68,68,.35); color: #ef4444; } .ai-container .ai-strat-approval-stamp.changes { background: rgba(245,158,11,.14); border: 1px solid rgba(245,158,11,.35); color: #f59e0b; } .ai-container .ai-strat-approval-meta { font-size: 0.74rem; color: var(--strat-muted-2); line-height: 1.5; } .ai-container .ai-strat-approval-meta strong { color: var(--strat-muted); font-weight: 500; } .ai-container .ai-strat-approval-ts { font-size: 0.68rem; color: var(--strat-muted-2); margin-top: 0.35rem; } .ai-container .ai-strat-approval-pending { display: flex; gap: 0.6rem; align-items: flex-start; margin-bottom: 0.75rem; } .ai-container .ai-strat-approval-pending-body { display: flex; flex-direction: column; gap: 4px; } .ai-container .ai-strat-approval-pending-body span:first-child { font-size: 0.9rem; font-weight: 600; color: var(--strat-ink-strong); } .ai-container .ai-strat-approval-actions { display: flex; gap: 0.5rem; margin-top: 0.75rem; } .ai-container .ai-strat-approval-actions .ai-strat-btn { flex: 1; font-size: 0.8rem; padding: 0.6rem 0.8rem; } .ai-container .ai-strat-btn-approve { background: rgba(34,197,94,.18); border-color: rgba(34,197,94,.45); color: #4ade80; } .ai-container .ai-strat-btn-changes { background: rgba(245,158,11,.12); border-color: rgba(245,158,11,.35); color: #fbbf24; } .ai-container .ai-strat-btn-reject { background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.35); color: #f87171; } .ai-container .ai-strat-notes-input { width: 100%; border-radius: 10px; border: 1px solid rgba(187,210,245,.14); background: rgba(255,255,255,.03); padding: 8px 10px; color: var(--strat-ink-strong); outline: none; font-size: 0.82rem; resize: vertical; min-height: 52px; font-family: inherit; } .ai-container .ai-strat-notes-input::placeholder { color: rgba(159,179,204,.6); } .ai-container .ai-strat-notes-input:focus { border-color: rgba(79,124,255,.55); box-shadow: 0 0 0 3px rgba(79,124,255,.14); } /* Mini allocation bars (Agent flow overlay) */ .ai-container .ai-strat-mini-alloc { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; font-size: 0.78rem; } .ai-container .ai-strat-ma-name { font-size: 0.74rem; color: var(--strat-muted); min-width: 100px; } .ai-container .ai-strat-ma-bar { flex: 1; height: 4px; background: rgba(15,31,55,1); border-radius: 999px; overflow: hidden; } .ai-container .ai-strat-ma-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, #6aa7ff, #4f7cff); } .ai-container .ai-strat-ma-pct { font-size: 0.72rem; font-weight: 600; color: var(--strat-ink-strong); min-width: 32px; text-align: right; } /* Inline check chips (agent flow handoff) */ .ai-container .ai-strat-chk-item { display: flex; align-items: center; gap: 6px; padding: 3px 0; font-size: 0.8rem; color: var(--strat-muted-2); } .ai-container .ai-strat-chk-pass { color: #22c55e; } .ai-container .ai-strat-chk-run { color: #4f7cff; } .ai-container .ai-strat-chk-wait { color: var(--strat-muted-2); opacity: 0.65; } /* ============================================================ */ /* AGENT FLOW OVERLAY */ /* ============================================================ */ .ai-container .ai-strat-flow-overlay { display: none; position: fixed; inset: 0; z-index: 9999; background: rgba(14, 34, 57, 0.92); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); animation: stratFlowFadeIn 0.25s ease; overflow-y: auto; } .ai-container .ai-strat-flow-overlay.visible { display: block; } @keyframes stratFlowFadeIn { from { opacity: 0; } to { opacity: 1; } } .ai-container .ai-strat-flow-wrap { max-width: 960px; margin: 0 auto; padding: 28px 24px 48px; } .ai-container .ai-strat-flow-topbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; } .ai-container .ai-strat-flow-topbar h2 { font-size: 1.15rem; font-weight: 600; color: var(--strat-ink-strong); display: flex; align-items: center; gap: 0.6rem; margin: 0; } .ai-container .ai-strat-flow-ico { width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, #4f7cff, #a78bfa); display: flex; align-items: center; justify-content: center; font-size: 14px; color: #fff; } .ai-container .ai-strat-flow-label { font-size: 0.74rem; font-weight: 400; color: var(--strat-muted-2); margin-left: 4px; } .ai-container .ai-strat-flow-close { width: 34px; height: 34px; border-radius: 10px; border: 1px solid rgba(187,210,245,.18); background: rgba(255,255,255,.03); color: var(--strat-muted); cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 16px; transition: all 0.15s; } .ai-container .ai-strat-flow-close:hover { background: rgba(255,255,255,.06); color: var(--strat-ink-strong); } /* Horizontal Timeline */ .ai-container .ai-strat-flow-timeline { display: flex; align-items: center; gap: 0; margin-bottom: 28px; padding: 16px 0; overflow-x: auto; } .ai-container .ai-strat-flow-node { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 110px; cursor: pointer; position: relative; } .ai-container .ai-strat-flow-node-circle { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 16px; border: 2px solid rgba(187,210,245,.2); background: rgba(255,255,255,.03); transition: all 0.25s; } .ai-container .ai-strat-flow-node.done .ai-strat-flow-node-circle { border-color: var(--strat-green); background: rgba(34,197,94,.1); box-shadow: 0 0 12px rgba(34,197,94,.15); } .ai-container .ai-strat-flow-node.run .ai-strat-flow-node-circle { border-color: var(--strat-brand); background: rgba(79,124,255,.1); animation: stratNodeGlow 2.5s infinite; } @keyframes stratNodeGlow { 0%, 100% { box-shadow: 0 0 0 0 rgba(79,124,255,.25); } 50% { box-shadow: 0 0 0 8px rgba(79,124,255,0); } } .ai-container .ai-strat-flow-node.wait .ai-strat-flow-node-circle { opacity: 0.45; } .ai-container .ai-strat-flow-node.sel .ai-strat-flow-node-circle { border-color: var(--strat-brand); box-shadow: 0 0 0 3px rgba(79,124,255,.2); transform: scale(1.08); } .ai-container .ai-strat-flow-node-label { font-size: 0.68rem; font-weight: 600; text-align: center; color: var(--strat-muted-2); max-width: 90px; transition: color 0.2s; } .ai-container .ai-strat-flow-node.sel .ai-strat-flow-node-label { color: var(--strat-ink-strong); } .ai-container .ai-strat-flow-node-time { font-size: 0.62rem; color: var(--strat-muted-2); font-family: monospace; opacity: 0.7; } .ai-container .ai-strat-flow-conn { flex: 1; min-width: 32px; height: 2px; background: rgba(187,210,245,.14); position: relative; margin-bottom: 32px; } .ai-container .ai-strat-flow-conn.done { background: var(--strat-green); } .ai-container .ai-strat-flow-conn.active { background: linear-gradient(90deg, var(--strat-green), var(--strat-brand)); overflow: visible; } .ai-container .ai-strat-flow-conn.active::after { content: ''; position: absolute; right: -3px; top: -3px; width: 8px; height: 8px; background: var(--strat-brand); border-radius: 50%; animation: stratTravelDot 1.8s ease-in-out infinite; } @keyframes stratTravelDot { 0% { right: 100%; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { right: -3px; opacity: 0; } } /* Agent Detail Cards */ .ai-container .ai-strat-agent-detail { display: none; animation: stratAgentSlideUp 0.3s ease; } .ai-container .ai-strat-agent-detail.visible { display: block; } @keyframes stratAgentSlideUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .ai-container .ai-strat-agent-card { background: var(--strat-panel); border: 1px solid var(--strat-panel-border); border-radius: 16px; overflow: hidden; color: var(--strat-ink); } .ai-container .ai-strat-agent-head { padding: 16px 20px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(187,210,245,.1); flex-wrap: wrap; gap: 8px; } .ai-container .ai-strat-agent-head-left { display: flex; align-items: center; gap: 12px; } .ai-container .ai-strat-agent-ico { width: 36px; height: 36px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 16px; } .ai-container .ai-strat-agent-head h3 { font-size: 0.92rem; font-weight: 600; color: var(--strat-ink-strong); margin: 0; } .ai-container .ai-strat-agent-sub { font-size: 0.72rem; color: var(--strat-muted-2); } .ai-container .ai-strat-agent-card p { color: var(--strat-muted); font-size: 0.82rem; line-height: 1.45; margin: 0.25rem 0; } .ai-container .ai-strat-agent-queued { color: var(--strat-muted); } .ai-container .ai-strat-agent-head-right { display: flex; align-items: center; gap: 10px; } .ai-container .ai-strat-agent-timing { font-family: monospace; font-size: 0.7rem; color: var(--strat-muted-2); } /* Handoff Grid */ .ai-container .ai-strat-handoff-grid { display: grid; grid-template-columns: 1fr 48px 1fr; gap: 0; } .ai-container .ai-strat-handoff-in, .ai-container .ai-strat-handoff-out { padding: 16px 20px; } .ai-container .ai-strat-handoff-in { border-right: 1px solid rgba(187,210,245,.08); } .ai-container .ai-strat-handoff-out { border-left: 1px solid rgba(187,210,245,.08); } .ai-container .ai-strat-handoff-mid { display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; } .ai-container .ai-strat-handoff-mid::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: rgba(187,210,245,.1); } .ai-container .ai-strat-proc-badge { position: relative; z-index: 2; background: var(--strat-panel); border: 1px solid rgba(187,210,245,.18); border-radius: 50%; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; color: var(--strat-brand); font-size: 12px; } .ai-container .ai-strat-ho-label { font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--strat-muted-2); margin-bottom: 10px; display: flex; align-items: center; gap: 5px; } .ai-container .ai-strat-ho-label .arr-in { color: var(--strat-green); } .ai-container .ai-strat-ho-label .arr-out { color: var(--strat-brand); } .ai-container .ai-strat-data-row { display: flex; align-items: baseline; gap: 8px; padding: 4px 0; font-size: 0.82rem; } .ai-container .ai-strat-data-row .dk { color: var(--strat-muted-2); font-size: 0.74rem; min-width: 80px; flex-shrink: 0; } .ai-container .ai-strat-data-row .dv { color: var(--strat-ink-strong); font-weight: 500; } /* Agent Reasoning */ .ai-container .ai-strat-agent-reasoning { padding: 16px 20px; border-top: 1px solid rgba(187,210,245,.08); background: rgba(79,124,255,.03); } .ai-container .ai-strat-reasoning-label { font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(167,139,250,.8); margin-bottom: 8px; display: flex; align-items: center; gap: 5px; } .ai-container .ai-strat-reasoning-text { font-size: 0.84rem; line-height: 1.55; color: var(--strat-muted); } .ai-container .ai-strat-reasoning-text strong { color: var(--strat-ink-strong); font-weight: 600; } /* Tags */ .ai-container .ai-strat-htag { display: inline-flex; align-items: center; gap: 3px; font-size: 0.68rem; font-weight: 500; padding: 2px 8px; border-radius: 9999px; margin: 1px 2px; } .ai-container .ai-strat-htag-green { background: rgba(34,197,94,.1); border: 1px solid rgba(34,197,94,.3); color: #4ade80; } .ai-container .ai-strat-htag-blue { background: rgba(79,124,255,.1); border: 1px solid rgba(79,124,255,.3); color: #6aa7ff; } .ai-container .ai-strat-htag-amber { background: rgba(245,158,11,.1); border: 1px solid rgba(245,158,11,.3); color: #fbbf24; } .ai-container .ai-strat-htag-muted { background: rgba(154,167,191,.14); border: 1px solid rgba(154,167,191,.3); color: #9aa7bf; } /* Responsive */ @media (max-width: 700px) { .ai-container .ai-strat-handoff-grid { grid-template-columns: 1fr; } .ai-container .ai-strat-handoff-in { border-right: none; border-bottom: 1px solid rgba(187,210,245,.08); } .ai-container .ai-strat-handoff-out { border-left: none; border-top: 1px solid rgba(187,210,245,.08); } .ai-container .ai-strat-handoff-mid { flex-direction: row; padding: 8px 0; } .ai-container .ai-strat-handoff-mid::before { display: none; } } @media (max-width: 768px) { .ai-container .ai-strategies-page { padding: 1rem; } .ai-container .ai-strategies-header { flex-direction: column; align-items: flex-start; } .ai-container .ai-strategies-header-actions { width: 100%; } .ai-container .ai-strat-detail-header { flex-direction: column; } .ai-container .ai-strat-tabs { flex-wrap: wrap; } .ai-container .ai-strat-actions-bar { flex-direction: column; } .ai-container .ai-strat-flow-timeline { padding: 8px 0; } .ai-container .ai-strat-flow-node { min-width: 80px; } } /* Empty State */ .ai-container .ai-strat-empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 400px; text-align: center; padding: 3rem; } .ai-container .ai-strat-empty-icon { width: 80px; height: 80px; border-radius: 50%; background: rgba(79,124,255,.1); border: 1px solid rgba(79,124,255,.25); display: flex; align-items: center; justify-content: center; margin-bottom: 1.5rem; } .ai-container .ai-strat-empty-icon i { font-size: 2rem; color: var(--strat-brand); } .ai-container .ai-strat-empty-title { font-size: 1.5rem; font-weight: 600; color: var(--strat-ink-strong); margin: 0 0 0.5rem 0; } .ai-container .ai-strat-empty-subtitle { font-size: 0.95rem; color: var(--strat-muted); max-width: 400px; margin: 0 0 1rem 0; line-height: 1.5; } .ai-container .ai-strat-empty-hint { font-size: 0.8rem; color: var(--strat-muted-2); margin: 0; } /* Strategy Detail Container */ .ai-container .ai-strat-detail-container { display: flex; flex-direction: column; gap: 1.25rem; } /* Strategy List Items - matching spec's .listItem styling */ .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-list-item { border: 1px solid rgba(187,210,245,.14); border-radius: 14px; padding: 0.75rem 0.8rem; background: rgba(255,255,255,.02); cursor: pointer; transition: all 0.15s; margin-bottom: 0.5rem; } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem:hover, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-list-item:hover { background: rgba(255,255,255,.05); } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem.active, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-list-item.active { border-color: rgba(79,124,255,.55); background: rgba(79,124,255,.12); } /* Remove old table-based styling that's no longer needed */ .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .BFDataTable-data table { width: 100%; border-collapse: collapse; } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .BFDataTable-data tbody tr { display: none; /* Hide if any old table rows exist */ } /* Badge styling within list items - keeping specific to avoid conflicts */ .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem .badge, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-list-item .badge { padding: 0.18rem 0.6rem; border-radius: 9999px; border: 1px solid var(--strat-chip-border); font-size: 0.72rem; color: var(--strat-muted-2); background: rgba(255,255,255,.02); user-select: none; white-space: nowrap; font-weight: normal; line-height: normal; } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem .badge.on, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-list-item .badge.on { color: var(--strat-ink-strong); border-color: rgba(79,124,255,.55); background: rgba(79,124,255,.12); } /* Strategy name styling */ .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-name, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem .ai-strategies-name { font-size: 0.875rem; font-weight: 600; color: var(--strat-ink-strong); } /* Text styling within list items */ .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem .text-sm, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-list-item .text-sm { font-size: 0.875rem; } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem .text-xs, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-list-item .text-xs { font-size: 0.75rem; } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem .font-semibold, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-list-item .font-semibold { font-weight: 600; } .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .listItem .muted, .ai-container .ai-strategies-sidebar .ai-chat-nav-strategies .ai-strategies-list-item .muted { color: var(--strat-muted); } /* Show more button for strategies list */ .ai-container .ai-strategy-hidden { display: none !important; } .ai-container .ai-strategies-show-more { display: flex; align-items: center; justify-content: center; padding: 0.5rem 0.8rem; margin-top: 0.5rem; cursor: pointer; transition: all 0.15s; border-radius: 10px; } .ai-container .ai-strategies-show-more:hover { background: rgba(255,255,255,.04); } .ai-container .ai-strategies-show-more-content { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8rem; font-weight: 500; color: var(--strat-muted-2); } .ai-container .ai-strategies-show-more-content .fa { font-size: 0.7rem; color: var(--strat-brand); transition: transform 0.2s; } .ai-container .ai-strategies-show-more.expanded .ai-strategies-show-more-content .fa { transform: rotate(180deg); } .ai-container .ai-strategies-count, .ai-container .ai-strategies-show-more-text { color: var(--strat-brand); } .ai-container .ai-strategies-count { font-weight: 600; } /* Filtered items (search/status) */ .ai-container .filtered-hidden { display: none !important; } /* Filter result count */ .ai-container .ai-strat-filter-count { font-size: 0.75rem; color: var(--strat-muted-2); margin: 0.35rem 0 0.5rem; text-align: center; } /* Strategy approval overlays */ .ai-approve-overlay { --strat-ink: #d7e4f7; --strat-ink-strong: #e9f2ff; --strat-muted: #9fb3cc; --strat-muted-2: #87a0bb; position: fixed; inset: 0; background: rgba(14,34,57,0.94); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); display: none; align-items: center; justify-content: center; padding: 20px; z-index: 9999; color: var(--strat-ink); } .ai-approve-overlay.visible { display: flex; } .ai-approve-modal { width: 100%; max-width: 560px; background: linear-gradient(180deg, #162d4a, #0f2438); border: 1px solid rgba(187,210,245,.1); border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.5); color: var(--strat-ink, #d7e4f7); } .ai-approve-header, .ai-approve-footer { padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(187,210,245,.08); } .ai-approve-footer { border-bottom: none; border-top: 1px solid rgba(187,210,245,.06); justify-content: center; } .ai-approve-title { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 600; color: var(--strat-ink-strong, #e9f2ff); } .ai-approve-title-icon { width: 32px; height: 32px; border-radius: 8px; background: rgba(34,197,94,.12); display: grid; place-items: center; } .ai-approve-close { width: 30px; height: 30px; border-radius: 6px; border: 1px solid rgba(187,210,245,.12); background: transparent; color: var(--strat-muted, #9fb3cc); cursor: pointer; display: grid; place-items: center; } .ai-approve-close:hover { background: rgba(255,255,255,.04); color: var(--strat-ink-strong, #e9f2ff); } .ai-approve-body { padding: 20px 22px; display: flex; flex-direction: column; gap: 20px; } .ai-approve-info { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: rgba(255,255,255,.025); border: 1px solid rgba(187,210,245,.08); border-radius: 10px; } .ai-approve-info-ico { width: 40px; height: 40px; border-radius: 8px; background: linear-gradient(135deg, rgba(79,124,255,.12), rgba(147,112,219,.12)); display: grid; place-items: center; } .ai-approve-info-text h4 { font-size: 14px; font-weight: 600; color: var(--strat-ink-strong, #e9f2ff); margin: 0 0 2px; } .ai-approve-info-text span { font-size: 11px; color: var(--strat-muted, #9fb3cc); } .ai-approve-check { width: 22px; height: 22px; border-radius: 50%; background: rgba(34,197,94,.1); display: grid; place-items: center; } .ai-approve-actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; } .ai-approve-card { background: rgba(255,255,255,.015); border: 1px solid rgba(187,210,245,.08); border-radius: 12px; padding: 20px 16px; text-align: center; cursor: pointer; transition: all .15s ease; } .ai-approve-card:hover { transform: translateY(-1px); background: rgba(255,255,255,.03); } .ai-approve-card .ai-approve-icon { width: 44px; height: 44px; border-radius: 10px; margin: 0 auto 12px; display: grid; place-items: center; } .ai-approve-card.green .ai-approve-icon { background: rgba(34,197,94,.1); color: #22c55e; } .ai-approve-card.blue .ai-approve-icon { background: rgba(79,124,255,.1); color: #6aa7ff; } .ai-approve-overlay .ai-approve-card h4, .ai-monitoring-confirm-overlay .ai-approve-card h4 { font-size: 13px; font-weight: 600; color: var(--strat-ink-strong, #e9f2ff); margin: 0 0 6px; } .ai-approve-overlay .ai-approve-card p, .ai-monitoring-confirm-overlay .ai-approve-card p { font-size: 11px; color: var(--strat-muted, #9fb3cc); line-height: 1.5; margin: 0 0 14px; } .ai-approve-card .ai-approve-btn { display: inline-flex; align-items: center; gap: 5px; padding: 8px 14px; border-radius: 6px; font-size: 11px; font-weight: 500; cursor: pointer; border: 1px solid transparent; background: rgba(79,124,255,.15); color: #93c5fd; } .ai-approve-card.green .ai-approve-btn { background: rgba(34,197,94,.15); border-color: rgba(34,197,94,.25); color: #4ade80; } .ai-approve-card.blue .ai-approve-btn { background: rgba(79,124,255,.15); border-color: rgba(79,124,255,.25); color: #93c5fd; } .ai-approve-card.green:hover { border-color: rgba(34,197,94,.3); } .ai-approve-card.blue:hover { border-color: rgba(79,124,255,.3); } .ai-approve-overlay .ai-approve-footer p { font-size: 11px; color: var(--strat-muted-2, #87a0bb); } .ai-approve-actions.three-col { grid-template-columns: repeat(3, 1fr); } .ai-approve-card.approved-badge-card { cursor: default; border-color: rgba(34,197,94,.2); background: rgba(34,197,94,.04); position: relative; } .ai-approve-card.approved-badge-card:hover { transform: none; background: rgba(34,197,94,.04); } .ai-approve-card .ai-approve-icon.approved-icon { background: rgba(34,197,94,.1); color: #22c55e; } .ai-approve-badge-check { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: rgba(34,197,94,.15); color: #4ade80; } .ai-approve-card.amber .ai-approve-icon { background: rgba(245,158,11,.1); color: #f59e0b; } .ai-approve-card.amber .ai-approve-btn { background: rgba(245,158,11,.15); border-color: rgba(245,158,11,.25); color: #fbbf24; } .ai-approve-card.amber:hover { border-color: rgba(245,158,11,.3); } .ai-toast-overlay { position: fixed; top: 20px; right: 20px; z-index: 10000; opacity: 0; transform: translateY(-10px); transition: opacity .3s ease, transform .3s ease; pointer-events: none; } .ai-toast-overlay.visible { opacity: 1; transform: translateY(0); pointer-events: auto; } .ai-toast-content { display: flex; align-items: center; gap: 10px; padding: 12px 20px; background: linear-gradient(135deg, #162d4a, #1a3550); border: 1px solid rgba(34,197,94,.25); border-radius: 10px; box-shadow: 0 8px 30px rgba(0,0,0,.4); color: #4ade80; font-size: 13px; font-weight: 500; } .ai-toast-icon { flex-shrink: 0; color: #22c55e; } .ai-alert-channel { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; } .ai-alert-option { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: rgba(255,255,255,.02); border: 1px solid rgba(187,210,245,.1); border-radius: 10px; cursor: pointer; transition: all .15s; } .ai-alert-option:hover { background: rgba(255,255,255,.04); border-color: rgba(187,210,245,.18); } .ai-alert-option.sel { background: rgba(79,124,255,.08); border-color: rgba(79,124,255,.35); } .ai-alert-radio { width: 18px; height: 18px; border-radius: 50%; border: 2px solid rgba(187,210,245,.3); display: grid; place-items: center; } .ai-alert-option.sel .ai-alert-radio { border-color: #4f7cff; } .ai-alert-option.sel .ai-alert-radio::after { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #4f7cff; } .ai-alert-input { padding: 10px 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(187,210,245,.12); border-radius: 8px; color: var(--strat-ink-strong, #e9f2ff); width: 100%; } .ai-alert-input::placeholder { color: var(--strat-muted-2, #87a0bb); } .ai-alert-hint { font-size: 11px; color: var(--strat-muted-2, #87a0bb); margin-top: 10px; } .ai-approve-overlay .ai-strat-panel-note { font-size: 0.72rem; color: var(--strat-muted, #9fb3cc); } .ai-approve-overlay .input-label { font-size: 12px; color: var(--strat-muted, #9fb3cc); margin-bottom: 8px; } .ai-approve-overlay .input-section .ai-approve-btn { display: inline-flex; align-items: center; gap: 5px; padding: 8px 14px; border-radius: 6px; font-size: 11px; font-weight: 500; cursor: pointer; border: 1px solid rgba(79,124,255,.25); background: rgba(79,124,255,.15); color: #93c5fd; } /* ============================================================ */ /* Import Holdings overlay */ /* ============================================================ */ .ai-import-overlay { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.55); z-index: 10000; align-items: center; justify-content: center; padding: 20px; } .ai-import-overlay.visible { display: flex; } .ai-import-modal { width: 100%; max-width: 720px; background: linear-gradient(180deg, #162d4a, #0f2438); border: 1px solid rgba(187,210,245,.1); border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.5); color: var(--strat-ink, #d7e4f7); max-height: 90vh; display: flex; flex-direction: column; } .ai-import-header { padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(187,210,245,.08); flex-shrink: 0; } .ai-import-body { padding: 20px 22px; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 16px; } .ai-import-sub { font-size: 12px; color: var(--strat-muted, #9fb3cc); line-height: 1.5; margin: 0; } .ai-import-footer { display: flex; align-items: center; gap: 10px; padding-top: 14px; flex-shrink: 0; } /* Steps */ .ai-import-steps { display: flex; align-items: center; gap: 0; padding: 14px 22px; border-bottom: 1px solid rgba(187,210,245,.06); flex-shrink: 0; } .ai-import-step { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--strat-muted, #9fb3cc); } .ai-import-step.active { color: var(--strat-ink, #d7e4f7); } .ai-import-step.done { color: #22c55e; } .ai-import-step-num { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 800; border: 2px solid rgba(187,210,245,.15); } .ai-import-step.active .ai-import-step-num { border-color: #4f7cff; background: rgba(79,124,255,.15); color: #e9f2ff; } .ai-import-step.done .ai-import-step-num { border-color: #22c55e; background: #22c55e; color: #fff; } .ai-import-step-line { flex: 1; height: 2px; background: rgba(187,210,245,.1); margin: 0 10px; } .ai-import-step-line.done { background: #22c55e; } /* Method selection */ .ai-import-methods { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; } .ai-import-method { border: 1px solid rgba(187,210,245,.1); border-radius: 12px; padding: 14px; text-align: center; cursor: pointer; transition: all .15s; background: rgba(255,255,255,.02); } .ai-import-method:hover { background: rgba(255,255,255,.04); border-color: rgba(79,124,255,.2); } .ai-import-method.selected { border-color: rgba(79,124,255,.4); background: rgba(79,124,255,.07); box-shadow: 0 0 0 1px rgba(79,124,255,.2); } .ai-import-method-icon { font-size: 28px; margin-bottom: 8px; } .ai-import-method-label { font-size: 12px; font-weight: 800; margin-bottom: 2px; } .ai-import-method-desc { font-size: 10px; color: var(--strat-muted, #9fb3cc); } /* Template bar */ .ai-import-template { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: rgba(79,124,255,.06); border: 1px solid rgba(79,124,255,.15); border-radius: 10px; } .ai-import-template-text { flex: 1; font-size: 11px; color: var(--strat-muted, #9fb3cc); } .ai-import-template-text strong { color: var(--strat-ink, #d7e4f7); } /* Buttons inside import overlay */ .ai-import-overlay .ai-approve-btn { display: inline-flex; align-items: center; gap: 5px; padding: 8px 14px; border-radius: 6px; font-size: 11px; font-weight: 600; cursor: pointer; border: 1px solid rgba(187,210,245,.15); background: transparent; color: var(--strat-muted, #9fb3cc); } .ai-import-overlay .ai-approve-btn:hover { background: rgba(255,255,255,.04); } .ai-import-overlay .ai-approve-btn.btn-primary { background: rgba(79,124,255,.15); border-color: rgba(79,124,255,.25); color: #93c5fd; } .ai-import-overlay .ai-approve-btn.btn-primary:hover { background: rgba(79,124,255,.22); } .ai-import-overlay .ai-approve-btn.btn-success { background: rgba(34,197,94,.15); border-color: rgba(34,197,94,.25); color: #4ade80; } .ai-import-overlay .ai-approve-btn.btn-success:hover { background: rgba(34,197,94,.22); } .ai-import-overlay a.ai-import-template-dl { padding: 6px 12px; border-radius: 8px; font-size: 11px; font-weight: 700; border: 1px solid rgba(79,124,255,.25); background: rgba(79,124,255,.12); color: #93c5fd; cursor: pointer; text-decoration: none; white-space: nowrap; } .ai-import-overlay a.ai-import-template-dl:hover { background: rgba(79,124,255,.2); color: #93c5fd; text-decoration: none; } /* Dropzone */ .ai-import-dropzone { border: 2px dashed rgba(187,210,245,.18); border-radius: 12px; padding: 32px 20px; text-align: center; cursor: pointer; transition: all .2s; position: relative; } .ai-import-dropzone:hover, .ai-import-dropzone.dragover { border-color: #4f7cff; background: rgba(79,124,255,.04); } .ai-import-dropzone-icon { font-size: 40px; margin-bottom: 12px; opacity: .6; } .ai-import-dropzone-text { font-size: 13px; color: var(--strat-muted, #9fb3cc); } .ai-import-dropzone-text strong { color: var(--strat-ink, #d7e4f7); } .ai-import-dropzone-hint { font-size: 10px; color: var(--strat-muted, #9fb3cc); opacity: .6; margin-top: 4px; } .ai-import-dropzone input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; } .ai-import-file-selected { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: rgba(79,124,255,.06); border: 1px solid rgba(79,124,255,.18); border-radius: 10px; margin-top: 8px; } .ai-import-file-name { flex: 1; font-size: 12px; font-weight: 600; } .ai-import-overlay a.ai-import-file-remove { font-size: 11px; color: #f87171; cursor: pointer; text-decoration: none; } .ai-import-overlay a.ai-import-file-remove:hover { text-decoration: underline; } /* Paste area */ .ai-import-paste-area { width: 100%; min-height: 140px; border-radius: 10px; border: 1px solid rgba(187,210,245,.12); background: rgba(0,0,0,.2); color: var(--strat-ink, #d7e4f7); font-family: 'DM Mono', monospace; font-size: 11px; padding: 12px; resize: vertical; outline: none; } .ai-import-paste-area:focus { border-color: #4f7cff; } .ai-import-paste-area::placeholder { color: rgba(159,179,204,.35); } .ai-import-paste-hint { font-size: 10px; color: var(--strat-muted, #9fb3cc); opacity: .6; margin-top: 4px; } /* Messages */ .ai-import-msg { padding: 10px 14px; border-radius: 10px; font-size: 12px; font-weight: 600; display: flex; align-items: center; gap: 8px; } .ai-import-msg.error { background: rgba(239,68,68,.08); border: 1px solid rgba(239,68,68,.2); color: #fca5a5; } .ai-import-msg.warn { background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.2); color: #fde68a; } .ai-import-msg.info { background: rgba(79,124,255,.08); border: 1px solid rgba(79,124,255,.2); color: #93c5fd; } .ai-import-info-msg { font-size: 11px; color: var(--strat-muted, #9fb3cc); padding: 10px 14px; background: rgba(79,124,255,.06); border: 1px solid rgba(79,124,255,.12); border-radius: 10px; } /* Loading */ .ai-import-loading { display: flex; align-items: center; gap: 12px; padding: 30px; justify-content: center; font-size: 13px; color: var(--strat-muted, #9fb3cc); } /* Format badge */ .ai-import-format-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 8px; font-size: 11px; font-weight: 700; background: rgba(79,124,255,.08); border: 1px solid rgba(79,124,255,.15); color: #93c5fd; } /* Preview summary stats */ .ai-import-summary { display: flex; gap: 10px; flex-wrap: wrap; } .ai-import-stat { padding: 10px 14px; border-radius: 10px; background: rgba(255,255,255,.025); border: 1px solid rgba(187,210,245,.08); min-width: 90px; } .ai-import-stat-val { font-size: 18px; font-weight: 800; margin-bottom: 1px; } .ai-import-stat-val.green { color: #22c55e; } .ai-import-stat-val.blue { color: #93c5fd; } .ai-import-stat-val.amber { color: #fde68a; } .ai-import-stat-label { font-size: 10px; color: var(--strat-muted, #9fb3cc); font-weight: 600; } /* Warnings */ .ai-import-warnings { font-size: 11px; color: #fde68a; padding: 10px 14px; background: rgba(245,158,11,.06); border: 1px solid rgba(245,158,11,.15); border-radius: 10px; } /* Preview table */ .ai-import-preview-table-wrap { overflow-x: auto; border: 1px solid rgba(187,210,245,.08); border-radius: 10px; } .ai-import-preview-table { width: 100%; border-collapse: collapse; font-size: 12px; } .ai-import-preview-table thead th { text-align: left; color: var(--strat-muted, #9fb3cc); font-weight: 700; padding: 8px 10px; border-bottom: 1px solid rgba(187,210,245,.08); background: rgba(0,0,0,.08); font-size: 11px; } .ai-import-preview-table tbody td { padding: 8px 10px; border-bottom: 1px solid rgba(187,210,245,.05); color: var(--strat-ink, #d7e4f7); } .ai-import-preview-table tbody tr:hover { background: rgba(255,255,255,.03); } .ai-import-preview-table .client-group-header { cursor: pointer; } .ai-import-preview-table .client-group-header:hover { background: rgba(255,255,255,.03); } .ai-import-preview-table .expand-toggle { cursor: pointer; display: inline-flex; align-items: center; color: #4f7cff; font-size: 12px; font-weight: 700; } .ai-import-preview-table .tag { display: inline-flex; padding: 3px 8px; border-radius: 999px; font-size: 10px; font-weight: 800; white-space: nowrap; } .ai-import-preview-table .tag-new { color: #bbf7d0; background: rgba(34,197,94,.1); border: 1px solid rgba(34,197,94,.25); } .ai-import-preview-table .tag-skipped { color: var(--strat-muted, #9fb3cc); background: rgba(148,163,184,.08); border: 1px solid rgba(148,163,184,.18); } .ai-import-preview-table .skipped-row { opacity: .45; } .ai-import-preview-table .skipped-row:hover { opacity: .65; } .ai-import-preview-table .position-row { font-size: 12px; } .ai-import-preview-table .pos-ticker { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-weight: 700; font-size: 12px; color: #4f7cff; } .ai-import-preview-table .pos-warn { color: #f59e0b; font-size: 11px; font-weight: 600; margin-left: 6px; } /* ============================================================ */ /* Chat conversation inside strategies page — light theme */ /* ============================================================ */ .ai-container .ai-strategies-page .ai-chat-conv-container { background-color: #ffffff; color: #1a1a2e; border-radius: 16px; border: 1px solid #e2e8f0; padding: 1.25rem; width: 100%; overflow-x: auto; } .ai-container .ai-strategies-page .ai-chat-conv-container, .ai-container .ai-strategies-page .ai-chat-conv-container * { color: #1a1a2e; } .ai-container .ai-strategies-page .chat-ai-request { background-color: #f0f4ff; } .ai-container .ai-strategies-page .chat-ai-response { background-color: transparent; color: #1a1a2e; } .ai-container .ai-strategies-page .chat-ai-response table { color: #1a1a2e; } .ai-container .ai-strategies-page .chat-ai-response th { background-color: #f1f5f9; color: #334155; } .ai-container .ai-strategies-page .chat-ai-response td { color: #1e293b; border-color: #e2e8f0; } .ai-container .ai-strategies-page .chat-ai-response tr:nth-child(even) { background-color: #f8fafc; } .ai-container .ai-strategies-page .chat-ai-response tr:nth-child(odd) { background-color: #ffffff; } .ai-container .ai-strategies-page .chat-ai-fus-label { color: #475569; } .ai-container .ai-strategies-page .chat-ai-fu { background-color: #f0f4ff; color: #1e40af; border: 1px solid #bfdbfe; } .ai-container .ai-strategies-page .chat-ai-fu:hover { background-color: #dbeafe; } .ai-container .ai-strategies-page .chat-ai-response-share-container { color: #64748b; } .ai-container .ai-strategies-page .chat-ai-buy .chat-ai-button { color: #ffffff; } .ai-container .ai-strategies-page .chat-ai-response-edit-strategy, .ai-container .ai-strategies-page .chat-ai-response-upd-portfolio, .ai-container .ai-strategies-page .chat-ai-response-view-portfolio { color: #ffffff; } .ai-container .ai-strategies-page .ai-chat-send-container { border-top: 1px solid #e2e8f0; padding-top: 0.75rem; margin-top: 0.75rem; } .ai-container .ai-strategies-page ._ai-chat-msg { background-color: #f8fafc; color: #1a1a2e; border: 1px solid #e2e8f0; border-radius: 8px; } .ai-container .ai-strategies-page ._ai-chat-msg::placeholder { color: #94a3b8; }