hongluan-ui/theme/hl-tour.css

Hongluan Component Library for Vue 3

:root{--main-color:#36A4FF;--rgb-main-color:54,164,255;--shadow-color:62,78,106;--primary:#36A4FF;--primary-bg:#36A4FF;--primary-hover:#5eb6ff;--primary-active:#1d99ff;--primary-light:#ebf6ff;--success:#4CC09E;--success-bg:#4CC09E;--success-hover:#70cdb1;--success-active:#40b694;--success-light:#edf9f5;--danger:#FF4D4F;--danger-bg:#FF4D4F;--danger-hover:#ff7172;--danger-active:#ff3235;--danger-light:#ffeded;--warning:#FA8B16;--warning-bg:#FA8B16;--warning-hover:#fba245;--warning-active:#f58005;--warning-light:#fff3e8;--info:#4a72e5;--info-bg:#4a72e5;--info-hover:#6e8eea;--info-active:#3561e2;--info-light:#edf1fc;--rgb-primary:54,164,255;--rgb-success:76,192,158;--rgb-danger:255,77,79;--rgb-warning:250,139,22;--rgb-info:74,114,229;--rgb-bg-body:255,255,255;--rgb-bg-content:255,255,255;--rgb-bg-light:246,249,251;--rgb-bg-popup:255,255,255;--rgb-bg-element:255,255,255;--rgb-bg-hover:249,250,254;--rgb-bg-active:54,164,255;--rgb-bg-header:249,250,254;--rgb-bg-backdrop:0,0,0;--text-regular:#4B4B4B;--text-secondary:#8A8A8A;--text-light:#BDBDBD;--text-lightest:#CACFD6;--text-title:#202020;--text-link:var(--main-color);--text-hover:var(--main-color);--text-active:var(--main-color);--text-inverse:#FFFFFF;--bg-body:#ffffff;--bg-content:#FFFFFF;--bg-light:#F6F9FB;--bg-popup:#FFFFFF;--bg-element:#FFFFFF;--bg-hover:#F9FAFE;--bg-active:#36A4FF;--bg-header:#F9FAFE;--bg-backdrop:rgba(0, 0, 0, 0.3);--border-regular:#EDEDED;--border-light:#E7E7E7;--border-dark:#E7E7E7;--box-shadow-sm:0 2px 4px 0 rgba(var(--shadow-color, 62, 78, 106), 0.06);--box-shadow-md:0 4px 16px 0 rgba(var(--shadow-color, 62, 78, 106), 0.08);--box-shadow-lg:0 6px 24px rgba(var(--shadow-color, 62, 78, 106), 0.1);--box-shadow-xl:0 12px 40px 0 rgba(var(--shadow-color, 62, 78, 106), 0.24);--primary-light-5:#ebf9ff;--primary-light-4:#c7edff;--primary-light-3:#a3deff;--primary-light-2:#7ecdff;--primary-light-1:#5abaff;--primary-dark-1:#0b88ff;--primary-dark-2:#006bde;--primary-dark-3:#0050b3;--primary-dark-4:#003888;--primary-dark-5:#00235d;--success-light-5:#ecfaf3;--success-light-4:#c9f1e0;--success-light-3:#a8e6ce;--success-light-2:#88dbbd;--success-light-1:#6acead;--success-dark-1:#33b392;--success-dark-2:#269b81;--success-dark-3:#168570;--success-dark-4:#0b6b5c;--success-dark-5:#034d44;--danger-light-5:#ffedf0;--danger-light-4:#ffcdd4;--danger-light-3:#ffadb6;--danger-light-2:#ff8d96;--danger-light-1:#ff6d74;--danger-dark-1:#ff231f;--danger-dark-2:#ef0d00;--danger-dark-3:#c11100;--danger-dark-4:#921200;--danger-dark-5:#640f00;--warning-light-5:#fff0e8;--warning-light-4:#fed6bd;--warning-light-3:#fdbf93;--warning-light-2:#fcab6a;--warning-light-1:#fb9a40;--warning-dark-1:#e67f04;--warning-dark-2:#c17103;--warning-dark-3:#9c6002;--warning-dark-4:#774d01;--warning-dark-5:#513700;--info-light-5:#ecf3fd;--info-light-4:#cbddf9;--info-light-3:#aac5f5;--info-light-2:#89abf0;--info-light-1:#6a8feb;--info-dark-1:#204ce4;--info-dark-2:#1536c6;--info-dark-3:#0c24a4;--info-dark-4:#06157f;--info-dark-5:#020a59;--form-bg-color:var(--bg-element);--form-bg-color-fill:#f5f8fa;--form-border-color:var(--border-dark);--form-disabled-border-color:var(--border-light);--form-disabled-bg-color:var(--bg-light);--form-disabled-font-color:var(--text-light);--form-icon-color:var(--text-regular);--form-shadow-color:var(--rgb-primary);--hl-button-font-color:var(--text-regular);--hl-button-font-color-hover:var(--primary);--hl-button-font-color-active:var(--primary);--hl-button-bg-color:var(--bg-element);--hl-button-bg-color-hover:var(--bg-element);--hl-button-bg-color-active:var(--bg-element);--hl-button-border-color:var(--form-border-color);--hl-button-border-color-hover:#c3e4ff;--hl-button-border-color-active:var(--primary);--hl-menu-icon-color:#5281E9;--hl-menu-icon-color-hover:currentColor;--hl-menu-icon-color-active:#ffffff;--hl-menu-font-color:var(--text-regular);--hl-menu-font-color-hover:var(--text-secondary);--hl-menu-font-color-active:#ffffff;--hl-menu-bg-color:#ffffff;--hl-menu-bg-hover:#F8FAFF;--hl-menu-bg-active:#9EAECD;--hl-menu-group-title-color:rgba(#000, 0.2);--hl-menu-child-bg-color:#ffffff;--hl-menu-dropdown-shadow:var(--box-shadow-md)}.hl-tour{--tour-width:520px;--tour-padding-primary:16px;--tour-font-line-height:24px;--tour-title-font-size:16px;--tour-title-text-color:var(--text-primary);--tour-title-font-weight:400;--tour-font-size:14px;--tour-color:var(--text-primary);--tour-bg-color:var(--bg-content);--tour-border-radius:4px;--tour-border-color:var(--border-regular)}.hl-tour .tour-hollow{transition:all var(--transition-duration) ease}.hl-tour .tour-content{padding:0;border-radius:var(--tour-border-radius);border:1px solid var(--tour-border-color);width:var(--tour-width);background:var(--tour-bg-color);box-shadow:var(--box-shadow-md);box-sizing:border-box}.hl-tour .tour-content[data-side^=top] .tour-arrow{border-top-color:transparent;border-left-color:transparent;bottom:-5px}.hl-tour .tour-content[data-side^=bottom] .tour-arrow{border-bottom-color:transparent;border-right-color:transparent;top:-5px}.hl-tour .tour-content[data-side^=left] .tour-arrow{border-left-color:transparent;border-bottom-color:transparent;right:-5px}.hl-tour .tour-content[data-side^=right] .tour-arrow{border-right-color:transparent;border-top-color:transparent;left:-5px}.hl-tour .tour-content .tour-indicators{display:inline-block;flex:1}.hl-tour .tour-content .tour-indicator{width:6px;height:6px;display:inline-block;border-radius:50%;background:var(--info-light-5);margin-right:6px}.hl-tour .tour-content .tour-indicator.is-active{background:var(--primary)}.hl-tour .tour-arrow{position:absolute;background:var(--tour-bg-color);border:1px solid var(--tour-border-color);width:10px;height:10px;pointer-events:none;transform:rotate(45deg);box-sizing:border-box}.hl-tour .tour-closebtn{position:absolute;top:6px;right:0;padding:0;width:40px;height:40px;background:0 0;border:none;outline:0;cursor:pointer;font-size:var(--message-close-size,16px)}.hl-tour .tour-closebtn .tour-close{color:var(--tour-title-text-color);font-size:inherit}.hl-tour .tour-closebtn:focus .tour-close,.hl-tour .tour-closebtn:hover .tour-close{color:var(--primary)}.hl-tour .tour-header{padding:var(--tour-padding-primary);padding-bottom:10px;margin-right:16px}.hl-tour .tour-title{line-height:var(--tour-font-line-height);font-size:var(--tour-title-font-size);color:var(--tour-title-text-color);font-weight:var(--tour-title-font-weight)}.hl-tour .tour-body{padding:0 var(--tour-padding-primary);color:var(--tour-text-color);font-size:var(--tour-font-size)}.hl-tour .tour-body img,.hl-tour .tour-body video{max-width:100%}.hl-tour .tour-footer{padding:var(--tour-padding-primary);padding-top:10px;box-sizing:border-box;display:flex;justify-content:space-between}.hl-tour.tour-primary{--tour-title-text-color:#fff;--tour-text-color:#fff;--tour-bg-color:var(--primary)}.hl-tour.tour-primary .tour-closebtn:focus .tour-close,.hl-tour.tour-primary .tour-closebtn:hover .tour-close{color:var(--tour-title-text-color)}.hl-tour.tour-primary .tour-indicator{background:rgba(255,255,255,.15)}.hl-tour.tour-primary .tour-indicator.is-active{background:#fff}:root{--main-color:#36A4FF;--rgb-main-color:54,164,255;--shadow-color:62,78,106;--primary:#36A4FF;--primary-bg:#36A4FF;--primary-hover:#5eb6ff;--primary-active:#1d99ff;--primary-light:#ebf6ff;--success:#4CC09E;--success-bg:#4CC09E;--success-hover:#70cdb1;--success-active:#40b694;--success-light:#edf9f5;--danger:#FF4D4F;--danger-bg:#FF4D4F;--danger-hover:#ff7172;--danger-active:#ff3235;--danger-light:#ffeded;--warning:#FA8B16;--warning-bg:#FA8B16;--warning-hover:#fba245;--warning-active:#f58005;--warning-light:#fff3e8;--info:#4a72e5;--info-bg:#4a72e5;--info-hover:#6e8eea;--info-active:#3561e2;--info-light:#edf1fc;--rgb-primary:54,164,255;--rgb-success:76,192,158;--rgb-danger:255,77,79;--rgb-warning:250,139,22;--rgb-info:74,114,229;--rgb-bg-body:255,255,255;--rgb-bg-content:255,255,255;--rgb-bg-light:246,249,251;--rgb-bg-popup:255,255,255;--rgb-bg-element:255,255,255;--rgb-bg-hover:249,250,254;--rgb-bg-active:54,164,255;--rgb-bg-header:249,250,254;--rgb-bg-backdrop:0,0,0;--text-regular:#4B4B4B;--text-secondary:#8A8A8A;--text-light:#BDBDBD;--text-lightest:#CACFD6;--text-title:#202020;--text-link:var(--main-color);--text-hover:var(--main-color);--text-active:var(--main-color);--text-inverse:#FFFFFF;--bg-body:#ffffff;--bg-content:#FFFFFF;--bg-light:#F6F9FB;--bg-popup:#FFFFFF;--bg-element:#FFFFFF;--bg-hover:#F9FAFE;--bg-active:#36A4FF;--bg-header:#F9FAFE;--bg-backdrop:rgba(0, 0, 0, 0.3);--border-regular:#EDEDED;--border-light:#E7E7E7;--border-dark:#E7E7E7;--box-shadow-sm:0 2px 4px 0 rgba(var(--shadow-color, 62, 78, 106), 0.06);--box-shadow-md:0 4px 16px 0 rgba(var(--shadow-color, 62, 78, 106), 0.08);--box-shadow-lg:0 6px 24px rgba(var(--shadow-color, 62, 78, 106), 0.1);--box-shadow-xl:0 12px 40px 0 rgba(var(--shadow-color, 62, 78, 106), 0.24);--primary-light-5:#ebf9ff;--primary-light-4:#c7edff;--primary-light-3:#a3deff;--primary-light-2:#7ecdff;--primary-light-1:#5abaff;--primary-dark-1:#0b88ff;--primary-dark-2:#006bde;--primary-dark-3:#0050b3;--primary-dark-4:#003888;--primary-dark-5:#00235d;--success-light-5:#ecfaf3;--success-light-4:#c9f1e0;--success-light-3:#a8e6ce;--success-light-2:#88dbbd;--success-light-1:#6acead;--success-dark-1:#33b392;--success-dark-2:#269b81;--success-dark-3:#168570;--success-dark-4:#0b6b5c;--success-dark-5:#034d44;--danger-light-5:#ffedf0;--danger-light-4:#ffcdd4;--danger-light-3:#ffadb6;--danger-light-2:#ff8d96;--danger-light-1:#ff6d74;--danger-dark-1:#ff231f;--danger-dark-2:#ef0d00;--danger-dark-3:#c11100;--danger-dark-4:#921200;--danger-dark-5:#640f00;--warning-light-5:#fff0e8;--warning-light-4:#fed6bd;--warning-light-3:#fdbf93;--warning-light-2:#fcab6a;--warning-light-1:#fb9a40;--warning-dark-1:#e67f04;--warning-dark-2:#c17103;--warning-dark-3:#9c6002;--warning-dark-4:#774d01;--warning-dark-5:#513700;--info-light-5:#ecf3fd;--info-light-4:#cbddf9;--info-light-3:#aac5f5;--info-light-2:#89abf0;--info-light-1:#6a8feb;--info-dark-1:#204ce4;--info-dark-2:#1536c6;--info-dark-3:#0c24a4;--info-dark-4:#06157f;--info-dark-5:#020a59;--form-bg-color:var(--bg-element);--form-bg-color-fill:#f5f8fa;--form-border-color:var(--border-dark);--form-disabled-border-color:var(--border-light);--form-disabled-bg-color:var(--bg-light);--form-disabled-font-color:var(--text-light);--form-icon-color:var(--text-regular);--form-shadow-color:var(--rgb-primary);--hl-button-font-color:var(--text-regular);--hl-button-font-color-hover:var(--primary);--hl-button-font-color-active:var(--primary);--hl-button-bg-color:var(--bg-element);--hl-button-bg-color-hover:var(--bg-element);--hl-button-bg-color-active:var(--bg-element);--hl-button-border-color:var(--form-border-color);--hl-button-border-color-hover:#c3e4ff;--hl-button-border-color-active:var(--primary);--hl-menu-icon-color:#5281E9;--hl-menu-icon-color-hover:currentColor;--hl-menu-icon-color-active:#ffffff;--hl-menu-font-color:var(--text-regular);--hl-menu-font-color-hover:var(--text-secondary);--hl-menu-font-color-active:#ffffff;--hl-menu-bg-color:#ffffff;--hl-menu-bg-hover:#F8FAFF;--hl-menu-bg-active:#9EAECD;--hl-menu-group-title-color:rgba(#000, 0.2);--hl-menu-child-bg-color:#ffffff;--hl-menu-dropdown-shadow:var(--box-shadow-md)}.hl-button{--button-radius:var(--form-radius);--button-padding-x:var(--form-padding-x);--button-padding-y:var(--form-padding-y);--button-height:var(--form-md);--button-font-weight:400;--button-font-size:var(--font-md);--button-border-width:var(--form-border-width);--button-font-color:var(--hl-button-font-color);--button-font-color-hover:var(--hl-button-font-color-hover);--button-font-color-active:var(--hl-button-font-color-active);--button-bg-color:var(--hl-button-bg-color);--button-bg-color-hover:var(--hl-button-bg-color-hover);--button-bg-color-active:var(--hl-button-bg-color-active);--button-border-color:var(--hl-button-border-color);--button-border-color-hover:var(--hl-button-border-color-hover);--button-border-color-active:var(--hl-button-border-color-active);cursor:pointer;position:relative;display:inline-flex;align-items:center;justify-content:center;color:var(--button-font-color);font-size:var(--button-font-size);font-weight:var(--button-font-weight);line-height:1;white-space:nowrap;text-align:center;vertical-align:middle;height:var(--button-height);padding:var(--button-padding-y) var(--button-padding-x);border-width:var(--button-border-width);border-style:solid;border-color:var(--button-border-color);border-radius:var(--button-radius);background-color:var(--button-bg-color);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:background-color var(--duration) var(--timing),color var(--duration) var(--timing),border-color var(--duration) var(--timing),box-shadow var(--duration) var(--timing)}.hl-button:focus:not(:focus-visible){outline:0}.hl-button:focus{z-index:3}.hl-button.is-active,.hl-button:active,.hl-button:hover{z-index:2}.hl-button.is-focus,.hl-button.is-hover,.hl-button:focus,.hl-button:hover{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-checkbox.is-checked .hl-button,.hl-radio.is-checked .hl-button{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.is-disabled:not(.is-loading),.hl-button:disabled:not(.is-loading){color:var(--form-disabled-font-color);border-color:var(--form-disabled-border-color);background-color:var(--form-disabled-bg-color);background-image:none;pointer-events:none}.hl-button.is-active,.hl-button:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.is-loading{opacity:var(--form-disabled-opacity);pointer-events:none}.hl-button.link{color:var(--text-link);border-color:transparent;background-color:transparent}.hl-button.link:focus,.hl-button.link:hover{color:var(--text-hover)}.hl-button.light.is-disabled:not(.is-loading),.hl-button.light:disabled:not(.is-loading){color:var(--form-disabled-font-color);border-color:var(--form-disabled-border-color);background-color:var(--form-disabled-bg-color)}.hl-button.no-fill{border-color:transparent;background-color:transparent}.hl-button.no-fill.is-focus,.hl-button.no-fill.is-hover,.hl-button.no-fill:focus,.hl-button.no-fill:hover{color:var(--button-font-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.no-fill.is-active,.hl-button.no-fill:active{color:var(--button-font-color-active);background-color:var(--button-bg-color-active)}.hl-button.no-fill.is-disabled:not(.is-loading),.hl-button.no-fill:disabled:not(.is-loading){color:var(--form-disabled-font-color);border-color:transparent;background-color:transparent}.hl-button.no-event{pointer-events:none}.hl-button span{align-items:center}.hl-button .hl-icon,.hl-button .hl-spinner{display:flex;flex-grow:unset;font-size:var(--form-icon-size);width:var(--form-icon-size);height:var(--form-icon-size);color:currentColor}.hl-button .hl-icon:not(:only-child),.hl-button .hl-spinner:not(:only-child){margin-right:4px}.hl-button.icon-left{justify-content:space-between}.hl-button.icon-left .hl-icon{order:-1;flex-shrink:0}.hl-button.icon-right{justify-content:space-between}.hl-button.icon-right .hl-icon{order:1;flex-shrink:0;margin-right:0;margin-left:4px}.hl-button.rational span{flex-basis:0;flex-grow:1}.hl-button.block,.hl-button.full{width:100%;display:flex}.hl-button.round{border-radius:var(--radius-round)}.hl-button.equal{padding-left:0;padding-right:0;min-width:var(--button-height);max-width:var(--button-height);width:var(--button-height);height:var(--button-height);justify-content:center}.hl-button.equal .hl-icon{margin:0}.hl-button.primary{--button-font-color:var(--text-inverse);--button-bg-color:var(--primary-bg);--button-border-color:var(--primary);--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--primary-hover);--button-border-color-hover:var(--primary-hover);--button-font-color-active:var(--text-inverse);--button-bg-color-active:var(--primary-active);--button-bg-color-light:var(--primary-light);--button-border-color-active:var(--primary-active)}.hl-button.primary.light{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.primary.light.is-focus,.hl-button.primary.light.is-hover,.hl-button.primary.light:focus,.hl-button.primary.light:hover{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.primary.light.is-active,.hl-button.primary.light:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.primary.no-fill{color:var(--button-border-color)}.hl-button.primary.no-fill.is-focus,.hl-button.primary.no-fill.is-hover,.hl-button.primary.no-fill:focus,.hl-button.primary.no-fill:hover{color:var(--button-font-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.primary.no-fill.is-active,.hl-button.primary.no-fill:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.primary.no-fill.light{border-color:transparent;background-color:transparent}.hl-button.primary.no-fill.light.is-focus,.hl-button.primary.no-fill.light.is-hover,.hl-button.primary.no-fill.light:focus,.hl-button.primary.no-fill.light:hover{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.primary.no-fill.light.is-active,.hl-button.primary.no-fill.light:active{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-checkbox.is-checked .hl-button.primary,.hl-radio.is-checked .hl-button.primary{--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--primary-hover);--button-border-color-hover:var(--primary-hover)}.hl-button.info{--button-font-color:var(--text-inverse);--button-bg-color:var(--info-bg);--button-border-color:var(--info);--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--info-hover);--button-border-color-hover:var(--info-hover);--button-font-color-active:var(--text-inverse);--button-bg-color-active:var(--info-active);--button-bg-color-light:var(--info-light);--button-border-color-active:var(--info-active)}.hl-button.info.light{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.info.light.is-focus,.hl-button.info.light.is-hover,.hl-button.info.light:focus,.hl-button.info.light:hover{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.info.light.is-active,.hl-button.info.light:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.info.no-fill{color:var(--button-border-color)}.hl-button.info.no-fill.is-focus,.hl-button.info.no-fill.is-hover,.hl-button.info.no-fill:focus,.hl-button.info.no-fill:hover{color:var(--button-font-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.info.no-fill.is-active,.hl-button.info.no-fill:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.info.no-fill.light{border-color:transparent;background-color:transparent}.hl-button.info.no-fill.light.is-focus,.hl-button.info.no-fill.light.is-hover,.hl-button.info.no-fill.light:focus,.hl-button.info.no-fill.light:hover{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.info.no-fill.light.is-active,.hl-button.info.no-fill.light:active{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-checkbox.is-checked .hl-button.info,.hl-radio.is-checked .hl-button.info{--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--info-hover);--button-border-color-hover:var(--info-hover)}.hl-button.success{--button-font-color:var(--text-inverse);--button-bg-color:var(--success-bg);--button-border-color:var(--success);--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--success-hover);--button-border-color-hover:var(--success-hover);--button-font-color-active:var(--text-inverse);--button-bg-color-active:var(--success-active);--button-bg-color-light:var(--success-light);--button-border-color-active:var(--success-active)}.hl-button.success.light{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.success.light.is-focus,.hl-button.success.light.is-hover,.hl-button.success.light:focus,.hl-button.success.light:hover{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.success.light.is-active,.hl-button.success.light:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.success.no-fill{color:var(--button-border-color)}.hl-button.success.no-fill.is-focus,.hl-button.success.no-fill.is-hover,.hl-button.success.no-fill:focus,.hl-button.success.no-fill:hover{color:var(--button-font-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.success.no-fill.is-active,.hl-button.success.no-fill:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.success.no-fill.light{border-color:transparent;background-color:transparent}.hl-button.success.no-fill.light.is-focus,.hl-button.success.no-fill.light.is-hover,.hl-button.success.no-fill.light:focus,.hl-button.success.no-fill.light:hover{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.success.no-fill.light.is-active,.hl-button.success.no-fill.light:active{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-checkbox.is-checked .hl-button.success,.hl-radio.is-checked .hl-button.success{--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--success-hover);--button-border-color-hover:var(--success-hover)}.hl-button.warning{--button-font-color:var(--text-inverse);--button-bg-color:var(--warning-bg);--button-border-color:var(--warning);--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--warning-hover);--button-border-color-hover:var(--warning-hover);--button-font-color-active:var(--text-inverse);--button-bg-color-active:var(--warning-active);--button-bg-color-light:var(--warning-light);--button-border-color-active:var(--warning-active)}.hl-button.warning.light{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.warning.light.is-focus,.hl-button.warning.light.is-hover,.hl-button.warning.light:focus,.hl-button.warning.light:hover{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.warning.light.is-active,.hl-button.warning.light:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.warning.no-fill{color:var(--button-border-color)}.hl-button.warning.no-fill.is-focus,.hl-button.warning.no-fill.is-hover,.hl-button.warning.no-fill:focus,.hl-button.warning.no-fill:hover{color:var(--button-font-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.warning.no-fill.is-active,.hl-button.warning.no-fill:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.warning.no-fill.light{border-color:transparent;background-color:transparent}.hl-button.warning.no-fill.light.is-focus,.hl-button.warning.no-fill.light.is-hover,.hl-button.warning.no-fill.light:focus,.hl-button.warning.no-fill.light:hover{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.warning.no-fill.light.is-active,.hl-button.warning.no-fill.light:active{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-checkbox.is-checked .hl-button.warning,.hl-radio.is-checked .hl-button.warning{--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--warning-hover);--button-border-color-hover:var(--warning-hover)}.hl-button.danger{--button-font-color:var(--text-inverse);--button-bg-color:var(--danger-bg);--button-border-color:var(--danger);--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--danger-hover);--button-border-color-hover:var(--danger-hover);--button-font-color-active:var(--text-inverse);--button-bg-color-active:var(--danger-active);--button-bg-color-light:var(--danger-light);--button-border-color-active:var(--danger-active)}.hl-button.danger.light{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.danger.light.is-focus,.hl-button.danger.light.is-hover,.hl-button.danger.light:focus,.hl-button.danger.light:hover{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.danger.light.is-active,.hl-button.danger.light:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.danger.no-fill{color:var(--button-border-color)}.hl-button.danger.no-fill.is-focus,.hl-button.danger.no-fill.is-hover,.hl-button.danger.no-fill:focus,.hl-button.danger.no-fill:hover{color:var(--button-font-color-hover);background-color:var(--button-bg-color-hover)}.hl-button.danger.no-fill.is-active,.hl-button.danger.no-fill:active{color:var(--button-font-color-active);border-color:var(--button-border-color-active);background-color:var(--button-bg-color-active)}.hl-button.danger.no-fill.light{border-color:transparent;background-color:transparent}.hl-button.danger.no-fill.light.is-focus,.hl-button.danger.no-fill.light.is-hover,.hl-button.danger.no-fill.light:focus,.hl-button.danger.no-fill.light:hover{color:var(--button-border-color);border-color:var(--button-bg-color-light);background-color:var(--button-bg-color-light)}.hl-button.danger.no-fill.light.is-active,.hl-button.danger.no-fill.light:active{color:var(--button-font-color-hover);border-color:var(--button-border-color-hover);background-color:var(--button-bg-color-hover)}.hl-checkbox.is-checked .hl-button.danger,.hl-radio.is-checked .hl-button.danger{--button-font-color-hover:var(--text-inverse);--button-bg-color-hover:var(--danger-hover);--button-border-color-hover:var(--danger-hover)}.hl-button.sm{--button-radius:var(--radius-sm);--button-padding-x:8px;--button-padding-y:1px;--button-height:var(--form-sm);--button-font-size:12px;line-height:1.6666666667}.hl-button.sm .hl-icon,.hl-button.sm .hl-spinner{font-size:var(--font-md);width:var(--font-md);height:var(--font-md)}.hl-button.md{--button-radius:var(--radius-md);--button-padding-x:8px;--button-padding-y:4px;--button-height:var(--form-md);--button-font-size:14px;line-height:1.5714285714}.hl-button.md .hl-icon,.hl-button.md .hl-spinner{font-size:var(--font-lg);width:var(--font-lg);height:var(--font-lg)}.hl-button.lg{--button-radius:var(--radius-lg);--button-padding-x:12px;--button-padding-y:7px;--button-height:var(--form-lg);--button-font-size:16px;line-height:1.5}.hl-button.lg .hl-icon,.hl-button.lg .hl-spinner{font-size:var(--font-xl);width:var(--font-xl);height:var(--font-xl)}:root{--main-color:#36A4FF;--rgb-main-color:54,164,255;--shadow-color:62,78,106;--primary:#36A4FF;--primary-bg:#36A4FF;--primary-hover:#5eb6ff;--primary-active:#1d99ff;--primary-light:#ebf6ff;--success:#4CC09E;--success-bg:#4CC09E;--success-hover:#70cdb1;--success-active:#40b694;--success-light:#edf9f5;--danger:#FF4D4F;--danger-bg:#FF4D4F;--danger-hover:#ff7172;--danger-active:#ff3235;--danger-light:#ffeded;--warning:#FA8B16;--warning-bg:#FA8B16;--warning-hover:#fba245;--warning-active:#f58005;--warning-light:#fff3e8;--info:#4a72e5;--info-bg:#4a72e5;--info-hover:#6e8eea;--info-active:#3561e2;--info-light:#edf1fc;--rgb-primary:54,164,255;--rgb-success:76,192,158;--rgb-danger:255,77,79;--rgb-warning:250,139,22;--rgb-info:74,114,229;--rgb-bg-body:255,255,255;--rgb-bg-content:255,255,255;--rgb-bg-light:246,249,251;--rgb-bg-popup:255,255,255;--rgb-bg-element:255,255,255;--rgb-bg-hover:249,250,254;--rgb-bg-active:54,164,255;--rgb-bg-header:249,250,254;--rgb-bg-backdrop:0,0,0;--text-regular:#4B4B4B;--text-secondary:#8A8A8A;--text-light:#BDBDBD;--text-lightest:#CACFD6;--text-title:#202020;--text-link:var(--main-color);--text-hover:var(--main-color);--text-active:var(--main-color);--text-inverse:#FFFFFF;--bg-body:#ffffff;--bg-content:#FFFFFF;--bg-light:#F6F9FB;--bg-popup:#FFFFFF;--bg-element:#FFFFFF;--bg-hover:#F9FAFE;--bg-active:#36A4FF;--bg-header:#F9FAFE;--bg-backdrop:rgba(0, 0, 0, 0.3);--border-regular:#EDEDED;--border-light:#E7E7E7;--border-dark:#E7E7E7;--box-shadow-sm:0 2px 4px 0 rgba(var(--shadow-color, 62, 78, 106), 0.06);--box-shadow-md:0 4px 16px 0 rgba(var(--shadow-color, 62, 78, 106), 0.08);--box-shadow-lg:0 6px 24px rgba(var(--shadow-color, 62, 78, 106), 0.1);--box-shadow-xl:0 12px 40px 0 rgba(var(--shadow-color, 62, 78, 106), 0.24);--primary-light-5:#ebf9ff;--primary-light-4:#c7edff;--primary-light-3:#a3deff;--primary-light-2:#7ecdff;--primary-light-1:#5abaff;--primary-dark-1:#0b88ff;--primary-dark-2:#006bde;--primary-dark-3:#0050b3;--primary-dark-4:#003888;--primary-dark-5:#00235d;--success-light-5:#ecfaf3;--success-light-4:#c9f1e0;--success-light-3:#a8e6ce;--success-light-2:#88dbbd;--success-light-1:#6acead;--success-dark-1:#33b392;--success-dark-2:#269b81;--success-dark-3:#168570;--success-dark-4:#0b6b5c;--success-dark-5:#034d44;--danger-light-5:#ffedf0;--danger-light-4:#ffcdd4;--danger-light-3:#ffadb6;--danger-light-2:#ff8d96;--danger-light-1:#ff6d74;--danger-dark-1:#ff231f;--danger-dark-2:#ef0d00;--danger-dark-3:#c11100;--danger-dark-4:#921200;--danger-dark-5:#640f00;--warning-light-5:#fff0e8;--warning-light-4:#fed6bd;--warning-light-3:#fdbf93;--warning-light-2:#fcab6a;--warning-light-1:#fb9a40;--warning-dark-1:#e67f04;--warning-dark-2:#c17103;--warning-dark-3:#9c6002;--warning-dark-4:#774d01;--warning-dark-5:#513700;--info-light-5:#ecf3fd;--info-light-4:#cbddf9;--info-light-3:#aac5f5;--info-light-2:#89abf0;--info-light-1:#6a8feb;--info-dark-1:#204ce4;--info-dark-2:#1536c6;--info-dark-3:#0c24a4;--info-dark-4:#06157f;--info-dark-5:#020a59;--form-bg-color:var(--bg-element);--form-bg-color-fill:#f5f8fa;--form-border-color:var(--border-dark);--form-disabled-border-color:var(--border-light);--form-disabled-bg-color:var(--bg-light);--form-disabled-font-color:var(--text-light);--form-icon-color:var(--text-regular);--form-shadow-color:var(--rgb-primary);--hl-button-font-color:var(--text-regular);--hl-button-font-color-hover:var(--primary);--hl-button-font-color-active:var(--primary);--hl-button-bg-color:var(--bg-element);--hl-button-bg-color-hover:var(--bg-element);--hl-button-bg-color-active:var(--bg-element);--hl-button-border-color:var(--form-border-color);--hl-button-border-color-hover:#c3e4ff;--hl-button-border-color-active:var(--primary);--hl-menu-icon-color:#5281E9;--hl-menu-icon-color-hover:currentColor;--hl-menu-icon-color-active:#ffffff;--hl-menu-font-color:var(--text-regular);--hl-menu-font-color-hover:var(--text-secondary);--hl-menu-font-color-active:#ffffff;--hl-menu-bg-color:#ffffff;--hl-menu-bg-hover:#F8FAFF;--hl-menu-bg-active:#9EAECD;--hl-menu-group-title-color:rgba(#000, 0.2);--hl-menu-child-bg-color:#ffffff;--hl-menu-dropdown-shadow:var(--box-shadow-md)}.hl-spinner{--spinner-width:24px;--spinner-height:24px;--spinner-duration:2s;--spinner-color:var(--text-regular);position:relative;display:inline-flex;align-items:center;justify-content:center;font-style:normal;vertical-align:middle;width:var(--spinner-width);height:var(--spinner-height);color:var(--spinner-color)}.hl-spinner.around-right .spinner-wrap{-webkit-animation:spinner-rotate var(--spinner-duration) linear infinite;animation:spinner-rotate var(--spinner-duration) linear infinite}.hl-spinner.around-left .spinner-wrap{-webkit-animation:spinner-rotate var(--spinner-duration) linear infinite;animation:spinner-rotate var(--spinner-duration) linear infinite;animation-direction:reverse}.hl-spinner.none .spinner-wrap{-webkit-animation:unset;animation:unset}.hl-spinner.is-finish{-webkit-animation:unset;animation:unset}.hl-spinner.is-finish .spinner-wrap{-webkit-animation:spinner-rotate 2s linear infinite;animation:spinner-rotate 2s linear infinite;visibility:hidden;opacity:0}.hl-spinner.is-finish .show-result{visibility:visible;opacity:1;transform:scale(1)}.hl-spinner .spinner-wrap{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:1;text-align:center;transition:.3s}.hl-spinner .spinner-wrap .hl-icon{width:100%;height:100%}.hl-spinner .show-result{position:absolute;display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:100%;visibility:hidden;opacity:0;white-space:nowrap;transition:opacity .6s,visibility .6s}.hl-spinner .show-result .hl-icon{width:100%;height:100%}.hl-spinner svg{width:100%;height:100%;display:block}.hl-spinner .tail circle{fill:none;stroke:currentColor;stroke-dasharray:90 120;stroke-dashoffset:0;stroke-width:4px;stroke-linecap:round;-webkit-animation:icon-loading-dash 1.5s ease-in-out infinite;animation:icon-loading-dash 1.5s ease-in-out infinite}@-webkit-keyframes icon-loading-dash{0%{stroke-dasharray:1 200;stroke-dashoffset:0}50%{stroke-dasharray:90 150;stroke-dashoffset:-40px}100%{stroke-dasharray:90 150;stroke-dashoffset:-120px}}@keyframes icon-loading-dash{0%{stroke-dasharray:1 200;stroke-dashoffset:0}50%{stroke-dasharray:90 150;stroke-dashoffset:-40px}100%{stroke-dasharray:90 150;stroke-dashoffset:-120px}}@-webkit-keyframes spinner-rotate{to{transform:rotate(1turn)}}@keyframes spinner-rotate{to{transform:rotate(1turn)}}.hl-spinner.xxxs{--spinner-width:12px;--spinner-height:12px}.hl-spinner.xxs{--spinner-width:14px;--spinner-height:14px}.hl-spinner.xs{--spinner-width:16px;--spinner-height:16px}.hl-spinner.sm{--spinner-width:18px;--spinner-height:18px}.hl-spinner.md{--spinner-width:20px;--spinner-height:20px}.hl-spinner.lg{--spinner-width:24px;--spinner-height:24px}.hl-spinner.xl{--spinner-width:28px;--spinner-height:28px}.hl-spinner.xxl{--spinner-width:32px;--spinner-height:32px}.hl-spinner.xxxl{--spinner-width:36px;--spinner-height:36px}:root{--main-color:#36A4FF;--rgb-main-color:54,164,255;--shadow-color:62,78,106;--primary:#36A4FF;--primary-bg:#36A4FF;--primary-hover:#5eb6ff;--primary-active:#1d99ff;--primary-light:#ebf6ff;--success:#4CC09E;--success-bg:#4CC09E;--success-hover:#70cdb1;--success-active:#40b694;--success-light:#edf9f5;--danger:#FF4D4F;--danger-bg:#FF4D4F;--danger-hover:#ff7172;--danger-active:#ff3235;--danger-light:#ffeded;--warning:#FA8B16;--warning-bg:#FA8B16;--warning-hover:#fba245;--warning-active:#f58005;--warning-light:#fff3e8;--info:#4a72e5;--info-bg:#4a72e5;--info-hover:#6e8eea;--info-active:#3561e2;--info-light:#edf1fc;--rgb-primary:54,164,255;--rgb-success:76,192,158;--rgb-danger:255,77,79;--rgb-warning:250,139,22;--rgb-info:74,114,229;--rgb-bg-body:255,255,255;--rgb-bg-content:255,255,255;--rgb-bg-light:246,249,251;--rgb-bg-popup:255,255,255;--rgb-bg-element:255,255,255;--rgb-bg-hover:249,250,254;--rgb-bg-active:54,164,255;--rgb-bg-header:249,250,254;--rgb-bg-backdrop:0,0,0;--text-regular:#4B4B4B;--text-secondary:#8A8A8A;--text-light:#BDBDBD;--text-lightest:#CACFD6;--text-title:#202020;--text-link:var(--main-color);--text-hover:var(--main-color);--text-active:var(--main-color);--text-inverse:#FFFFFF;--bg-body:#ffffff;--bg-content:#FFFFFF;--bg-light:#F6F9FB;--bg-popup:#FFFFFF;--bg-element:#FFFFFF;--bg-hover:#F9FAFE;--bg-active:#36A4FF;--bg-header:#F9FAFE;--bg-backdrop:rgba(0, 0, 0, 0.3);--border-regular:#EDEDED;--border-light:#E7E7E7;--border-dark:#E7E7E7;--box-shadow-sm:0 2px 4px 0 rgba(var(--shadow-color, 62, 78, 106), 0.06);--box-shadow-md:0 4px 16px 0 rgba(var(--shadow-color, 62, 78, 106), 0.08);--box-shadow-lg:0 6px 24px rgba(var(--shadow-color, 62, 78, 106), 0.1);--box-shadow-xl:0 12px 40px 0 rgba(var(--shadow-color, 62, 78, 106), 0.24);--primary-light-5:#ebf9ff;--primary-light-4:#c7edff;--primary-light-3:#a3deff;--primary-light-2:#7ecdff;--primary-light-1:#5abaff;--primary-dark-1:#0b88ff;--primary-dark-2:#006bde;--primary-dark-3:#0050b3;--primary-dark-4:#003888;--primary-dark-5:#00235d;--success-light-5:#ecfaf3;--success-light-4:#c9f1e0;--success-light-3:#a8e6ce;--success-light-2:#88dbbd;--success-light-1:#6acead;--success-dark-1:#33b392;--success-dark-2:#269b81;--success-dark-3:#168570;--success-dark-4:#0b6b5c;--success-dark-5:#034d44;--danger-light-5:#ffedf0;--danger-light-4:#ffcdd4;--danger-light-3:#ffadb6;--danger-light-2:#ff8d96;--danger-light-1:#ff6d74;--danger-dark-1:#ff231f;--danger-dark-2:#ef0d00;--danger-dark-3:#c11100;--danger-dark-4:#921200;--danger-dark-5:#640f00;--warning-light-5:#fff0e8;--warning-light-4:#fed6bd;--warning-light-3:#fdbf93;--warning-light-2:#fcab6a;--warning-light-1:#fb9a40;--warning-dark-1:#e67f04;--warning-dark-2:#c17103;--warning-dark-3:#9c6002;--warning-dark-4:#774d01;--warning-dark-5:#513700;--info-light-5:#ecf3fd;--info-light-4:#cbddf9;--info-light-3:#aac5f5;--info-light-2:#89abf0;--info-light-1:#6a8feb;--info-dark-1:#204ce4;--info-dark-2:#1536c6;--info-dark-3:#0c24a4;--info-dark-4:#06157f;--info-dark-5:#020a59;--form-bg-color:var(--bg-element);--form-bg-color-fill:#f5f8fa;--form-border-color:var(--border-dark);--form-disabled-border-color:var(--border-light);--form-disabled-bg-color:var(--bg-light);--form-disabled-font-color:var(--text-light);--form-icon-color:var(--text-regular);--form-shadow-color:var(--rgb-primary);--hl-button-font-color:var(--text-regular);--hl-button-font-color-hover:var(--primary);--hl-button-font-color-active:var(--primary);--hl-button-bg-color:var(--bg-element);--hl-button-bg-color-hover:var(--bg-element);--hl-button-bg-color-active:var(--bg-element);--hl-button-border-color:var(--form-border-color);--hl-button-border-color-hover:#c3e4ff;--hl-button-border-color-active:var(--primary);--hl-menu-icon-color:#5281E9;--hl-menu-icon-color-hover:currentColor;--hl-menu-icon-color-active:#ffffff;--hl-menu-font-color:var(--text-regular);--hl-menu-font-color-hover:var(--text-secondary);--hl-menu-font-color-active:#ffffff;--hl-menu-bg-color:#ffffff;--hl-menu-bg-hover:#F8FAFF;--hl-menu-bg-active:#9EAECD;--hl-menu-group-title-color:rgba(#000, 0.2);--hl-menu-child-bg-color:#ffffff;--hl-menu-dropdown-shadow:var(--box-shadow-md)}.hl-icon{--icon-radius:var(--radius-lg);--icon-size:16px;--icon-bg-color:var(--bg-hover);display:inline-flex;position:relative;align-items:center;justify-content:center;vertical-align:middle;font-style:normal;width:var(--icon-size);height:var(--icon-size);flex-shrink:0;flex-grow:0;color:var(--icon-color)}.hl-icon.disabled{color:var(--form-disabled-font-color)}.hl-icon .icon-system{--stroke-width:2;--fill-opacity:0}.hl-icon .icon-system g{fill-opacity:var(--fill-opacity);stroke-width:var(--stroke-width);stroke-linecap:round;stroke-linejoin:round;fill-rule:evenodd;fill:currentColor}.hl-icon svg{width:100%;height:100%;display:block;color:currentColor}.hl-icon.fill{display:inline-flex;align-items:center;justify-content:center;width:calc(var(--icon-size) * 2);height:calc(var(--icon-size) * 2);background-color:var(--icon-bg-color)}.hl-icon.fill.radius{border-radius:var(--icon-radius)}.hl-icon.fill.round{border-radius:var(--radius-round)}.hl-icon.fill svg{width:60%;height:60%}.hl-icon.transition:hover path{stroke-dasharray:100;stroke-dashoffset:100;-webkit-animation:dash 2s ease-out forwards;animation:dash 2s ease-out forwards}@-webkit-keyframes dash{to{stroke-dashoffset:0}}@keyframes dash{to{stroke-dashoffset:0}}.hl-icon.primary{--icon-color:var(--primary-bg);--icon-start-color:#FFFFFF}.hl-icon.primary.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--primary-bg)}.hl-icon.primary.fill.light{--icon-color:var(--primary-bg);--icon-bg-color:var(--primary-light)}.hl-icon.info{--icon-color:var(--info-bg);--icon-start-color:#FFFFFF}.hl-icon.info.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--info-bg)}.hl-icon.info.fill.light{--icon-color:var(--info-bg);--icon-bg-color:var(--info-light)}.hl-icon.success{--icon-color:var(--success-bg);--icon-start-color:#FFFFFF}.hl-icon.success.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--success-bg)}.hl-icon.success.fill.light{--icon-color:var(--success-bg);--icon-bg-color:var(--success-light)}.hl-icon.warning{--icon-color:var(--warning-bg);--icon-start-color:#FFFFFF}.hl-icon.warning.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--warning-bg)}.hl-icon.warning.fill.light{--icon-color:var(--warning-bg);--icon-bg-color:var(--warning-light)}.hl-icon.danger{--icon-color:var(--danger-bg);--icon-start-color:#FFFFFF}.hl-icon.danger.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--danger-bg)}.hl-icon.danger.fill.light{--icon-color:var(--danger-bg);--icon-bg-color:var(--danger-light)}.hl-icon.xxxs{--icon-size:12px;--icon-radius:var(--radius-sm)}.hl-icon.xxs{--icon-size:14px;--icon-radius:var(--radius-sm)}.hl-icon.xs{--icon-size:16px;--icon-radius:var(--radius-sm)}.hl-icon.sm{--icon-size:18px;--icon-radius:var(--radius-md)}.hl-icon.md{--icon-size:20px;--icon-radius:var(--radius-md)}.hl-icon.lg{--icon-size:24px;--icon-radius:var(--radius-lg)}.hl-icon.xl{--icon-size:28px;--icon-radius:var(--radius-lg)}.hl-icon.xxl{--icon-size:32px;--icon-radius:var(--radius-xl)}.hl-icon.xxxl{--icon-size:36px;--icon-radius:var(--radius-xl)}:root{--main-color:#36A4FF;--rgb-main-color:54,164,255;--shadow-color:62,78,106;--primary:#36A4FF;--primary-bg:#36A4FF;--primary-hover:#5eb6ff;--primary-active:#1d99ff;--primary-light:#ebf6ff;--success:#4CC09E;--success-bg:#4CC09E;--success-hover:#70cdb1;--success-active:#40b694;--success-light:#edf9f5;--danger:#FF4D4F;--danger-bg:#FF4D4F;--danger-hover:#ff7172;--danger-active:#ff3235;--danger-light:#ffeded;--warning:#FA8B16;--warning-bg:#FA8B16;--warning-hover:#fba245;--warning-active:#f58005;--warning-light:#fff3e8;--info:#4a72e5;--info-bg:#4a72e5;--info-hover:#6e8eea;--info-active:#3561e2;--info-light:#edf1fc;--rgb-primary:54,164,255;--rgb-success:76,192,158;--rgb-danger:255,77,79;--rgb-warning:250,139,22;--rgb-info:74,114,229;--rgb-bg-body:255,255,255;--rgb-bg-content:255,255,255;--rgb-bg-light:246,249,251;--rgb-bg-popup:255,255,255;--rgb-bg-element:255,255,255;--rgb-bg-hover:249,250,254;--rgb-bg-active:54,164,255;--rgb-bg-header:249,250,254;--rgb-bg-backdrop:0,0,0;--text-regular:#4B4B4B;--text-secondary:#8A8A8A;--text-light:#BDBDBD;--text-lightest:#CACFD6;--text-title:#202020;--text-link:var(--main-color);--text-hover:var(--main-color);--text-active:var(--main-color);--text-inverse:#FFFFFF;--bg-body:#ffffff;--bg-content:#FFFFFF;--bg-light:#F6F9FB;--bg-popup:#FFFFFF;--bg-element:#FFFFFF;--bg-hover:#F9FAFE;--bg-active:#36A4FF;--bg-header:#F9FAFE;--bg-backdrop:rgba(0, 0, 0, 0.3);--border-regular:#EDEDED;--border-light:#E7E7E7;--border-dark:#E7E7E7;--box-shadow-sm:0 2px 4px 0 rgba(var(--shadow-color, 62, 78, 106), 0.06);--box-shadow-md:0 4px 16px 0 rgba(var(--shadow-color, 62, 78, 106), 0.08);--box-shadow-lg:0 6px 24px rgba(var(--shadow-color, 62, 78, 106), 0.1);--box-shadow-xl:0 12px 40px 0 rgba(var(--shadow-color, 62, 78, 106), 0.24);--primary-light-5:#ebf9ff;--primary-light-4:#c7edff;--primary-light-3:#a3deff;--primary-light-2:#7ecdff;--primary-light-1:#5abaff;--primary-dark-1:#0b88ff;--primary-dark-2:#006bde;--primary-dark-3:#0050b3;--primary-dark-4:#003888;--primary-dark-5:#00235d;--success-light-5:#ecfaf3;--success-light-4:#c9f1e0;--success-light-3:#a8e6ce;--success-light-2:#88dbbd;--success-light-1:#6acead;--success-dark-1:#33b392;--success-dark-2:#269b81;--success-dark-3:#168570;--success-dark-4:#0b6b5c;--success-dark-5:#034d44;--danger-light-5:#ffedf0;--danger-light-4:#ffcdd4;--danger-light-3:#ffadb6;--danger-light-2:#ff8d96;--danger-light-1:#ff6d74;--danger-dark-1:#ff231f;--danger-dark-2:#ef0d00;--danger-dark-3:#c11100;--danger-dark-4:#921200;--danger-dark-5:#640f00;--warning-light-5:#fff0e8;--warning-light-4:#fed6bd;--warning-light-3:#fdbf93;--warning-light-2:#fcab6a;--warning-light-1:#fb9a40;--warning-dark-1:#e67f04;--warning-dark-2:#c17103;--warning-dark-3:#9c6002;--warning-dark-4:#774d01;--warning-dark-5:#513700;--info-light-5:#ecf3fd;--info-light-4:#cbddf9;--info-light-3:#aac5f5;--info-light-2:#89abf0;--info-light-1:#6a8feb;--info-dark-1:#204ce4;--info-dark-2:#1536c6;--info-dark-3:#0c24a4;--info-dark-4:#06157f;--info-dark-5:#020a59;--form-bg-color:var(--bg-element);--form-bg-color-fill:#f5f8fa;--form-border-color:var(--border-dark);--form-disabled-border-color:var(--border-light);--form-disabled-bg-color:var(--bg-light);--form-disabled-font-color:var(--text-light);--form-icon-color:var(--text-regular);--form-shadow-color:var(--rgb-primary);--hl-button-font-color:var(--text-regular);--hl-button-font-color-hover:var(--primary);--hl-button-font-color-active:var(--primary);--hl-button-bg-color:var(--bg-element);--hl-button-bg-color-hover:var(--bg-element);--hl-button-bg-color-active:var(--bg-element);--hl-button-border-color:var(--form-border-color);--hl-button-border-color-hover:#c3e4ff;--hl-button-border-color-active:var(--primary);--hl-menu-icon-color:#5281E9;--hl-menu-icon-color-hover:currentColor;--hl-menu-icon-color-active:#ffffff;--hl-menu-font-color:var(--text-regular);--hl-menu-font-color-hover:var(--text-secondary);--hl-menu-font-color-active:#ffffff;--hl-menu-bg-color:#ffffff;--hl-menu-bg-hover:#F8FAFF;--hl-menu-bg-active:#9EAECD;--hl-menu-group-title-color:rgba(#000, 0.2);--hl-menu-child-bg-color:#ffffff;--hl-menu-dropdown-shadow:var(--box-shadow-md)}.hl-icon{--icon-radius:var(--radius-lg);--icon-size:16px;--icon-bg-color:var(--bg-hover);display:inline-flex;position:relative;align-items:center;justify-content:center;vertical-align:middle;font-style:normal;width:var(--icon-size);height:var(--icon-size);flex-shrink:0;flex-grow:0;color:var(--icon-color)}.hl-icon.disabled{color:var(--form-disabled-font-color)}.hl-icon .icon-system{--stroke-width:2;--fill-opacity:0}.hl-icon .icon-system g{fill-opacity:var(--fill-opacity);stroke-width:var(--stroke-width);stroke-linecap:round;stroke-linejoin:round;fill-rule:evenodd;fill:currentColor}.hl-icon svg{width:100%;height:100%;display:block;color:currentColor}.hl-icon.fill{display:inline-flex;align-items:center;justify-content:center;width:calc(var(--icon-size) * 2);height:calc(var(--icon-size) * 2);background-color:var(--icon-bg-color)}.hl-icon.fill.radius{border-radius:var(--icon-radius)}.hl-icon.fill.round{border-radius:var(--radius-round)}.hl-icon.fill svg{width:60%;height:60%}.hl-icon.transition:hover path{stroke-dasharray:100;stroke-dashoffset:100;-webkit-animation:dash 2s ease-out forwards;animation:dash 2s ease-out forwards}@keyframes dash{to{stroke-dashoffset:0}}.hl-icon.primary{--icon-color:var(--primary-bg);--icon-start-color:#FFFFFF}.hl-icon.primary.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--primary-bg)}.hl-icon.primary.fill.light{--icon-color:var(--primary-bg);--icon-bg-color:var(--primary-light)}.hl-icon.info{--icon-color:var(--info-bg);--icon-start-color:#FFFFFF}.hl-icon.info.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--info-bg)}.hl-icon.info.fill.light{--icon-color:var(--info-bg);--icon-bg-color:var(--info-light)}.hl-icon.success{--icon-color:var(--success-bg);--icon-start-color:#FFFFFF}.hl-icon.success.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--success-bg)}.hl-icon.success.fill.light{--icon-color:var(--success-bg);--icon-bg-color:var(--success-light)}.hl-icon.warning{--icon-color:var(--warning-bg);--icon-start-color:#FFFFFF}.hl-icon.warning.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--warning-bg)}.hl-icon.warning.fill.light{--icon-color:var(--warning-bg);--icon-bg-color:var(--warning-light)}.hl-icon.danger{--icon-color:var(--danger-bg);--icon-start-color:#FFFFFF}.hl-icon.danger.fill{--icon-color:var(--text-inverse);--icon-bg-color:var(--danger-bg)}.hl-icon.danger.fill.light{--icon-color:var(--danger-bg);--icon-bg-color:var(--danger-light)}.hl-icon.xxxs{--icon-size:12px;--icon-radius:var(--radius-sm)}.hl-icon.xxs{--icon-size:14px;--icon-radius:var(--radius-sm)}.hl-icon.xs{--icon-size:16px;--icon-radius:var(--radius-sm)}.hl-icon.sm{--icon-size:18px;--icon-radius:var(--radius-md)}.hl-icon.md{--icon-size:20px;--icon-radius:var(--radius-md)}.hl-icon.lg{--icon-size:24px;--icon-radius:var(--radius-lg)}.hl-icon.xl{--icon-size:28px;--icon-radius:var(--radius-lg)}.hl-icon.xxl{--icon-size:32px;--icon-radius:var(--radius-xl)}.hl-icon.xxxl{--icon-size:36px;--icon-radius:var(--radius-xl)}