



/* ------------- 
content start - Вебинарка
------------- */

/* ==========================================================================
   Мультипликатор — веб-комната (GetCourse, /pl/webinar/show)
   Все правила работают только внутри html.ko-page-webinar — класс ставит
   скрипт webinar-theme-toggle.js на странице вебинара (controllerId === "show").
   Две темы: html.ko-page-webinar[data-theme="light"] и [data-theme="dark"].
   Темы отличаются только значениями переменных; все правила ниже — общие.
   ========================================================================== */

/* ---------- 1. Переменные: светлая тема (и тема по умолчанию) ---------- */
html.ko-page-webinar,
html.ko-page-webinar[data-theme="light"] {
  color-scheme: light;

  /* поверхности */
  --mp-bg: #eef5f7;
  --mp-bg-glow: rgba(118, 207, 233, 0.16);
  --mp-surface: #ffffff;
  --mp-surface-2: #e6f0f4;
  --mp-stage: #e4eef3;
  --mp-stage-glow: #ffffff;
  --mp-stage-shadow: 0 30px 70px rgba(49, 85, 104, 0.14), 0 2px 6px rgba(49, 85, 104, 0.06);
  --mp-stage-dots: rgba(84, 120, 140, 0.30);

  /* текст */
  --mp-text: #071116;
  --mp-body: #354e5d;
  --mp-muted: #526b79;
  --mp-line: rgba(121, 147, 162, 0.32);

  /* акценты */
  --mp-cyan: #14738d;
  --mp-violet: #735fb5;
  --mp-admin: #7a4fb0;
  --mp-accent-gradient: linear-gradient(105deg, #126f89 0%, #447db1 30%, #735fb5 55%, #187b9a 78%, #126f89 100%);
  --mp-accent-glow: rgba(20, 115, 141, 0);

  /* поле ввода */
  --mp-input-bg: #ffffff;
  --mp-input-border: rgba(121, 147, 162, 0.40);
  --mp-input-focus: rgba(20, 115, 141, 0.55);
  --mp-input-ring: rgba(20, 115, 141, 0.14);

  /* основная кнопка */
  --mp-btn-gradient: linear-gradient(110deg, #1f6e8c 0%, #3d78a8 30%, #6a5fb0 55%, #24739a 80%, #1f6e8c 100%);
  --mp-btn-text: #ffffff;
  --mp-btn-border: rgba(255, 255, 255, 0.18);
  --mp-btn-shadow: 0 2px 3px rgba(20, 60, 80, 0.16), 0 12px 32px rgba(40, 110, 150, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.22);
  --mp-btn-glint: rgba(255, 255, 255, 0.35);

  /* переключатель темы (значения из бренд-гайда) */
  --mp-toggle-bg: #dae7ec;
  --mp-toggle-border: rgba(121, 147, 162, 0.37);
  --mp-toggle-icon: #526b79;
  --mp-toggle-icon-active: #071116;
  --mp-toggle-shadow: inset 0 1px 0 #ffffff, 0 8px 24px rgba(49, 85, 104, 0.094);
  --mp-thumb-bg: #ffffff;
  --mp-thumb-shadow: 0 3px 12px rgba(54, 85, 104, 0.2);

  /* выпадающие элементы */
  --mp-popover-bg: #ffffff;
  --mp-popover-shadow: 0 18px 50px rgba(49, 85, 104, 0.18);
  --mp-scrollbar: rgba(82, 107, 121, 0.28);
  --mp-danger: #c4314b;

  /* графика */
  --mp-logo: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 3368 496%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%22.4%22 stop-color=%22%23071116%22/%3E%3Cstop offset=%221%22 stop-color=%22%23344856%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill=%22%234cc2e5%22 fill-rule=%22evenodd%22 d=%22M66.5,373.5H0l34.7-239h63.5l76.3,141.2,76.5-141.2h60l34.7,239h-68.2l-13.9-165.4-73.1,165.4h-37.1l-73.1-165.4-13.9,165.4ZM346.1,436H.07v59.8h346.1v-59.8Z%22/%3E%3Cpath fill=%22url(%23g)%22 d=%22M398.5 478.9 443.8 354.4 444.6 390.9 342.3 139.3H403.7L472.5 317.4H458.6L526.9 139.3H586.1L453.3 478.9Z M560 374.4V325.2Q572.8 327.6 579.8 324.9Q586.8 322.2 590.4 314Q594 305.8 596.6 291.7Q600.1 273 602.8 247.9Q605.5 222.9 607.5 194.9Q609.4 167 610.9 139.3H788.6V374.4H729.4V194.6H662.7Q661.9 205.9 660.5 221.6Q659 237.3 657.4 254.1Q655.8 271 653.8 286.4Q651.9 301.7 649.7 312.6Q644.5 340.2 634.2 356.1Q624 372 606.2 376.5Q588.3 380.9 560 374.4Z M823 374.4V139.3H882.2V214.2H920Q929.8 214.2 942.9 214.6Q956 215.1 964.4 216.8Q985.1 221.4 999.3 231.4Q1013.4 241.4 1020.7 257.2Q1028 273 1028 294.7Q1028 326.1 1011.8 345.1Q995.6 364.2 964.9 371.4Q956.4 373.3 943.1 373.9Q929.8 374.4 920 374.4ZM882.2 328.7H926.6Q930.5 328.7 935.3 328.3Q940.1 327.8 944.9 326.5Q954 323.9 961 315Q967.9 306.1 967.9 294.7Q967.9 282.3 960.7 273.5Q953.6 264.7 944 262.1Q939.4 260.8 934.8 260.3Q930.3 259.9 926.6 259.9H882.2Z M1107.2 374.4V191.6H1030.2V139.3H1243.5V191.6H1166.4V374.4Z M1468.1 139.3V374.4H1411.6V230.7L1305.3 374.4H1258.3V139.3H1314.9V278.2L1421.6 139.3Z M1502.5 374.4V139.3H1712.4V374.4H1653.2V194.6H1561.7V374.4Z M1725.4 374.4V325.2Q1738.3 327.6 1745.2 324.9Q1752.2 322.2 1755.8 314Q1759.4 305.8 1762 291.7Q1765.5 273 1768.2 247.9Q1770.9 222.9 1772.9 194.9Q1774.9 167 1776.4 139.3H1954V374.4H1894.8V194.6H1828.2Q1827.3 205.9 1825.9 221.6Q1824.5 237.3 1822.8 254.1Q1821.2 271 1819.3 286.4Q1817.3 301.7 1815.1 312.6Q1809.9 340.2 1799.7 356.1Q1789.4 372 1771.6 376.5Q1753.7 380.9 1725.4 374.4Z M2198.2 139.3V374.4H2141.6V230.7L2035.4 374.4H1988.4V139.3H2045V278.2L2151.6 139.3Z M2232.6 374.4 2233.1 139.3H2293.1V252.5L2372.8 139.3H2445.9L2361 256.9L2451.6 374.4H2374.5L2293.1 261.2V374.4Z M2512.6 380.9Q2487.3 380.9 2469.8 371.2Q2452.3 361.6 2443.2 345.3Q2434.2 329.1 2434.2 309.5Q2434.2 293.2 2439.2 279.7Q2444.2 266.2 2455.4 255.9Q2466.6 245.5 2485.6 238.6Q2498.6 233.8 2516.7 230.1Q2534.8 226.4 2557.6 223Q2580.5 219.6 2607.9 215.5L2586.6 227.3Q2586.6 206.4 2576.5 196.6Q2566.5 186.8 2543 186.8Q2530 186.8 2515.8 193.1Q2501.7 199.4 2496 215.5L2442.5 198.5Q2451.4 169.4 2476 151.1Q2500.6 132.8 2543 132.8Q2574.2 132.8 2598.3 142.4Q2622.5 151.9 2634.9 175.4Q2641.9 188.5 2643.2 201.6Q2644.5 214.6 2644.5 230.7V374.4H2592.7V326.1L2600.1 336.1Q2582.9 359.8 2562.9 370.4Q2543 380.9 2512.6 380.9ZM2525.2 334.3Q2541.5 334.3 2552.7 328.6Q2563.9 322.8 2570.6 315.4Q2577.2 308 2579.6 303Q2584.2 293.4 2584.9 280.7Q2585.7 268 2585.7 259.5L2603.1 263.8Q2576.8 268.2 2560.4 271.1Q2544.1 274.1 2534.1 276.4Q2524.1 278.8 2516.5 281.7Q2507.8 285.2 2502.4 289.2Q2497.1 293.2 2494.6 298Q2492.1 302.8 2492.1 308.7Q2492.1 316.7 2496.1 322.5Q2500.1 328.3 2507.5 331.3Q2514.9 334.3 2525.2 334.3Z M2732.4 374.4V191.6H2655.3V139.3H2868.6V191.6H2791.6V374.4Z M2985.3 380.9Q2949.8 380.9 2923.1 365Q2896.3 349.1 2881.4 321.2Q2866.5 293.2 2866.5 256.9Q2866.5 220.1 2881.7 192.1Q2896.9 164.1 2923.7 148.5Q2950.5 132.8 2985.3 132.8Q3020.8 132.8 3047.7 148.7Q3074.6 164.6 3089.6 192.5Q3104.6 220.5 3104.6 256.9Q3104.6 293.4 3089.5 321.4Q3074.3 349.4 3047.5 365.1Q3020.6 380.9 2985.3 380.9ZM2985.3 325.6Q3013.8 325.6 3027.9 306.4Q3041.9 287.1 3041.9 256.9Q3041.9 225.5 3027.7 206.8Q3013.4 188.1 2985.3 188.1Q2965.9 188.1 2953.5 196.8Q2941.1 205.5 2935.1 220.9Q2929.2 236.4 2929.2 256.9Q2929.2 288.4 2943.4 307Q2957.7 325.6 2985.3 325.6Z M3241.7 380.9Q3206.7 380.9 3183.2 364.6Q3159.7 348.3 3147.8 320.2Q3135.9 292.1 3135.9 256.9Q3135.9 221.6 3147.7 193.5Q3159.5 165.4 3182.3 149.1Q3205.2 132.8 3238.7 132.8Q3272.4 132.8 3297.5 148.9Q3322.5 165 3336.3 193Q3350.1 220.9 3350.1 256.9Q3350.1 292.1 3336.5 320.2Q3322.9 348.3 3298.5 364.6Q3274.2 380.9 3241.7 380.9ZM3125.9 478.9V139.3H3178.2V300.4H3185.6V478.9ZM3232.2 328.3Q3251.3 328.3 3263.5 318.7Q3275.7 309.1 3281.6 292.9Q3287.4 276.7 3287.4 256.9Q3287.4 237.3 3281.4 221Q3275.3 204.8 3262.5 195.1Q3249.8 185.5 3230 185.5Q3211.5 185.5 3200.1 194.4Q3188.6 203.3 3183.4 219.4Q3178.2 235.5 3178.2 256.9Q3178.2 278.2 3183.4 294.3Q3188.6 310.4 3200.5 319.3Q3212.3 328.3 3232.2 328.3Z%22/%3E%3C/svg%3E");
  --mp-play: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 380 420%22%3E%3Cdefs%3E%3ClinearGradient id=%22c%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%232f80a3%22/%3E%3Cstop offset=%221%22 stop-color=%22%236c5fb4%22/%3E%3C/linearGradient%3E%3Cpattern id=%22p%22 width=%229%22 height=%229%22 patternUnits=%22userSpaceOnUse%22%3E%3Ccircle cx=%224.5%22 cy=%224.5%22 r=%222.1%22 fill=%22%23fff%22/%3E%3C/pattern%3E%3Cmask id=%22m%22%3E%3Cpath d=%22M24.0 72.0L24.0 412.0L318.0 242.0Z%22 fill=%22url(%23p)%22/%3E%3C/mask%3E%3C/defs%3E%3Cg fill=%22none%22 stroke=%22url(%23c)%22 stroke-width=%223.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-dasharray=%220 8%22%3E%3Cpath d=%22M73.6 38.4L73.6 378.4L367.6 208.4Z%22 opacity=%220.24%22/%3E%3Cpath d=%22M67.4 42.6L67.4 382.6L361.4 212.6Z%22 opacity=%220.30%22/%3E%3Cpath d=%22M61.2 46.8L61.2 386.8L355.2 216.8Z%22 opacity=%220.36%22/%3E%3Cpath d=%22M55.0 51.0L55.0 391.0L349.0 221.0Z%22 opacity=%220.42%22/%3E%3Cpath d=%22M48.8 55.2L48.8 395.2L342.8 225.2Z%22 opacity=%220.47%22/%3E%3Cpath d=%22M42.6 59.4L42.6 399.4L336.6 229.4Z%22 opacity=%220.53%22/%3E%3Cpath d=%22M36.4 63.6L36.4 403.6L330.4 233.6Z%22 opacity=%220.59%22/%3E%3Cpath d=%22M30.2 67.8L30.2 407.8L324.2 237.8Z%22 opacity=%220.64%22/%3E%3C/g%3E%3Crect width=%22380%22 height=%22420%22 fill=%22url(%23c)%22 mask=%22url(%23m)%22 opacity=%220.9%22/%3E%3Cpath d=%22M24.0 72.0L24.0 412.0L318.0 242.0Z%22 fill=%22none%22 stroke=%22url(%23c)%22 stroke-width=%223.4%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-dasharray=%220 7.6%22/%3E%3C/svg%3E");
}

/* ---------- 2. Переменные: тёмная тема ---------- */
html.ko-page-webinar[data-theme="dark"] {
  color-scheme: dark;

  --mp-bg: #070b11;
  --mp-bg-glow: rgba(34, 83, 106, 0.16);
  --mp-surface: #0c1720;
  --mp-surface-2: #101c27;
  --mp-stage: #070b11;
  --mp-stage-glow: #0d1a26;
  --mp-stage-shadow: 0 30px 70px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(0, 0, 0, 0.3);
  --mp-stage-dots: rgba(130, 170, 190, 0.22);

  --mp-text: #edf4f8;
  --mp-body: #b5c6d4;
  --mp-muted: #8ea5b4;
  --mp-line: rgba(132, 158, 176, 0.18);

  --mp-cyan: #67cfe9;
  --mp-violet: #9a8bea;
  --mp-admin: #b79cf6;
  --mp-accent-gradient: linear-gradient(105deg, #a0e5f1 0%, #76cfea 28%, #9b8ff1 55%, #72d2eb 78%, #a0e5f1 100%);
  --mp-accent-glow: rgba(76, 194, 229, 0.22);

  --mp-input-bg: #0a141c;
  --mp-input-border: rgba(132, 158, 176, 0.22);
  --mp-input-focus: rgba(103, 207, 233, 0.55);
  --mp-input-ring: rgba(103, 207, 233, 0.14);

  --mp-btn-gradient: linear-gradient(110deg, #9a8bea 0%, #8fa6ee 28%, #67cfe9 52%, #8fa6ee 77%, #9a8bea 100%);
  --mp-btn-text: #07151e;
  --mp-btn-border: rgba(211, 242, 255, 0.25);
  --mp-btn-shadow: 0 2px 3px rgba(0, 0, 0, 0.13), 0 12px 40px rgba(76, 194, 229, 0.094), inset 0 1px 0 rgba(255, 255, 255, 0.2);
  --mp-btn-glint: rgba(255, 255, 255, 0.47);

  --mp-toggle-bg: rgba(16, 25, 35, 0.72);
  --mp-toggle-border: rgba(143, 174, 193, 0.196);
  --mp-toggle-icon: #9db2c0;
  --mp-toggle-icon-active: #071116;
  --mp-toggle-shadow: none;
  --mp-thumb-bg: #f2f6f7;
  --mp-thumb-shadow: 0 3px 12px rgba(0, 0, 0, 0.267);

  --mp-popover-bg: #101c27;
  --mp-popover-shadow: 0 18px 50px rgba(0, 0, 0, 0.5);
  --mp-scrollbar: rgba(142, 165, 180, 0.25);
  --mp-danger: #ff7a8a;

  --mp-logo: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 3368 496%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%22.4%22 stop-color=%22%23ffffff%22/%3E%3Cstop offset=%221%22 stop-color=%22%23b0c4de%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill=%22%234cc2e5%22 fill-rule=%22evenodd%22 d=%22M66.5,373.5H0l34.7-239h63.5l76.3,141.2,76.5-141.2h60l34.7,239h-68.2l-13.9-165.4-73.1,165.4h-37.1l-73.1-165.4-13.9,165.4ZM346.1,436H.07v59.8h346.1v-59.8Z%22/%3E%3Cpath fill=%22url(%23g)%22 d=%22M398.5 478.9 443.8 354.4 444.6 390.9 342.3 139.3H403.7L472.5 317.4H458.6L526.9 139.3H586.1L453.3 478.9Z M560 374.4V325.2Q572.8 327.6 579.8 324.9Q586.8 322.2 590.4 314Q594 305.8 596.6 291.7Q600.1 273 602.8 247.9Q605.5 222.9 607.5 194.9Q609.4 167 610.9 139.3H788.6V374.4H729.4V194.6H662.7Q661.9 205.9 660.5 221.6Q659 237.3 657.4 254.1Q655.8 271 653.8 286.4Q651.9 301.7 649.7 312.6Q644.5 340.2 634.2 356.1Q624 372 606.2 376.5Q588.3 380.9 560 374.4Z M823 374.4V139.3H882.2V214.2H920Q929.8 214.2 942.9 214.6Q956 215.1 964.4 216.8Q985.1 221.4 999.3 231.4Q1013.4 241.4 1020.7 257.2Q1028 273 1028 294.7Q1028 326.1 1011.8 345.1Q995.6 364.2 964.9 371.4Q956.4 373.3 943.1 373.9Q929.8 374.4 920 374.4ZM882.2 328.7H926.6Q930.5 328.7 935.3 328.3Q940.1 327.8 944.9 326.5Q954 323.9 961 315Q967.9 306.1 967.9 294.7Q967.9 282.3 960.7 273.5Q953.6 264.7 944 262.1Q939.4 260.8 934.8 260.3Q930.3 259.9 926.6 259.9H882.2Z M1107.2 374.4V191.6H1030.2V139.3H1243.5V191.6H1166.4V374.4Z M1468.1 139.3V374.4H1411.6V230.7L1305.3 374.4H1258.3V139.3H1314.9V278.2L1421.6 139.3Z M1502.5 374.4V139.3H1712.4V374.4H1653.2V194.6H1561.7V374.4Z M1725.4 374.4V325.2Q1738.3 327.6 1745.2 324.9Q1752.2 322.2 1755.8 314Q1759.4 305.8 1762 291.7Q1765.5 273 1768.2 247.9Q1770.9 222.9 1772.9 194.9Q1774.9 167 1776.4 139.3H1954V374.4H1894.8V194.6H1828.2Q1827.3 205.9 1825.9 221.6Q1824.5 237.3 1822.8 254.1Q1821.2 271 1819.3 286.4Q1817.3 301.7 1815.1 312.6Q1809.9 340.2 1799.7 356.1Q1789.4 372 1771.6 376.5Q1753.7 380.9 1725.4 374.4Z M2198.2 139.3V374.4H2141.6V230.7L2035.4 374.4H1988.4V139.3H2045V278.2L2151.6 139.3Z M2232.6 374.4 2233.1 139.3H2293.1V252.5L2372.8 139.3H2445.9L2361 256.9L2451.6 374.4H2374.5L2293.1 261.2V374.4Z M2512.6 380.9Q2487.3 380.9 2469.8 371.2Q2452.3 361.6 2443.2 345.3Q2434.2 329.1 2434.2 309.5Q2434.2 293.2 2439.2 279.7Q2444.2 266.2 2455.4 255.9Q2466.6 245.5 2485.6 238.6Q2498.6 233.8 2516.7 230.1Q2534.8 226.4 2557.6 223Q2580.5 219.6 2607.9 215.5L2586.6 227.3Q2586.6 206.4 2576.5 196.6Q2566.5 186.8 2543 186.8Q2530 186.8 2515.8 193.1Q2501.7 199.4 2496 215.5L2442.5 198.5Q2451.4 169.4 2476 151.1Q2500.6 132.8 2543 132.8Q2574.2 132.8 2598.3 142.4Q2622.5 151.9 2634.9 175.4Q2641.9 188.5 2643.2 201.6Q2644.5 214.6 2644.5 230.7V374.4H2592.7V326.1L2600.1 336.1Q2582.9 359.8 2562.9 370.4Q2543 380.9 2512.6 380.9ZM2525.2 334.3Q2541.5 334.3 2552.7 328.6Q2563.9 322.8 2570.6 315.4Q2577.2 308 2579.6 303Q2584.2 293.4 2584.9 280.7Q2585.7 268 2585.7 259.5L2603.1 263.8Q2576.8 268.2 2560.4 271.1Q2544.1 274.1 2534.1 276.4Q2524.1 278.8 2516.5 281.7Q2507.8 285.2 2502.4 289.2Q2497.1 293.2 2494.6 298Q2492.1 302.8 2492.1 308.7Q2492.1 316.7 2496.1 322.5Q2500.1 328.3 2507.5 331.3Q2514.9 334.3 2525.2 334.3Z M2732.4 374.4V191.6H2655.3V139.3H2868.6V191.6H2791.6V374.4Z M2985.3 380.9Q2949.8 380.9 2923.1 365Q2896.3 349.1 2881.4 321.2Q2866.5 293.2 2866.5 256.9Q2866.5 220.1 2881.7 192.1Q2896.9 164.1 2923.7 148.5Q2950.5 132.8 2985.3 132.8Q3020.8 132.8 3047.7 148.7Q3074.6 164.6 3089.6 192.5Q3104.6 220.5 3104.6 256.9Q3104.6 293.4 3089.5 321.4Q3074.3 349.4 3047.5 365.1Q3020.6 380.9 2985.3 380.9ZM2985.3 325.6Q3013.8 325.6 3027.9 306.4Q3041.9 287.1 3041.9 256.9Q3041.9 225.5 3027.7 206.8Q3013.4 188.1 2985.3 188.1Q2965.9 188.1 2953.5 196.8Q2941.1 205.5 2935.1 220.9Q2929.2 236.4 2929.2 256.9Q2929.2 288.4 2943.4 307Q2957.7 325.6 2985.3 325.6Z M3241.7 380.9Q3206.7 380.9 3183.2 364.6Q3159.7 348.3 3147.8 320.2Q3135.9 292.1 3135.9 256.9Q3135.9 221.6 3147.7 193.5Q3159.5 165.4 3182.3 149.1Q3205.2 132.8 3238.7 132.8Q3272.4 132.8 3297.5 148.9Q3322.5 165 3336.3 193Q3350.1 220.9 3350.1 256.9Q3350.1 292.1 3336.5 320.2Q3322.9 348.3 3298.5 364.6Q3274.2 380.9 3241.7 380.9ZM3125.9 478.9V139.3H3178.2V300.4H3185.6V478.9ZM3232.2 328.3Q3251.3 328.3 3263.5 318.7Q3275.7 309.1 3281.6 292.9Q3287.4 276.7 3287.4 256.9Q3287.4 237.3 3281.4 221Q3275.3 204.8 3262.5 195.1Q3249.8 185.5 3230 185.5Q3211.5 185.5 3200.1 194.4Q3188.6 203.3 3183.4 219.4Q3178.2 235.5 3178.2 256.9Q3178.2 278.2 3183.4 294.3Q3188.6 310.4 3200.5 319.3Q3212.3 328.3 3232.2 328.3Z%22/%3E%3C/svg%3E");
  --mp-play: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 380 420%22%3E%3Cdefs%3E%3ClinearGradient id=%22c%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%236fd3ec%22/%3E%3Cstop offset=%221%22 stop-color=%22%239a8bea%22/%3E%3C/linearGradient%3E%3Cpattern id=%22p%22 width=%229%22 height=%229%22 patternUnits=%22userSpaceOnUse%22%3E%3Ccircle cx=%224.5%22 cy=%224.5%22 r=%222.1%22 fill=%22%23fff%22/%3E%3C/pattern%3E%3Cmask id=%22m%22%3E%3Cpath d=%22M24.0 72.0L24.0 412.0L318.0 242.0Z%22 fill=%22url(%23p)%22/%3E%3C/mask%3E%3C/defs%3E%3Cg fill=%22none%22 stroke=%22url(%23c)%22 stroke-width=%223.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-dasharray=%220 8%22%3E%3Cpath d=%22M73.6 38.4L73.6 378.4L367.6 208.4Z%22 opacity=%220.26%22/%3E%3Cpath d=%22M67.4 42.6L67.4 382.6L361.4 212.6Z%22 opacity=%220.32%22/%3E%3Cpath d=%22M61.2 46.8L61.2 386.8L355.2 216.8Z%22 opacity=%220.38%22/%3E%3Cpath d=%22M55.0 51.0L55.0 391.0L349.0 221.0Z%22 opacity=%220.45%22/%3E%3Cpath d=%22M48.8 55.2L48.8 395.2L342.8 225.2Z%22 opacity=%220.51%22/%3E%3Cpath d=%22M42.6 59.4L42.6 399.4L336.6 229.4Z%22 opacity=%220.57%22/%3E%3Cpath d=%22M36.4 63.6L36.4 403.6L330.4 233.6Z%22 opacity=%220.63%22/%3E%3Cpath d=%22M30.2 67.8L30.2 407.8L324.2 237.8Z%22 opacity=%220.69%22/%3E%3C/g%3E%3Crect width=%22380%22 height=%22420%22 fill=%22url(%23c)%22 mask=%22url(%23m)%22 opacity=%220.95%22/%3E%3Cpath d=%22M24.0 72.0L24.0 412.0L318.0 242.0Z%22 fill=%22none%22 stroke=%22url(%23c)%22 stroke-width=%223.4%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-dasharray=%220 7.6%22/%3E%3C/svg%3E");
}

/* ---------- 3. Общие размеры (не зависят от темы) ---------- */
html.ko-page-webinar {
  --mp-font: Manrope, Arial, sans-serif;
  --mp-chat-w: 440px;
  --mp-gutter: 46px;
  --mp-radius-card: 16px;
  --mp-radius-ctrl: 10px;
  --mp-title-split: 3.65em; /* ширина «Дизайн » в заголовке: до неё текст сплошной, дальше градиент; 0 — градиент на весь заголовок, 100% — без градиента */
}

/* ==========================================================================
   Правила
   ========================================================================== */

/* фон — на <html>, чтобы он закрывал всё окно даже на коротких страницах */
html.ko-page-webinar {
  min-height: 100dvh;
  background:
    radial-gradient(ellipse 70% 60% at 38% 45%, var(--mp-bg-glow), transparent 70%) fixed,
    var(--mp-bg) !important;
}

html.ko-page-webinar body {
  background: transparent !important;
  color: var(--mp-text);
  font-family: var(--mp-font);
  -webkit-font-smoothing: antialiased;
}

html.ko-page-webinar body .gc-main-content.account-page-content.gc-both-main-content {
  margin-top: 0 !important;
}

html.ko-page-webinar .webinar-overlay {
  background: var(--mp-bg);
}

/* ---------- Левая колонка ---------- */
html.ko-page-webinar #webinar-content-block .webinar-started-block {
  flex-direction: column;
  float: none;
  width: calc(100% - var(--mp-chat-w)) !important;
  padding: 36px var(--mp-gutter) 40px !important;
  font-family: var(--mp-font);
  color: var(--mp-text);
}

/* платформа растягивает блоки на всю высоту (.lite-page > * { flex: 1 1 100% }) */
html.ko-page-webinar #webinar-content-block .webinar-started-block > * {
  flex: 0 0 auto !important;
}

html.ko-page-webinar #webinar-content-block .webinar-started-block .lt-block-wrapper {
  padding: 0 !important;
  background: transparent;
}

html.ko-page-webinar #webinar-content-block .webinar-started-block .lt-block-wrapper > .container {
  width: 100% !important;
  padding: 0;
}

html.ko-page-webinar #webinar-content-block .webinar-started-block .lt-block-wrapper > .container > .row {
  margin: 0;
}

html.ko-page-webinar #webinar-content-block .webinar-started-block .modal-block-content {
  padding: 0;
}

/* ---------- Шапка: логотип | заголовок ---------- */
html.ko-page-webinar #webinar-content-block .o-lt-onecolumn .modal-block-content {
  display: flex !important;
  align-items: center;
  gap: 28px;
  min-height: 48px;
}

html.ko-page-webinar #webinar-content-block .o-lt-onecolumn .modal-block-content::before {
  content: "";
  flex: 0 0 auto;
  width: 222px;
  height: 48px;
  padding-right: 28px;
  border-right: 1px solid var(--mp-line);
  background: var(--mp-logo) left center / 222px auto no-repeat;
  box-sizing: content-box;
}

html.ko-page-webinar #webinar-content-block .o-lt-onecolumn .builder,
html.ko-page-webinar #webinar-content-block .o-lt-onecolumn .builder-item {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0 !important;
}

html.ko-page-webinar #webinar-content-block .o-lt-onecolumn .f-header {
  display: inline-block;
  margin: 0;
  font-family: var(--mp-font) !important;
  font-size: 36px !important;
  font-weight: 750 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.035em;
  color: var(--mp-text);
  background-image:
    linear-gradient(var(--mp-text), var(--mp-text)),
    var(--mp-accent-gradient);
  background-size: var(--mp-title-split) 0, 220% 100%;
  background-position: 0 0, 0 50%;
  background-repeat: no-repeat, no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ---------- Сцена плеера ---------- */
html.ko-page-webinar #webinar-content-block .o-lt-video-broadcast .lt-block-wrapper {
  padding-top: 40px !important;
}

html.ko-page-webinar #webinar-content-block .o-lt-video-broadcast .video-block-main {
  width: 100% !important;
}

html.ko-page-webinar #webinar-content-block #player.videoWrapper {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--mp-line);
  border-radius: var(--mp-radius-card);
  background:
    var(--mp-play) 50% 66% / auto 52% no-repeat,
    radial-gradient(ellipse 48% 58% at 50% 55%, var(--mp-stage-glow), transparent 72%),
    var(--mp-stage);
  box-shadow: var(--mp-stage-shadow);
  isolation: isolate;
}

/* поле точек, уходящее в перспективу */
html.ko-page-webinar #webinar-content-block #player.videoWrapper::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -20%;
  right: -20%;
  bottom: -6%;
  height: 52%;
  background-image: radial-gradient(circle, var(--mp-stage-dots) 1.3px, transparent 1.9px);
  background-size: 34px 26px;
  transform: perspective(520px) rotateX(58deg);
  transform-origin: 50% 100%;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 70%);
  mask-image: linear-gradient(to bottom, transparent, #000 70%);
  pointer-events: none;
}

html.ko-page-webinar #webinar-content-block #player.videoWrapper .player-poster[data-poster] .play-wrapper[data-poster] {
    display: none;
}

html.ko-page-webinar #webinar-content-block #player [data-player] {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  background: transparent;
  font-family: var(--mp-font);
}

html.ko-page-webinar #webinar-content-block #player .player-poster {
  background-color: transparent !important;
}

html.ko-page-webinar #webinar-content-block #player .player-title {
  left: 0;
  right: 0;
  top: 16%;
  margin: 0;
  font-family: var(--mp-font);
  text-align: center;
  pointer-events: none;
}

html.ko-page-webinar #webinar-content-block #player .player-title > div {
  left: 0 !important;
  display: grid;
  gap: 6px;
}

html.ko-page-webinar #webinar-content-block #player .status-await,
html.ko-page-webinar #webinar-content-block #player .status-ended {
  color: var(--mp-text);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

html.ko-page-webinar #webinar-content-block #player .webinar-name {
  color: var(--mp-muted);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

/* ---------- Чат ---------- */
html.ko-page-webinar #webinar-content-block .chat-widget {
  width: var(--mp-chat-w);
  border: 0;
  border-left: 1px solid var(--mp-line);
  background: var(--mp-surface);
  color: var(--mp-text);
  font-family: var(--mp-font);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comments-tree {
  margin: 0;
  font-family: var(--mp-font);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comments-main-container {
  padding: 20px 16px 0;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--mp-scrollbar) transparent;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comments-main-container::-webkit-scrollbar {
  width: 6px;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comments-main-container::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background: var(--mp-scrollbar);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comments-container .comments-top-level {
  margin-bottom: 170px;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comments-tree .comment-wrapper {
  margin: 0 0 10px;
  padding: 0;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comment {
  font-size: 16px;
  line-height: 1.5;
  color: var(--mp-body);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .gc-comment .title {
  display: inline-flex;
  align-items: center;
  margin-right: 6px;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 700;
  color: var(--mp-text);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .gc-comment .title span {
  color: var(--mp-text) !important;
}

/* имя с цветом, заданным платформой (администратор / модератор) */
html.ko-page-webinar #webinar-content-block .o-lt-chat .gc-comment .title span[style*="color"] {
  color: var(--mp-admin) !important;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comment .text,
html.ko-page-webinar #webinar-content-block .o-lt-chat .comment .text-content {
  color: var(--mp-body);
  font-weight: 400;
}

/* имя и текст в одну строку — и на ПК, и на телефоне */
html.ko-page-webinar #webinar-content-block .o-lt-chat .comment .text,
html.ko-page-webinar #webinar-content-block .o-lt-chat .comment .text .main,
html.ko-page-webinar #webinar-content-block .o-lt-chat .comment .text .main .text-content {
  display: inline;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comment a {
  color: var(--mp-cyan);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .pinned-comments:not(:empty) {
  padding: 14px 28px;
  border-bottom: 1px solid var(--mp-line);
  background: var(--mp-surface-2);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comments-tree .more-comments-button {
  border: 1px solid var(--mp-line);
  border-radius: 999px;
  background: var(--mp-popover-bg);
  color: var(--mp-text);
  font-size: 13px;
  font-weight: 700;
  box-shadow: var(--mp-popover-shadow);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .comments-tree .more-comments-button:hover {
  background: var(--mp-surface-2);
}

/* ---------- Форма чата ---------- */
html.ko-page-webinar #webinar-content-block .o-lt-chat .gc-comment-form {
  left: 0;
  right: 0;
  width: auto;
  padding: 26px 28px 28px;
  border-top: 1px solid var(--mp-line);
  background: var(--mp-surface-2);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .new-comment {
  display: grid;
  grid-template-columns: auto 1fr auto;
  column-gap: 14px;
  align-items: center;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .new-comment > form,
html.ko-page-webinar #webinar-content-block .o-lt-chat .new-comment .textarea-block {
  display: contents !important;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .off-new-comment {
  grid-column: 1 / -1;
  grid-row: 1;
  margin-bottom: 12px;
  color: var(--mp-muted);
  font-size: 13px;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .chat-isolation-warning {
  grid-column: 1 / -1;
  grid-row: 2;
  margin-bottom: 10px;
  color: var(--mp-muted);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .message-on-moderation-text {
  grid-column: 1 / -1;
  grid-row: 3;
  margin: 0 0 10px;
  color: var(--mp-muted);
  font-size: 13px;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .new-comment-input {
  grid-column: 1 / -1;
  grid-row: 4;
  width: 100% !important;
  height: 54px;
  margin: 0 0 16px !important;
  padding: 0 52px 0 20px !important;
  border: 1px solid var(--mp-input-border);
  border-radius: var(--mp-radius-ctrl);
  background: var(--mp-input-bg);
  color: var(--mp-text);
  font-family: var(--mp-font);
  font-size: 16px;
  font-weight: 500;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .new-comment-input::placeholder {
  color: var(--mp-muted);
  opacity: 1;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .new-comment-input:focus {
  border-color: var(--mp-input-focus);
  box-shadow: 0 0 0 4px var(--mp-input-ring);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .new-comment-input[disabled] {
  background: var(--mp-surface-2);
  color: var(--mp-muted);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .new-comment-input[disabled]::placeholder {
  color: var(--mp-muted);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .emoji-btn {
  grid-column: 3;
  grid-row: 4;
  justify-self: end;
  align-self: center;
  position: relative !important;
  top: -8px;
  right: auto;
  bottom: auto;
  float: none;
  margin-right: 16px;
  color: var(--mp-muted);
  font-size: 18px;
  line-height: 1;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .emoji-btn:hover {
  color: var(--mp-cyan);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .emoji-list {
  right: 0;
  top: auto;
  bottom: calc(100% + 10px);
  border: 1px solid var(--mp-line);
  border-radius: 12px;
  background: var(--mp-popover-bg);
  box-shadow: var(--mp-popover-shadow);
  scrollbar-width: thin;
  scrollbar-color: var(--mp-scrollbar) transparent;
}

/* кнопка «Отправить» */
html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send {
  grid-column: 1;
  grid-row: 5;
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  height: 54px;
  min-width: 178px;
  margin: 0;
  padding: 0 24px;
  overflow: hidden;
  border: 1px solid var(--mp-btn-border);
  border-radius: var(--mp-radius-ctrl);
  background: var(--mp-btn-gradient) 0 50% / 220% 100%;
  color: var(--mp-btn-text);
  box-shadow: var(--mp-btn-shadow);
  font-family: var(--mp-font);
  font-size: 15px;
  font-weight: 750;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: transform 150ms ease-out, filter 150ms ease-out;
  animation: mp-button-shift 6.4s ease-in-out infinite;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -40%;
  bottom: -40%;
  left: -35%;
  width: 24%;
  background: linear-gradient(90deg, transparent, var(--mp-btn-glint), transparent);
  transform: skewX(-18deg) translateX(-260%);
  animation: mp-button-glint 5.4s ease-in-out infinite;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send:hover,
html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send:focus {
  color: var(--mp-btn-text);
  filter: brightness(1.08);
  text-decoration: none;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send:active {
  transform: scale(0.96);
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send .fa {
  font-size: 17px;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send .text {
	padding: 0;
}

/* «N онлайн» */
html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-count-users {
  grid-column: 2;
  grid-row: 5;
  position: static !important;
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  float: none;
  margin: 0;
  padding: 0;
  color: var(--mp-text);
  font-family: var(--mp-font);
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-count-users::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--mp-cyan);
  box-shadow: 0 0 0 3px var(--mp-input-ring);
}

/* ---------- Переключатель темы (внедряется скриптом) ---------- */
html.ko-page-webinar .theme-toggle {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  flex: 0 0 auto;
  width: 82px;
  height: 42px;
  margin: 0;
  padding: 3px;
  border: 1px solid var(--mp-toggle-border);
  border-radius: 999px;
  background: var(--mp-toggle-bg);
  color: var(--mp-toggle-icon);
  box-shadow: var(--mp-toggle-shadow);
  cursor: pointer;
  font: inherit;
}

html.ko-page-webinar #webinar-content-block .o-lt-chat .theme-toggle {
  grid-column: 3;
  grid-row: 5;
  margin-left: 4px;
}

/* разделитель между «онлайн» и переключателем */
html.ko-page-webinar #webinar-content-block .o-lt-chat .theme-toggle::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 8px;
  bottom: 8px;
  width: 1px;
  background: var(--mp-line);
}

html.ko-page-webinar .theme-toggle:focus {
  outline: none;
}

html.ko-page-webinar .theme-toggle:focus-visible {
  outline: 2px solid var(--mp-cyan);
  outline-offset: 3px;
}

html.ko-page-webinar .theme-toggle .theme-option {
  z-index: 2;
  display: grid;
  place-items: center;
  height: 34px;
  transition: color 180ms ease-out;
}

html.ko-page-webinar .theme-toggle .theme-option svg {
  display: block;
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

html.ko-page-webinar .theme-toggle .theme-thumb {
  position: absolute;
  z-index: 1;
  top: 3px;
  left: 3px;
  width: 36px;
  height: 34px;
  border-radius: 999px;
  background: var(--mp-thumb-bg);
  box-shadow: var(--mp-thumb-shadow);
  transform: translateX(0);
  transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), background 180ms ease-out;
}

/* aria-pressed="true" — включена тёмная тема */
html.ko-page-webinar .theme-toggle[aria-pressed="true"] .theme-thumb {
  transform: translateX(38px);
}

html.ko-page-webinar .theme-toggle[aria-pressed="true"] .theme-moon,
html.ko-page-webinar .theme-toggle:not([aria-pressed="true"]) .theme-sun {
  color: var(--mp-toggle-icon-active);
}

/* ---------- Смена темы без мигания ----------
   Скрипт на мгновение ставит html.mp-theme-switching: все цвета меняются
   в одном кадре. Ползунок переключателя при этом продолжает ехать. */
html.ko-page-webinar.mp-theme-switching *:not(.theme-thumb),
html.ko-page-webinar.mp-theme-switching *::before,
html.ko-page-webinar.mp-theme-switching *::after {
  transition: none !important;
}

/* ==========================================================================
   Вход зрителя: «Пожалуйста, представьтесь»
   (та же страница /pl/webinar/show, пока зритель не ввёл имя)
   ========================================================================== */
html.ko-page-webinar .standard-page-content:has(> .webinar-login) {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 100vh;
  padding: 56px 16px 80px !important;
  font-family: var(--mp-font);
}

/* логотип над названием эфира */
html.ko-page-webinar .standard-page-content:has(> .webinar-login)::before {
  content: "";
  display: block;
  width: 190px;
  height: 30px;
  margin-bottom: 36px;
  background: var(--mp-logo) center / contain no-repeat;
}

/* название эфира — у платформы оно задано inline-стилями, поэтому !important */
html.ko-page-webinar .standard-page-content:has(> .webinar-login) > div:not(.webinar-login) {
  max-width: 720px;
  margin: 0 0 28px !important;
  min-height: 0 !important;
}

html.ko-page-webinar .standard-page-content:has(> .webinar-login) > div:not(.webinar-login) > span {
  display: inline-block;
  font-family: var(--mp-font) !important;
  font-size: clamp(30px, 4.4vw, 48px) !important;
  font-weight: 750 !important;
  line-height: 1.08;
  letter-spacing: -0.04em;
  text-wrap: balance;
  color: var(--mp-text) !important;
  background: linear-gradient(180deg, var(--mp-text) 45%, var(--mp-muted) 120%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* карточка формы */
html.ko-page-webinar .webinar-login {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 440px !important;
  margin: 0 !important;
  padding: 32px 32px 30px !important;
  border: 1px solid var(--mp-line);
  border-radius: var(--mp-radius-card);
  background: var(--mp-surface) !important;
  color: var(--mp-text);
  box-shadow: var(--mp-stage-shadow);
  font-family: var(--mp-font);
}

html.ko-page-webinar .webinar-login h3 {
  margin: 0 96px 22px 0;
  color: var(--mp-text);
  font-family: var(--mp-font);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

html.ko-page-webinar .webinar-login .form-group {
  margin-bottom: 14px;
}

html.ko-page-webinar .webinar-login .form-control {
  height: 52px;
  padding: 0 18px;
  border: 1px solid var(--mp-input-border);
  border-radius: var(--mp-radius-ctrl);
  background: var(--mp-input-bg);
  color: var(--mp-text);
  box-shadow: none;
  font-family: var(--mp-font);
  font-size: 16px;
  font-weight: 500;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

html.ko-page-webinar .webinar-login .form-control::placeholder {
  color: var(--mp-muted);
  opacity: 1;
}

html.ko-page-webinar .webinar-login .form-control:focus {
  border-color: var(--mp-input-focus);
  box-shadow: 0 0 0 4px var(--mp-input-ring);
  outline: none;
}

/* ошибка валидации (bootstrap: .has-error) */
html.ko-page-webinar .webinar-login .has-error .form-control {
  border-color: var(--mp-danger);
}

html.ko-page-webinar .webinar-login .help-block,
html.ko-page-webinar .webinar-login .has-error .help-block {
  margin: 6px 2px 0;
  color: var(--mp-danger);
  font-size: 13px;
}

html.ko-page-webinar .webinar-login .help-block:empty {
  display: none;
}

/* кнопка «Войти» — основная кнопка бренда, как «Отправить» в чате */
html.ko-page-webinar .webinar-login .btn.submit-form {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 52px;
  margin: 18px 0 0;
  padding: 0 24px;
  overflow: hidden;
  border: 1px solid var(--mp-btn-border);
  border-radius: var(--mp-radius-ctrl);
  background: var(--mp-btn-gradient) 0 50% / 220% 100%;
  color: var(--mp-btn-text);
  box-shadow: var(--mp-btn-shadow);
  font-family: var(--mp-font);
  font-size: 15px;
  font-weight: 750;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: transform 150ms ease-out, filter 150ms ease-out;
  animation: mp-button-shift 6.4s ease-in-out infinite;
}

html.ko-page-webinar .webinar-login .btn.submit-form::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -40%;
  bottom: -40%;
  left: -35%;
  width: 24%;
  background: linear-gradient(90deg, transparent, var(--mp-btn-glint), transparent);
  transform: skewX(-18deg) translateX(-260%);
  animation: mp-button-glint 5.4s ease-in-out infinite;
}

html.ko-page-webinar .webinar-login .btn.submit-form:hover,
html.ko-page-webinar .webinar-login .btn.submit-form:focus,
html.ko-page-webinar .webinar-login .btn.submit-form:active:focus {
  border-color: var(--mp-btn-border);
  background: var(--mp-btn-gradient) 0 50% / 220% 100%;
  color: var(--mp-btn-text);
  filter: brightness(1.08);
  outline: none;
}

html.ko-page-webinar .webinar-login .btn.submit-form:focus-visible {
  outline: 2px solid var(--mp-cyan);
  outline-offset: 3px;
}

html.ko-page-webinar .webinar-login .btn.submit-form:active {
  transform: scale(0.97);
}

/* переключатель темы в углу карточки (вставляет скрипт) */
html.ko-page-webinar .webinar-login .theme-toggle {
  position: absolute;
  top: 26px;
  right: 26px;
}

@media (prefers-reduced-motion: reduce) {
  html.ko-page-webinar .webinar-login .btn.submit-form,
  html.ko-page-webinar .webinar-login .btn.submit-form::after {
    animation: none !important;
  }
}

@media (max-width: 520px) {
  html.ko-page-webinar .standard-page-content:has(> .webinar-login) {
    padding: 32px 14px 48px !important;
  }

  html.ko-page-webinar .standard-page-content:has(> .webinar-login)::before {
    width: 150px;
    height: 24px;
    margin-bottom: 24px;
  }

  html.ko-page-webinar .standard-page-content:has(> .webinar-login) > div:not(.webinar-login) {
    margin-bottom: 20px !important;
  }

  html.ko-page-webinar .webinar-login {
    padding: 24px 20px 22px !important;
  }

  html.ko-page-webinar .webinar-login h3 {
    margin-right: 84px;
    font-size: 19px;
  }

  html.ko-page-webinar .webinar-login .theme-toggle {
    top: 18px;
    right: 18px;
    width: 70px;
    height: 38px;
  }

  html.ko-page-webinar .webinar-login .theme-toggle .theme-option {
    height: 30px;
  }

  html.ko-page-webinar .webinar-login .theme-toggle .theme-thumb {
    width: 30px;
    height: 30px;
  }

  html.ko-page-webinar .webinar-login .theme-toggle[aria-pressed="true"] .theme-thumb {
    transform: translateX(32px);
  }
}

/* ---------- Анимации ---------- */
@keyframes mp-button-shift {
  0%, 100% { background-position: 0 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes mp-button-glint {
  0%, 58% { transform: skewX(-18deg) translateX(-260%); opacity: 0; }
  64% { opacity: 0.75; }
  80%, 100% { transform: skewX(-18deg) translateX(720%); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send,
  html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send::after {
    animation: none !important;
  }
  html.ko-page-webinar .theme-toggle .theme-thumb {
    transition: none;
  }
}

/* ---------- Узкие экраны (десктоп) ---------- */
@media (max-width: 1180px) {
  html.ko-page-webinar {
    --mp-chat-w: 380px;
    --mp-gutter: 28px;
  }
  html.ko-page-webinar #webinar-content-block .o-lt-onecolumn .modal-block-content::before {
    width: 170px;
    background-size: 170px auto;
    padding-right: 20px;
  }
  html.ko-page-webinar #webinar-content-block .o-lt-onecolumn .modal-block-content {
    gap: 20px;
  }
  html.ko-page-webinar #webinar-content-block .o-lt-onecolumn .f-header {
    font-size: 28px !important;
  }
  html.ko-page-webinar #webinar-content-block #player .status-await,
  html.ko-page-webinar #webinar-content-block #player .status-ended {
    font-size: 21px;
  }
  html.ko-page-webinar #webinar-content-block #player .webinar-name {
    font-size: 19px;
  }
  html.ko-page-webinar #webinar-content-block .o-lt-chat .webinar-btn-send {
    min-width: 0;
    padding: 0 18px;
  }
}


/* ==========================================================================
   Мобильная версия платформы
   На телефоне GetCourse перестраивает страницу: добавляет классы .mobile
   на body и #webinar-content-block, прячет шапку, ставит чат под плеер
   (без обёртки .chat-widget) и прибивает форму к низу экрана.
   ========================================================================== */
html.ko-page-webinar {
  --mp-m-gutter: 16px;
  --mp-m-form-h: 132px; /* высота закреплённой формы — под неё оставляем место в ленте */
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .webinar-started-block {
  width: 100% !important;
  padding: 0 !important;
}

/* шапка: платформа её скрывает — возвращаем компактной строкой */
html.ko-page-webinar body.mobile #webinar-content-block.mobile .webinar-started-block > .o-lt-onecolumn.o-lt-onecolumn-common {
  display: block !important;
  padding: 14px var(--mp-m-gutter) 0;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-onecolumn .modal-block-content {
  gap: 14px;
  min-height: 34px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-onecolumn .modal-block-content::before {
  width: 132px;
  height: 30px;
  padding-right: 14px;
  background-size: 132px auto;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-onecolumn .f-header {
  font-size: 19px !important;
  letter-spacing: -0.03em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* сцена плеера */
html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-video-broadcast .lt-block-wrapper {
  padding: 14px var(--mp-m-gutter) 0 !important;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-video-broadcast .modal-block-content.block-box {
  padding: 0;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile #player.videoWrapper {
  border-radius: 14px;
  box-shadow: var(--mp-stage-shadow);
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile #player .player-title {
  top: 9%;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile #player .player-title > div {
  gap: 2px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile #player .status-await,
html.ko-page-webinar body.mobile #webinar-content-block.mobile #player .status-ended {
  font-size: 16px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile #player .webinar-name {
  font-size: 14px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .webinar-ads-block {
  padding-top: 0;
}

/* чат — «лист» под плеером */
html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat {
  margin-top: 16px;
  border-top: 1px solid var(--mp-line);
  border-radius: 20px 20px 0 0;
  background: var(--mp-surface);
  box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.04);
  overflow: hidden;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .lt-block-wrapper {
  padding: 0 !important;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .lt-block-wrapper > .container,
html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .modal-block-content {
  padding: 0;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .comments-tree {
  margin: 0;
  font-family: var(--mp-font);
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .comments-main-container {
  padding: 18px var(--mp-m-gutter) 0;
  border-top: 0;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .comments-container .comments-top-level {
  margin-bottom: var(--mp-m-form-h);
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .comments-tree .comment-wrapper {
  margin-bottom: 14px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .comment,
html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .gc-comment .title {
  font-size: 15px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .comments-tree .more-comments-button-wrapper {
  margin-bottom: calc(var(--mp-m-form-h) + 8px);
}

/* закреплённая форма */
html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .gc-comment-form {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  width: 100%;
  height: auto !important;
  padding: 12px var(--mp-m-gutter) calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  border-top: 1px solid var(--mp-line);
  background: var(--mp-surface-2);
  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.06);
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .new-comment {
  height: auto !important;
  column-gap: 10px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .new-comment-input {
  height: 48px;
  margin-bottom: 10px !important;
  padding: 0 16px !important;
  font-size: 16px; /* 16px — чтобы iOS не увеличивал страницу при фокусе */
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .emoji-btn {
  display: none !important;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .webinar-btn-send {
  height: 46px;
  min-width: 0;
  margin: 0 !important;
  padding: 0 18px;
  font-size: 14px;
  gap: 10px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .o-lt-chat .webinar-count-users {
  padding: 0 !important;
  font-size: 14px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .theme-toggle {
  width: 70px;
  height: 38px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .theme-toggle .theme-option {
  height: 30px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .theme-toggle .theme-option svg {
  width: 17px;
  height: 17px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .theme-toggle .theme-thumb {
  width: 30px;
  height: 30px;
}

html.ko-page-webinar body.mobile #webinar-content-block.mobile .theme-toggle[aria-pressed="true"] .theme-thumb {
  transform: translateX(32px);
}
/* ------------- 
content finish - Вебинарка
------------- */

/* ------------- 
content start - Оплата
------------- */

/* ==========================================================================
   Мультипликатор — страница оплаты (GetCourse, /sales/shop/dealPay)
   Все правила работают только внутри html.ko-page-payment — класс ставит
   скрипт payment-theme.js. Темы: [data-theme="light"] и [data-theme="dark"],
   отличаются только значениями переменных. Окна платёжных систем в iframe
   не трогаем.
   ========================================================================== */

/* ---------- 1. Переменные: светлая тема (и тема по умолчанию) ---------- */
html.ko-page-payment,
html.ko-page-payment[data-theme="light"] {
  color-scheme: light;

  --mp-bg: #eef5f7;
  --mp-bg-glow-1: rgba(118, 207, 233, 0.22);
  --mp-bg-glow-2: rgba(154, 139, 234, 0.08);
  --mp-surface: #ffffff;
  --mp-surface-2: #f4f8fa;
  --mp-card-border: rgba(121, 147, 162, 0.16);
  --mp-card-shadow: 0 24px 60px rgba(49, 85, 104, 0.10), 0 2px 6px rgba(49, 85, 104, 0.04);

  --mp-text: #071116;
  --mp-body: #354e5d;
  --mp-muted: #526b79;
  --mp-line: rgba(121, 147, 162, 0.28);

  --mp-cyan: #14738d;
  --mp-violet: #735fb5;
  --mp-accent-gradient: linear-gradient(105deg, #735fb5 0%, #447db1 40%, #126f89 75%, #187b9a 100%);

  --mp-field-bg: #f4f8fa;
  --mp-field-bg-hover: #e9f3f7;
  --mp-field-border: rgba(121, 147, 162, 0.32);
  --mp-field-border-hover: rgba(20, 115, 141, 0.45);
  --mp-focus-ring: rgba(20, 115, 141, 0.16);

  --mp-btn-secondary-bg: rgba(255, 255, 255, 0.6);
  --mp-btn-secondary-text: #243b48;

  --mp-popover-bg: #ffffff;
  --mp-popover-shadow: 0 24px 60px rgba(49, 85, 104, 0.18), 0 2px 8px rgba(49, 85, 104, 0.08);
  --mp-scrollbar: rgba(82, 107, 121, 0.28);

  --mp-danger: #c4314b;
  --mp-success: #1f8a5b;

  /* основная кнопка (как на вебинаре) и подложка под логотипы банков */
  --mp-btn-gradient: linear-gradient(110deg, #1f6e8c 0%, #3d78a8 30%, #6a5fb0 55%, #24739a 80%, #1f6e8c 100%);
  --mp-btn-text: #ffffff;
  --mp-btn-border: rgba(255, 255, 255, 0.18);
  --mp-btn-shadow: 0 2px 3px rgba(20, 60, 80, 0.16), 0 10px 26px rgba(40, 110, 150, 0.18);
  --mp-logo-plate: transparent;
  --mp-quick-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);

  --mp-logo: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 3368 496%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%22.4%22 stop-color=%22%23071116%22/%3E%3Cstop offset=%221%22 stop-color=%22%23344856%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill=%22%234cc2e5%22 fill-rule=%22evenodd%22 d=%22M66.5,373.5H0l34.7-239h63.5l76.3,141.2,76.5-141.2h60l34.7,239h-68.2l-13.9-165.4-73.1,165.4h-37.1l-73.1-165.4-13.9,165.4ZM346.1,436H.07v59.8h346.1v-59.8Z%22/%3E%3Cpath fill=%22url(%23g)%22 d=%22M398.5 478.9 443.8 354.4 444.6 390.9 342.3 139.3H403.7L472.5 317.4H458.6L526.9 139.3H586.1L453.3 478.9Z M560 374.4V325.2Q572.8 327.6 579.8 324.9Q586.8 322.2 590.4 314Q594 305.8 596.6 291.7Q600.1 273 602.8 247.9Q605.5 222.9 607.5 194.9Q609.4 167 610.9 139.3H788.6V374.4H729.4V194.6H662.7Q661.9 205.9 660.5 221.6Q659 237.3 657.4 254.1Q655.8 271 653.8 286.4Q651.9 301.7 649.7 312.6Q644.5 340.2 634.2 356.1Q624 372 606.2 376.5Q588.3 380.9 560 374.4Z M823 374.4V139.3H882.2V214.2H920Q929.8 214.2 942.9 214.6Q956 215.1 964.4 216.8Q985.1 221.4 999.3 231.4Q1013.4 241.4 1020.7 257.2Q1028 273 1028 294.7Q1028 326.1 1011.8 345.1Q995.6 364.2 964.9 371.4Q956.4 373.3 943.1 373.9Q929.8 374.4 920 374.4ZM882.2 328.7H926.6Q930.5 328.7 935.3 328.3Q940.1 327.8 944.9 326.5Q954 323.9 961 315Q967.9 306.1 967.9 294.7Q967.9 282.3 960.7 273.5Q953.6 264.7 944 262.1Q939.4 260.8 934.8 260.3Q930.3 259.9 926.6 259.9H882.2Z M1107.2 374.4V191.6H1030.2V139.3H1243.5V191.6H1166.4V374.4Z M1468.1 139.3V374.4H1411.6V230.7L1305.3 374.4H1258.3V139.3H1314.9V278.2L1421.6 139.3Z M1502.5 374.4V139.3H1712.4V374.4H1653.2V194.6H1561.7V374.4Z M1725.4 374.4V325.2Q1738.3 327.6 1745.2 324.9Q1752.2 322.2 1755.8 314Q1759.4 305.8 1762 291.7Q1765.5 273 1768.2 247.9Q1770.9 222.9 1772.9 194.9Q1774.9 167 1776.4 139.3H1954V374.4H1894.8V194.6H1828.2Q1827.3 205.9 1825.9 221.6Q1824.5 237.3 1822.8 254.1Q1821.2 271 1819.3 286.4Q1817.3 301.7 1815.1 312.6Q1809.9 340.2 1799.7 356.1Q1789.4 372 1771.6 376.5Q1753.7 380.9 1725.4 374.4Z M2198.2 139.3V374.4H2141.6V230.7L2035.4 374.4H1988.4V139.3H2045V278.2L2151.6 139.3Z M2232.6 374.4 2233.1 139.3H2293.1V252.5L2372.8 139.3H2445.9L2361 256.9L2451.6 374.4H2374.5L2293.1 261.2V374.4Z M2512.6 380.9Q2487.3 380.9 2469.8 371.2Q2452.3 361.6 2443.2 345.3Q2434.2 329.1 2434.2 309.5Q2434.2 293.2 2439.2 279.7Q2444.2 266.2 2455.4 255.9Q2466.6 245.5 2485.6 238.6Q2498.6 233.8 2516.7 230.1Q2534.8 226.4 2557.6 223Q2580.5 219.6 2607.9 215.5L2586.6 227.3Q2586.6 206.4 2576.5 196.6Q2566.5 186.8 2543 186.8Q2530 186.8 2515.8 193.1Q2501.7 199.4 2496 215.5L2442.5 198.5Q2451.4 169.4 2476 151.1Q2500.6 132.8 2543 132.8Q2574.2 132.8 2598.3 142.4Q2622.5 151.9 2634.9 175.4Q2641.9 188.5 2643.2 201.6Q2644.5 214.6 2644.5 230.7V374.4H2592.7V326.1L2600.1 336.1Q2582.9 359.8 2562.9 370.4Q2543 380.9 2512.6 380.9ZM2525.2 334.3Q2541.5 334.3 2552.7 328.6Q2563.9 322.8 2570.6 315.4Q2577.2 308 2579.6 303Q2584.2 293.4 2584.9 280.7Q2585.7 268 2585.7 259.5L2603.1 263.8Q2576.8 268.2 2560.4 271.1Q2544.1 274.1 2534.1 276.4Q2524.1 278.8 2516.5 281.7Q2507.8 285.2 2502.4 289.2Q2497.1 293.2 2494.6 298Q2492.1 302.8 2492.1 308.7Q2492.1 316.7 2496.1 322.5Q2500.1 328.3 2507.5 331.3Q2514.9 334.3 2525.2 334.3Z M2732.4 374.4V191.6H2655.3V139.3H2868.6V191.6H2791.6V374.4Z M2985.3 380.9Q2949.8 380.9 2923.1 365Q2896.3 349.1 2881.4 321.2Q2866.5 293.2 2866.5 256.9Q2866.5 220.1 2881.7 192.1Q2896.9 164.1 2923.7 148.5Q2950.5 132.8 2985.3 132.8Q3020.8 132.8 3047.7 148.7Q3074.6 164.6 3089.6 192.5Q3104.6 220.5 3104.6 256.9Q3104.6 293.4 3089.5 321.4Q3074.3 349.4 3047.5 365.1Q3020.6 380.9 2985.3 380.9ZM2985.3 325.6Q3013.8 325.6 3027.9 306.4Q3041.9 287.1 3041.9 256.9Q3041.9 225.5 3027.7 206.8Q3013.4 188.1 2985.3 188.1Q2965.9 188.1 2953.5 196.8Q2941.1 205.5 2935.1 220.9Q2929.2 236.4 2929.2 256.9Q2929.2 288.4 2943.4 307Q2957.7 325.6 2985.3 325.6Z M3241.7 380.9Q3206.7 380.9 3183.2 364.6Q3159.7 348.3 3147.8 320.2Q3135.9 292.1 3135.9 256.9Q3135.9 221.6 3147.7 193.5Q3159.5 165.4 3182.3 149.1Q3205.2 132.8 3238.7 132.8Q3272.4 132.8 3297.5 148.9Q3322.5 165 3336.3 193Q3350.1 220.9 3350.1 256.9Q3350.1 292.1 3336.5 320.2Q3322.9 348.3 3298.5 364.6Q3274.2 380.9 3241.7 380.9ZM3125.9 478.9V139.3H3178.2V300.4H3185.6V478.9ZM3232.2 328.3Q3251.3 328.3 3263.5 318.7Q3275.7 309.1 3281.6 292.9Q3287.4 276.7 3287.4 256.9Q3287.4 237.3 3281.4 221Q3275.3 204.8 3262.5 195.1Q3249.8 185.5 3230 185.5Q3211.5 185.5 3200.1 194.4Q3188.6 203.3 3183.4 219.4Q3178.2 235.5 3178.2 256.9Q3178.2 278.2 3183.4 294.3Q3188.6 310.4 3200.5 319.3Q3212.3 328.3 3232.2 328.3Z%22/%3E%3C/svg%3E");
  --mp-ico-card: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%23e1edf2%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%232a6f88%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%225.5%22 width=%2218%22 height=%2213%22 rx=%222.6%22/%3E%3Cpath d=%22M3 10h18M7 14.5h3.5%22/%3E%3C/g%3E%3C/svg%3E");
  --mp-ico-card-world: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%23e1edf2%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%232a6f88%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%225.5%22 width=%2218%22 height=%2213%22 rx=%222.6%22/%3E%3Crect x=%2213%22 y=%2210%22 width=%228%22 height=%224.5%22 rx=%221.6%22/%3E%3C/g%3E%3C/svg%3E");
  --mp-ico-qr: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%23e1edf2%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%232a6f88%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%224%22 y=%224%22 width=%226%22 height=%226%22 rx=%221.3%22/%3E%3Crect x=%2214%22 y=%224%22 width=%226%22 height=%226%22 rx=%221.3%22/%3E%3Crect x=%224%22 y=%2214%22 width=%226%22 height=%226%22 rx=%221.3%22/%3E%3Cpath d=%22M14 14h2.5v2.5M20 14v.01M14 20h.01M17.5 17.5H20V20h-2.5z%22/%3E%3C/g%3E%3C/svg%3E");
  --mp-ico-percent: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%23e1edf2%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%232a6f88%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M18 6 6 18%22/%3E%3Ccircle cx=%227.5%22 cy=%227.5%22 r=%222.2%22/%3E%3Ccircle cx=%2216.5%22 cy=%2216.5%22 r=%222.2%22/%3E%3C/g%3E%3C/svg%3E");
  --mp-ico-invoice: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%23e1edf2%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%232a6f88%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M7 3.5h7.5L19 8v12.5H7z%22/%3E%3Cpath d=%22M14 3.5V8h5M10 12h6M10 16h4%22/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- 2. Переменные: тёмная тема ---------- */
html.ko-page-payment[data-theme="dark"] {
  color-scheme: dark;

  --mp-bg: #070b11;
  --mp-bg-glow-1: rgba(34, 83, 106, 0.30);
  --mp-bg-glow-2: rgba(154, 139, 234, 0.10);
  --mp-surface: #0c1720;
  --mp-surface-2: #0f1c26;
  --mp-card-border: rgba(132, 158, 176, 0.18);
  --mp-card-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);

  --mp-text: #edf4f8;
  --mp-body: #b5c6d4;
  --mp-muted: #8ea5b4;
  --mp-line: rgba(132, 158, 176, 0.18);

  --mp-cyan: #67cfe9;
  --mp-violet: #9a8bea;
  --mp-accent-gradient: linear-gradient(105deg, #9b8ff1 0%, #8fa6ee 40%, #76cfea 75%, #a0e5f1 100%);

  --mp-field-bg: #0f1c26;
  --mp-field-bg-hover: #142531;
  --mp-field-border: rgba(132, 158, 176, 0.22);
  --mp-field-border-hover: rgba(103, 207, 233, 0.45);
  --mp-focus-ring: rgba(103, 207, 233, 0.16);

  --mp-btn-secondary-bg: rgba(11, 23, 32, 0.66);
  --mp-btn-secondary-text: #edf4f8;

  --mp-popover-bg: #101c27;
  --mp-popover-shadow: 0 24px 60px rgba(0, 0, 0, 0.55);
  --mp-scrollbar: rgba(142, 165, 180, 0.25);

  --mp-danger: #ff7a8a;
  --mp-success: #5fd39a;

  --mp-btn-gradient: linear-gradient(110deg, #9a8bea 0%, #8fa6ee 28%, #67cfe9 52%, #8fa6ee 77%, #9a8bea 100%);
  --mp-btn-text: #07151e;
  --mp-btn-border: rgba(211, 242, 255, 0.25);
  --mp-btn-shadow: 0 2px 3px rgba(0, 0, 0, 0.13), 0 10px 30px rgba(76, 194, 229, 0.12);
  --mp-logo-plate: rgba(255, 255, 255, 0.94);
  --mp-quick-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);

  --mp-logo: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 3368 496%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%22.4%22 stop-color=%22%23ffffff%22/%3E%3Cstop offset=%221%22 stop-color=%22%23b0c4de%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill=%22%234cc2e5%22 fill-rule=%22evenodd%22 d=%22M66.5,373.5H0l34.7-239h63.5l76.3,141.2,76.5-141.2h60l34.7,239h-68.2l-13.9-165.4-73.1,165.4h-37.1l-73.1-165.4-13.9,165.4ZM346.1,436H.07v59.8h346.1v-59.8Z%22/%3E%3Cpath fill=%22url(%23g)%22 d=%22M398.5 478.9 443.8 354.4 444.6 390.9 342.3 139.3H403.7L472.5 317.4H458.6L526.9 139.3H586.1L453.3 478.9Z M560 374.4V325.2Q572.8 327.6 579.8 324.9Q586.8 322.2 590.4 314Q594 305.8 596.6 291.7Q600.1 273 602.8 247.9Q605.5 222.9 607.5 194.9Q609.4 167 610.9 139.3H788.6V374.4H729.4V194.6H662.7Q661.9 205.9 660.5 221.6Q659 237.3 657.4 254.1Q655.8 271 653.8 286.4Q651.9 301.7 649.7 312.6Q644.5 340.2 634.2 356.1Q624 372 606.2 376.5Q588.3 380.9 560 374.4Z M823 374.4V139.3H882.2V214.2H920Q929.8 214.2 942.9 214.6Q956 215.1 964.4 216.8Q985.1 221.4 999.3 231.4Q1013.4 241.4 1020.7 257.2Q1028 273 1028 294.7Q1028 326.1 1011.8 345.1Q995.6 364.2 964.9 371.4Q956.4 373.3 943.1 373.9Q929.8 374.4 920 374.4ZM882.2 328.7H926.6Q930.5 328.7 935.3 328.3Q940.1 327.8 944.9 326.5Q954 323.9 961 315Q967.9 306.1 967.9 294.7Q967.9 282.3 960.7 273.5Q953.6 264.7 944 262.1Q939.4 260.8 934.8 260.3Q930.3 259.9 926.6 259.9H882.2Z M1107.2 374.4V191.6H1030.2V139.3H1243.5V191.6H1166.4V374.4Z M1468.1 139.3V374.4H1411.6V230.7L1305.3 374.4H1258.3V139.3H1314.9V278.2L1421.6 139.3Z M1502.5 374.4V139.3H1712.4V374.4H1653.2V194.6H1561.7V374.4Z M1725.4 374.4V325.2Q1738.3 327.6 1745.2 324.9Q1752.2 322.2 1755.8 314Q1759.4 305.8 1762 291.7Q1765.5 273 1768.2 247.9Q1770.9 222.9 1772.9 194.9Q1774.9 167 1776.4 139.3H1954V374.4H1894.8V194.6H1828.2Q1827.3 205.9 1825.9 221.6Q1824.5 237.3 1822.8 254.1Q1821.2 271 1819.3 286.4Q1817.3 301.7 1815.1 312.6Q1809.9 340.2 1799.7 356.1Q1789.4 372 1771.6 376.5Q1753.7 380.9 1725.4 374.4Z M2198.2 139.3V374.4H2141.6V230.7L2035.4 374.4H1988.4V139.3H2045V278.2L2151.6 139.3Z M2232.6 374.4 2233.1 139.3H2293.1V252.5L2372.8 139.3H2445.9L2361 256.9L2451.6 374.4H2374.5L2293.1 261.2V374.4Z M2512.6 380.9Q2487.3 380.9 2469.8 371.2Q2452.3 361.6 2443.2 345.3Q2434.2 329.1 2434.2 309.5Q2434.2 293.2 2439.2 279.7Q2444.2 266.2 2455.4 255.9Q2466.6 245.5 2485.6 238.6Q2498.6 233.8 2516.7 230.1Q2534.8 226.4 2557.6 223Q2580.5 219.6 2607.9 215.5L2586.6 227.3Q2586.6 206.4 2576.5 196.6Q2566.5 186.8 2543 186.8Q2530 186.8 2515.8 193.1Q2501.7 199.4 2496 215.5L2442.5 198.5Q2451.4 169.4 2476 151.1Q2500.6 132.8 2543 132.8Q2574.2 132.8 2598.3 142.4Q2622.5 151.9 2634.9 175.4Q2641.9 188.5 2643.2 201.6Q2644.5 214.6 2644.5 230.7V374.4H2592.7V326.1L2600.1 336.1Q2582.9 359.8 2562.9 370.4Q2543 380.9 2512.6 380.9ZM2525.2 334.3Q2541.5 334.3 2552.7 328.6Q2563.9 322.8 2570.6 315.4Q2577.2 308 2579.6 303Q2584.2 293.4 2584.9 280.7Q2585.7 268 2585.7 259.5L2603.1 263.8Q2576.8 268.2 2560.4 271.1Q2544.1 274.1 2534.1 276.4Q2524.1 278.8 2516.5 281.7Q2507.8 285.2 2502.4 289.2Q2497.1 293.2 2494.6 298Q2492.1 302.8 2492.1 308.7Q2492.1 316.7 2496.1 322.5Q2500.1 328.3 2507.5 331.3Q2514.9 334.3 2525.2 334.3Z M2732.4 374.4V191.6H2655.3V139.3H2868.6V191.6H2791.6V374.4Z M2985.3 380.9Q2949.8 380.9 2923.1 365Q2896.3 349.1 2881.4 321.2Q2866.5 293.2 2866.5 256.9Q2866.5 220.1 2881.7 192.1Q2896.9 164.1 2923.7 148.5Q2950.5 132.8 2985.3 132.8Q3020.8 132.8 3047.7 148.7Q3074.6 164.6 3089.6 192.5Q3104.6 220.5 3104.6 256.9Q3104.6 293.4 3089.5 321.4Q3074.3 349.4 3047.5 365.1Q3020.6 380.9 2985.3 380.9ZM2985.3 325.6Q3013.8 325.6 3027.9 306.4Q3041.9 287.1 3041.9 256.9Q3041.9 225.5 3027.7 206.8Q3013.4 188.1 2985.3 188.1Q2965.9 188.1 2953.5 196.8Q2941.1 205.5 2935.1 220.9Q2929.2 236.4 2929.2 256.9Q2929.2 288.4 2943.4 307Q2957.7 325.6 2985.3 325.6Z M3241.7 380.9Q3206.7 380.9 3183.2 364.6Q3159.7 348.3 3147.8 320.2Q3135.9 292.1 3135.9 256.9Q3135.9 221.6 3147.7 193.5Q3159.5 165.4 3182.3 149.1Q3205.2 132.8 3238.7 132.8Q3272.4 132.8 3297.5 148.9Q3322.5 165 3336.3 193Q3350.1 220.9 3350.1 256.9Q3350.1 292.1 3336.5 320.2Q3322.9 348.3 3298.5 364.6Q3274.2 380.9 3241.7 380.9ZM3125.9 478.9V139.3H3178.2V300.4H3185.6V478.9ZM3232.2 328.3Q3251.3 328.3 3263.5 318.7Q3275.7 309.1 3281.6 292.9Q3287.4 276.7 3287.4 256.9Q3287.4 237.3 3281.4 221Q3275.3 204.8 3262.5 195.1Q3249.8 185.5 3230 185.5Q3211.5 185.5 3200.1 194.4Q3188.6 203.3 3183.4 219.4Q3178.2 235.5 3178.2 256.9Q3178.2 278.2 3183.4 294.3Q3188.6 310.4 3200.5 319.3Q3212.3 328.3 3232.2 328.3Z%22/%3E%3C/svg%3E");
  --mp-ico-card: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%2316283a%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%238fd8ec%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%225.5%22 width=%2218%22 height=%2213%22 rx=%222.6%22/%3E%3Cpath d=%22M3 10h18M7 14.5h3.5%22/%3E%3C/g%3E%3C/svg%3E");
  --mp-ico-card-world: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%2316283a%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%238fd8ec%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%225.5%22 width=%2218%22 height=%2213%22 rx=%222.6%22/%3E%3Crect x=%2213%22 y=%2210%22 width=%228%22 height=%224.5%22 rx=%221.6%22/%3E%3C/g%3E%3C/svg%3E");
  --mp-ico-qr: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%2316283a%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%238fd8ec%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%224%22 y=%224%22 width=%226%22 height=%226%22 rx=%221.3%22/%3E%3Crect x=%2214%22 y=%224%22 width=%226%22 height=%226%22 rx=%221.3%22/%3E%3Crect x=%224%22 y=%2214%22 width=%226%22 height=%226%22 rx=%221.3%22/%3E%3Cpath d=%22M14 14h2.5v2.5M20 14v.01M14 20h.01M17.5 17.5H20V20h-2.5z%22/%3E%3C/g%3E%3C/svg%3E");
  --mp-ico-percent: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%2316283a%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%238fd8ec%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M18 6 6 18%22/%3E%3Ccircle cx=%227.5%22 cy=%227.5%22 r=%222.2%22/%3E%3Ccircle cx=%2216.5%22 cy=%2216.5%22 r=%222.2%22/%3E%3C/g%3E%3C/svg%3E");
  --mp-ico-invoice: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 30 30%22%3E%3Crect width=%2230%22 height=%2230%22 rx=%228%22 fill=%22%2316283a%22/%3E%3Cg transform=%22translate(5.4 5.4) scale(.8)%22 fill=%22none%22 stroke=%22%238fd8ec%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M7 3.5h7.5L19 8v12.5H7z%22/%3E%3Cpath d=%22M14 3.5V8h5M10 12h6M10 16h4%22/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- 3. Общие размеры и маски иконок (не зависят от темы) ---------- */
html.ko-page-payment {
  --mp-font: Manrope, Arial, sans-serif;
  --mp-card-w: 625px;
  --mp-pad: 24px;
  --mp-radius-card: 16px;
  --mp-radius-ctrl: 10px;
  --mp-mask-chevron: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22m9 5 7 7-7 7%22/%3E%3C/svg%3E");
  --mp-mask-close: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M6 6l12 12M18 6 6 18%22/%3E%3C/svg%3E");
}

/* ==========================================================================
   Правила
   ========================================================================== */

html.ko-page-payment,
html.ko-page-payment body {
  background: var(--mp-bg);
}

/* полноэкранная подложка виджета */
html.ko-page-payment .gcpay-wrapper-fullscreen {
  background:
    radial-gradient(ellipse 60% 50% at 85% 10%, var(--mp-bg-glow-1), transparent 70%),
    radial-gradient(ellipse 50% 45% at 5% 95%, var(--mp-bg-glow-2), transparent 70%),
    var(--mp-bg) !important;
  color: var(--mp-text);
  font-family: var(--mp-font);
  -webkit-font-smoothing: antialiased;
  scrollbar-color: var(--mp-scrollbar) transparent;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget button,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget input,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget textarea,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget select {
  font-family: var(--mp-font);
}

/* логотип над карточкой */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-wrapper-fullscreen-logo {
  max-width: var(--mp-card-w);
  margin: 26px auto 16px;
  padding: 0 4px;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-wrapper-fullscreen-logo img {
  display: none;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-wrapper-fullscreen-logo::before {
  content: "";
  display: block;
  width: 152px;
  height: 24px;
  background: var(--mp-logo) left center / contain no-repeat;
}

/* карточка = шапка + контейнер */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-fullscreen.gcpay-widget {
  max-width: var(--mp-card-w);
  color: var(--mp-text);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-head {
  padding: 26px var(--mp-pad) 14px;
  border: 1px solid var(--mp-card-border);
  border-bottom: 0;
  border-radius: var(--mp-radius-card) var(--mp-radius-card) 0 0;
  background: var(--mp-surface);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-head h1 {
  margin: 0;
  color: var(--mp-text);
  font-weight: 700;
  letter-spacing: -0.02em;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-head h1 span {
  margin-left: 5px;
  color: inherit;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-container {
  padding: 0 var(--mp-pad) 26px;
  border: 1px solid var(--mp-card-border);
  border-top: 0;
  border-radius: 0 0 var(--mp-radius-card) var(--mp-radius-card);
  background: var(--mp-surface);
  color: var(--mp-text);
  box-shadow: var(--mp-card-shadow);
  clip-path: inset(0 -80px -80px -80px); /* тень только по бокам и снизу — без шва с шапкой */
}

/* ---------- Сумма и «Информация о заказе» ---------- */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order {
  padding-bottom: 20px;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-price {
  font-weight: 750;
  letter-spacing: -0.04em;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-price p {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin: 0;
  color: var(--mp-text);
}

/* градиент только на числе: всё содержимое p — градиент, «руб» перекрашиваем обратно */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-price p {
  background: var(--mp-accent-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-price .price-currency {
  color: var(--mp-text);
  -webkit-text-fill-color: var(--mp-text);
  font-weight: 750;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .link-btn {
  color: var(--mp-cyan);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-btns .link-btn {
    padding: 6px 12px;
    border: 1px solid var(--mp-cyan);
    border-radius: 6px;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--info,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--alternative {
  align-items: center;
  width: auto;
  padding: 0;
  color: var(--mp-cyan);
  font-weight: 700;
  text-decoration: none;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--info.has-discount {
  width: auto;
  padding: 0;
}

/* значок скидки у «Информации о заказе» — в макете его нет */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--info.has-discount::after {
  display: none;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--info span::before,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--alternative::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin: 0 6px 0 0;
  vertical-align: -1px;
  background: currentColor;
  -webkit-mask: var(--mp-mask-chevron) center / contain no-repeat;
  mask: var(--mp-mask-chevron) center / contain no-repeat;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--info:hover,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--alternative:hover {
  opacity: 0.8;
}

/* ---------- E-mail для чека ---------- */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .email-block {
  margin-bottom: 26px;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .email-label {
  margin-bottom: 6px;
  padding-left: 0;
  color: var(--mp-muted);
  font-weight: 500;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .email-input {
  height: 44px;
  border: 1px solid var(--mp-field-border);
  border-radius: var(--mp-radius-ctrl);
  background: var(--mp-field-bg);
  color: var(--mp-text);
  font-weight: 500;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget span.email-input {
  line-height: 42px;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .email-input:focus {
  border-color: var(--mp-field-border-hover);
  box-shadow: 0 0 0 4px var(--mp-focus-ring);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .email-input::placeholder {
  color: var(--mp-muted);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .btn-cancel,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .btn-save {
  color: var(--mp-cyan);
  font-weight: 700;
}

/* ---------- Способы оплаты ---------- */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-methods-list-title {
  margin-bottom: 16px;
  color: var(--mp-text);
  font-weight: 700;
  letter-spacing: -0.02em;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-methods-list + .gcpay-widget-payment-methods-list,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-methods-list:not(:first-child) {
  margin-top: 28px;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method {
  margin-bottom: 8px;
}

/* общий вид кнопки способа оплаты (быстрые кнопки с логотипами — .pay-method — не трогаем) */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn:not(.pay-method) {
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: 12px 44px 12px 58px;
  border: 1px solid var(--mp-field-border);
  border-radius: var(--mp-radius-ctrl);
  background: var(--mp-field-bg) no-repeat 14px center / 30px 30px;
  color: var(--mp-text);
  font-weight: 600;
  line-height: 1.3;
  transition: background-color 0.18s ease, border-color 0.18s ease;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn:not(.pay-method, .error-method, :disabled):hover,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn:not(.pay-method, .error-method, :disabled):active {
  border-color: var(--mp-field-border-hover);
  background-color: var(--mp-field-bg-hover) !important;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn:focus-visible {
  outline: 2px solid var(--mp-cyan);
  outline-offset: 2px;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn .info-card-method {
  color: var(--mp-muted);
}

/* иконки в плитках */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.made-RF {
  background-image: var(--mp-ico-card);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.made-world,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.stripe,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.PAYPAL,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.ROBOKASSA {
  background: var(--mp-ico-card-world) 14px center / 30px 30px no-repeat, var(--mp-field-bg);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.sbp:not(.pay-method) {
  background-image: var(--mp-ico-qr);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.credit,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.installment-plan {
  background: var(--mp-ico-percent) 14px center / 30px 30px no-repeat, var(--mp-field-bg);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.invoice,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.invoice.kvit,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.digital-rub {
  background: var(--mp-ico-invoice) 14px center / 30px 30px no-repeat, var(--mp-field-bg);
}

/* стрелка у «рассрочки» */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.credit::after,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.installment-plan::after {
  right: 16px;
  width: 14px;
  height: 14px;
  background: var(--mp-text);
  -webkit-mask: var(--mp-mask-chevron) center / contain no-repeat;
  mask: var(--mp-mask-chevron) center / contain no-repeat;
}

/* быстрые кнопки (Яндекс Пэй, SberPay, СБП, Альфа Pay) остаются с фирменными
   логотипами платформы; в тёмной теме приглушаем только их тень */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method.group-methods .group-methods-item {
  box-shadow: var(--mp-quick-shadow);
}

/* недоступный способ */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn.error-method {
  filter: grayscale(1) opacity(0.45);
}

/* подсказки и оферта под способами */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-oferta,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-methods-oferta {
  background: transparent;
  color: var(--mp-muted);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .yandex-pay-hint {
  background: var(--mp-surface-2) !important;
  color: var(--mp-body);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .yandex-pay-hint::before {
  border-bottom-color: var(--mp-surface-2) !important;
}

/* ---------- Альтернативные способы ---------- */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-alternative-methods {
  padding-top: 26px;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-alternative-methods-about p {
  margin-bottom: 12px !important;
  color: var(--mp-muted);
  line-height: 1.5;
}

/* ---------- Подвал: плашки платёжных систем и оферта ---------- */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  max-width: var(--mp-card-w);
  margin: 22px auto 32px;
  padding: 0 var(--mp-pad);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-types,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-logo {
  display: contents;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-types img,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-logo img {
  display: none;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-types::before,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-types::after,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-logo::before,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-logo::after {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 10px;
  border: 1px solid var(--mp-card-border);
  border-radius: 7px;
  background: var(--mp-surface);
  color: var(--mp-body);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-types::before { content: "Mastercard"; }
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-types::after { content: "МИР"; }
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-logo::before { content: "Visa"; }
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer-logo::after { content: "Яндекс Пэй"; }

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-footer .gcpay-widget-oferta {
  flex: 1 0 100%;
  margin-top: 10px;
  color: var(--mp-muted);
  line-height: 1.55;
  text-align: center;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-oferta,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-oferta p {
  color: var(--mp-muted);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-oferta a,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-methods-oferta a,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-oferta a {
  color: var(--mp-cyan);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ==========================================================================
   Поп-апы виджета: «Информация о заказе», «Альтернативные способы»,
   бонусы, промокод, рассрочка и т. п. (класс .gcpay-widget-modal)
   ========================================================================== */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal {
  border: 1px solid var(--mp-card-border);
  border-radius: 14px;
  background: var(--mp-popover-bg);
  color: var(--mp-text);
  box-shadow: var(--mp-popover-shadow);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal-container {
  color: var(--mp-text);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal-header,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal h3,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal h4 {
  color: var(--mp-text);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal .gcpay-widget-modal-header {
  font-weight: 700;
  letter-spacing: -0.01em;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--details .gcpay-widget-modal-header span {
  color: var(--mp-muted);
  font-weight: 600;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal-subheader {
  color: var(--mp-body);
}

/* таблицы состава и расчёта суммы */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-positions-table,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-how-happen-table {
  color: var(--mp-body);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-positions,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-positions-table table tr td,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-positions-table table tr,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-how-happen-table table tr td {
  border-color: var(--mp-line) !important;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-position-title {
  color: var(--mp-text);
  font-weight: 600;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-how-happen-table table tr:last-child td {
  color: var(--mp-text);
  font-weight: 700;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-details-price-title,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-how-happen-title {
  color: var(--mp-muted);
  font-weight: 700;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-details-price-value {
  width: fit-content;
  font-weight: 750;
  letter-spacing: -0.03em;
  background: var(--mp-accent-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--show-details,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--hide-details,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-position-title ~ .gcpay-widget-btn--show-details,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-position-title ~ .gcpay-widget-btn--hide-details,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal .link-btn {
  color: var(--mp-cyan);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-details-title-wrapper,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-details-title-scroll::-webkit-scrollbar-track {
  border-color: var(--mp-line);
  background: var(--mp-popover-bg);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-order-details-title {
  color: var(--mp-muted);
}

/* кнопка «Закрыть» — вторичная кнопка из бренд-гайда */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--close-btn:not(.link-btn),
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--bonus .gcpay-widget-modal-cancel {
  min-height: 44px;
  padding: 10px 20px;
  border: 1px solid var(--mp-field-border);
  border-radius: 8px;
  background: var(--mp-btn-secondary-bg);
  color: var(--mp-btn-secondary-text);
  font-weight: 600;
  transition: border-color 0.18s ease, background-color 0.18s ease;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--close-btn:not(.link-btn):hover,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--bonus .gcpay-widget-modal-cancel:hover {
  border-color: var(--mp-field-border-hover);
  background: var(--mp-field-bg-hover);
}

/* крестик закрытия */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--close-btn.link-btn,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-close-btn {
  width: 22px;
  height: 22px;
  background: var(--mp-muted) !important;
  -webkit-mask: var(--mp-mask-close) center / contain no-repeat;
  mask: var(--mp-mask-close) center / contain no-repeat;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--close-btn.link-btn:hover,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-close-btn:hover {
  background: var(--mp-text) !important;
}

/* поля в поп-апах (бонусы, промокод, рассрочка) */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal input:not([type="checkbox"], [type="radio"]) {
  border: 1px solid var(--mp-field-border);
  border-radius: 8px;
  background: var(--mp-field-bg);
  color: var(--mp-text);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal input::placeholder {
  color: var(--mp-muted);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--bonus .gcpay-widget-modal-row-muted {
  color: var(--mp-muted);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal .error-message,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--bonus .gcpay-widget-modal-limit,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--promocode form.has-error input,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--bonus form.has-error input,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--cooldown-period .gcpay-widget-modal-header {
  color: var(--mp-danger);
  border-color: var(--mp-danger);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--promocode .gcpay-widget-modal-label .applied-code,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal--promocode form.applied input {
  color: var(--mp-success);
  border-color: var(--mp-success);
}

/* ---------- Поп-ап «Оплата в рассрочку или кредит» ---------- */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan-item form {
  border: 1px solid var(--mp-field-border);
  border-radius: 12px;
  background: var(--mp-field-bg);
  color: var(--mp-text);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan-item form p {
  color: var(--mp-body);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan-item.error-method form {
  border-color: var(--mp-line);
  background: var(--mp-surface-2);
  opacity: 0.55;
}

/* логотипы банков — на светлой плашке, чтобы читались в тёмной теме */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan-image {
  box-sizing: content-box;
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--mp-logo-plate);
}

/* выбор периода */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan--select-title {
  position: relative;
  min-height: 40px;
  padding: 0 34px 0 12px;
  border: 1px solid var(--mp-field-border);
  border-radius: 8px;
  background: var(--mp-surface);
  color: var(--mp-text);
  font-weight: 600;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan--select-title:hover {
  border-color: var(--mp-field-border-hover);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan--select-title::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  background: var(--mp-muted);
  -webkit-mask: var(--mp-mask-chevron) center / contain no-repeat;
  mask: var(--mp-mask-chevron) center / contain no-repeat;
  transform: rotate(90deg);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan--select-options {
  top: calc(100% + 4px);
  padding: 4px;
  border: 1px solid var(--mp-card-border);
  border-radius: 10px;
  background: var(--mp-popover-bg);
  box-shadow: var(--mp-popover-shadow);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan--select-options label span {
  align-items: center;
  padding: 8px;
  border-radius: 6px;
  background: transparent;
  color: var(--mp-text);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan--select-options label:hover span,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan--select-options label input:checked + span {
  background: var(--mp-field-bg-hover);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan--select-options label span::before {
  margin-top: 0;
  border-color: var(--mp-muted);
  background: var(--mp-field-bg);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan--select-options label input:checked + span::before {
  border-color: var(--mp-cyan);
  background: radial-gradient(circle, var(--mp-cyan) 0 2.5px, transparent 3px), var(--mp-field-bg);
}

/* поле суммы во вложенном окне рассрочки */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .inner-modal .gcpay-widget-modal--installment-plan-input label {
  color: var(--mp-text);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .inner-modal .gcpay-widget-modal--installment-plan-input input,
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .inner-modal .gcpay-widget-installment-plan--select-title {
  border: 1px solid var(--mp-field-border);
  background-color: var(--mp-field-bg);
  color: var(--mp-text);
}

/* кнопка «Купить в рассрочку» — основная кнопка бренда */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan-btn {
  min-height: 44px;
  border: 1px solid var(--mp-btn-border);
  border-radius: 10px;
  background: var(--mp-btn-gradient) 0 50% / 220% 100%;
  color: var(--mp-btn-text);
  box-shadow: var(--mp-btn-shadow);
  font-weight: 750;
  letter-spacing: 0.06em;
  transition: filter 150ms ease-out, transform 150ms ease-out;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan-btn:not(:disabled):hover {
  border-color: var(--mp-btn-border);
  background: var(--mp-btn-gradient) 0 50% / 220% 100%;
  filter: brightness(1.08);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan-btn:not(:disabled):active {
  transform: scale(0.97);
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-installment-plan-btn:disabled {
  border-color: var(--mp-field-border);
  background: var(--mp-field-bg-hover);
  color: var(--mp-muted);
  box-shadow: none;
  cursor: not-allowed;
}

/* «Назад» / «Далее» во вложенных шагах рассрочки */
html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--installment-plan-nav {
  min-height: 44px;
  border: 1px solid var(--mp-field-border);
  border-radius: 8px;
  background: var(--mp-btn-secondary-bg);
  color: var(--mp-btn-secondary-text);
  font-weight: 600;
}

html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-btn--installment-plan-nav:not(.link-btn, :disabled):hover {
  border-color: var(--mp-field-border-hover);
  background: var(--mp-field-bg-hover);
}

/* ---------- Смена темы без мигания ---------- */
html.ko-page-payment.mp-theme-switching *,
html.ko-page-payment.mp-theme-switching *::before,
html.ko-page-payment.mp-theme-switching *::after {
  transition: none !important;
}

/* ---------- Телефон ---------- */
@media (max-width: 640px) {
  html.ko-page-payment {
    --mp-pad: 18px;
  }

  html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-wrapper-fullscreen-logo,
  html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget-fullscreen.gcpay-widget {
    max-width: none;
    margin-left: 12px;
    margin-right: 12px;
    width: auto;
  }

  html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-wrapper-fullscreen-logo {
    margin-top: 18px;
    margin-bottom: 12px;
    padding: 0 6px;
  }

  html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-head {
    padding-top: 22px;
  }

  html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-payment-method-btn:not(.pay-method) {
    min-height: 60px;
  }

  /* платформа центрирует поп-апы через left: 50% + translate(-50%);
     растягиваем их на ширину блока и снимаем сдвиг, иначе они уезжают влево */
  html.ko-page-payment .gcpay-wrapper-fullscreen .gcpay-widget .gcpay-widget-modal {
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
  }
}
/* ------------- 
content finish - Оплата
------------- */
