@import url("/app/modules/module_page_help/assets/css/editor/tui-color-picker.min.css");
@import url("/app/modules/module_page_help/assets/css/editor/toastui-editor.min.css");
@import url("/app/modules/module_page_help/assets/css/editor/toastui-editor-dark.min.css");
@import url("/app/modules/module_page_help/assets/css/editor/toastui-editor-plugin-color-syntax.min.css");
@import url("/app/modules/module_page_help/assets/css/editor/toastui-editor-viewer.min.css");

.rules_menu {
  display: flex;
  color: var(--text-custom);
  padding: 0 7px 0 15px;
  height: 45px;
  border-radius: var(--br-8);
  font-size: var(--font-size-m);
  font-weight: var(--font-weight-6);
  background: var(--button);
  cursor: pointer;
  transition: all 0.2s;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  position: relative;
  justify-content: space-between;
  overflow: hidden;
}

.rules_menu:hover {
  color: var(--text-default);
  background: var(--button-hover);
}

.rules_menu:hover svg {
  fill: currentColor;
}

.rules_block {
  color: var(--text-default);
  font-weight: var(--font-weight-4);
  font-size: var(--font-size-m);
  padding: 10px 10px 0;
  width: 100%;
  position: relative;
}

.rules_block > a {
  display: flex;
  color: var(--span);
  font-weight: var(--font-weight-6);
  font-size: var(--font-size-default);
  text-align: center;
  justify-content: center;
}

.rules_block img {
  border-radius: var(--br-16);
  width: auto;
  height: auto;
  margin-bottom: 20px;
}

.rules_text {
  color: var(--text-default);
  font-weight: var(--font-weight-4);
  font-size: var(--font-size-m);
  margin-left: 10px;
  white-space: pre-wrap;
}

.rules_text_punishment {
  color: var(--red);
  font-weight: var(--font-weight-4);
  font-size: var(--font-size-m);
}

.rules_warning {
  color: var(--span);
  font-weight: bold;
  font-size: var(--font-size-m);
}

.rules_card_header {
  float: left;
  margin: 5px 0px 0px 10px;
}

.rules_card {
  background: var(--card);
  border-radius: var(--br-16);
  padding: 20px;
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-direction: column;
}

.rules_card_block {
  padding: 10px 0 0 0;
}

.rules_sticky {
  position: sticky;
  height: fit-content;
  top: .6rem;
}

.rules_chapter {
  font-weight: var(--font-weight-7);
  font-family: var(--font-family-1);
  color: var(--text-custom);
  margin: 5px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
}

.rules_number {
  color: var(--text-custom);
}

.rules_title {
  font-weight: var(--font-weight-7);
  font-family: var(--font-family-1);
}

.time_short_text,
.time_long_text {
  font-weight: var(--font-weight-4);
  font-size: var(--font-size-s);
  color: var(--text-custom);
  display: flex;
  align-items: center;
  gap: 5px;
  opacity: 0.5;
  justify-content: flex-end;
}

.rules_chapter svg {
  height: 15px;
  fill: var(--text-custom);
}

.rules_menu .svg {
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 10px;
}

.rules_menu svg {
  fill: var(--text-custom);
  transition: all 0.25s;
}

.rules_card_left {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.time_short_text svg,
.time_long_text svg {
  height: 13px;
  fill: var(--text-custom);
}

@media (max-width: 575.98px) {
  .time_short_text,
  .time_long_text {
    display: none;
  }
}

@media (max-width: 768px) {
  .rules_card {
    display: block;
  }

  .rules_choose {
    display: none;
  }

  .rules_card_left {
    padding: 0;
    border: none;
    min-width: auto;
  }

  .rules_sticky {
    position: static;
    height: auto;
    top: 25px;
  }
}

.rules_margin {
  width: 100%;
}

.rules_text a {
  text-decoration: underline;
}

#help_content p {
  color: var(--text-custom);
  font-size: var(--font-size-m);
}

#help_content h2 {
  font-weight: var(--font-weight-7);
  font-family: var(--font-family-1);
  border-bottom: 0;
  color: var(--text-default);
  margin: 14px 0;
}

.help_buttons {
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  gap: 5px;
  justify-content: flex-end;
  align-items: center;
}

.help_buttons-2 {
  display: flex;
  gap: 5px;
  justify-content: flex-end;
  align-items: center;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-13px);
  transition: all 0.25s;
  visibility: hidden;
}

.help_accetp_buttons {
  padding-top: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#content_form {
  width: 100% !important;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 10px;
}

.add_content {
  position: absolute;
  right: 20px;
  display: flex;
  width: 26px;
  height: 26px;
  align-items: center;
  justify-content: center;
  background: var(--button);
  border-radius: var(--br-8);
}

.edit_content,
.delete_content {
  display: flex;
  width: 30px;
  height: 30px;
  align-items: center;
  justify-content: center;
  background: var(--button);
  border: 1px solid var(--transparent-10-w);
  border-radius: var(--br-8);
  cursor: pointer;
  transition: all 0.25s;
}

.rules_menu:hover .delete_content svg,
.help_active:hover .delete_content svg,
.rules_menu .delete_content svg,
.help_active .delete_content svg {
  fill: var(--red);
}

.rules_menu:hover .edit_content svg,
.help_active:hover .edit_content svg,
.rules_menu .edit_content svg,
.help_active .edit_content svg {
  fill: var(--text-custom);
}

.add_content svg {
  display: flex;
  width: 9px;
  height: auto;
  fill: var(--red);
  transition: var(--transition-duration);
}

.delete_content svg {
  display: flex;
  width: 9px;
  height: auto;
  fill: var(--red);
  transition: var(--transition-duration);
}

.edit_content svg {
  display: flex;
  width: 9px;
  height: auto;
  fill: var(--text-custom);
  transition: var(--transition-duration);
}

.category-content {
  gap: 10px;
  display: flex;
  flex-direction: column;
}

.rules_menu_cat {
  display: flex;
  color: var(--text-custom);
  padding: 7px 18px;
  border-radius: var(--br-6);
  font-size: var(--font-size-m);
  cursor: pointer;
  transition: var(--transition-duration);
  flex-direction: row;
  align-items: center;
  gap: 10px;
  width: 100%;
  background: var(--transparent-2-w);
  opacity: 0.5;
  border: 1px solid var(--transparent-5-w);
}

.rules_menu_cat:hover {
  color: var(--text-default);
  opacity: 1;
}

.rules_menu_cat:hover svg {
  fill: var(--text-default);
  opacity: 1;
}

.rules_menu_cat .svg {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}

.rules_menu_cat svg {
  height: 13px;
  fill: var(--text-custom);
  transition: 0.25s;
}

.add_category {
  margin-top: 8px;
}

.help_menu-block {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}
.help_menu-block .help_svg {
  height: 13px;
  width: auto;
  fill: var(--text-custom);
}

.help_menu-block:hover .help_svg {
  opacity: 0.2;
}

.help_svg {
  margin-left: 16px;
  margin-top: -5px;
  fill: var(--text-default) !important;
  opacity: 0.05;
  transition: 0.25s;
}

.help_active {
  background: var(--button-hover);
  color: var(--text-default);
  opacity: 1;
}

.help_active_small {
  border: 1px solid rgb(152 158 202 / 10%);
  color: var(--text-default);
  background: var(--span);
  opacity: 1;
}

.help_active svg {
  opacity: 1 !important;
  transition: var(--transition-duration);
  fill: currentColor;
}

.help_active_small svg {
  opacity: 1 !important;
  transition: var(--transition-duration);
  fill: var(--text-default);
}

.help_dropdown {
  display: none;
  flex-direction: column;
  gap: 3px;
}

.toastui-editor-contents {
  font-family: var(--font-family-2);
  font-size: var(--font-size-m);
  margin: 0;
  padding: 0;
  z-index: 20;
}

.toastui-editor-contents ul > li:before {
  background-color: var(--text-custom);
  margin-left: -20px;
  margin-top: 9px;
}

.toastui-editor-contents code {
  background-color: rgb(48 36 35);
  color: #e2645e;
  padding: 3px 6px;
  border-radius: var(--br-4);
  font-family: inherit;
  font-weight: var(--font-weight-4);
  font-size: var(--font-size-m);
}

.toastui-editor-contents a {
  color: var(--span);
  text-decoration: none;
  transition: 0.25s;
}

.toastui-editor-contents a:hover {
  color: var(--span);
  text-decoration: underline;
}

.toastui-editor-contents dir,
.toastui-editor-contents menu,
.toastui-editor-contents ol,
.toastui-editor-contents ul {
  color: #222;
  display: block;
  list-style-type: none;
  margin: 0 0 10px 0;
  padding-left: 24px;
}

.toastui-editor-contents h1 {
  border-bottom: none;
  font-size: var(--font-size-5xl);
  line-height: 28px;
  margin: 15px 0;
  padding-bottom: 7px;
}

.toastui-editor-contents h1,
.toastui-editor-contents h2,
.toastui-editor-contents h3,
.toastui-editor-contents h4,
.toastui-editor-contents h5,
.toastui-editor-contents h6 {
  color: var(--text-default);
  font-weight: var(--font-weight-7);
}

.rules_menu:hover .help_buttons-2 {
  pointer-events: all;
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
}

.toastui-editor-defaultUI {
  border: 1px solid var(--transparent-5-w);
  border-radius: var(--br-12);
  position: relative;
}

.toastui-editor-dark.toastui-editor-defaultUI {
  border-color: var(--transparent-5-w);
  color: var(--text-default);
}

.toastui-editor-dark .toastui-editor-defaultUI-toolbar {
  background-color: var(--transparent-2-w);
  border-bottom-color: var(--transparent-5-w);
}

.toastui-editor-dark .toastui-editor-md-container,
.toastui-editor-dark .toastui-editor-ww-container {
  background-color: var(--input-form);
}

.toastui-editor-contents blockquote {
  border-left: 3px solid var(--transparent-5-w);
  margin: 14px 0;
  padding: 8px 16px;
  background: linear-gradient(89deg, rgb(255 255 255 / 5%), var(--transparent-2-w));
  border-radius: var(--br-3) 8px 8px 3px;
}

.toastui-editor-contents blockquote p {
  color: var(--text-custom) !important;
}

.toastui-editor-contents hr {
  border-top: 1px solid var(--grey);
  margin: 16px 0;
}

.toastui-editor-contents table td,
.toastui-editor-contents table th {
  border: 1px solid var(--transparent-2-w);
  background: var(--input-form);
}

.toastui-editor-contents table th {
  background-color: var(--transparent-5-w);
  font-weight: var(--font-weight-4);
}

.toastui-editor-contents table {
  border: 1px solid var(--grey);
  border-radius: var(--br-8);
  overflow: hidden;
  width: 100%;
}

.toastui-editor-contents ol > li:before {
  color: var(--text-custom);
  opacity: 0.5;
}

.toastui-editor-defaultUI-toolbar {
  border-radius: var(--br-12) 12px 0 0;
}

@media (min-width: 769px) {
  .popup_modal_content {
    overflow: visible;
  }
}

.help_access_buttons {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  pointer-events: none;
  position: absolute;
  right: 30px;
  margin-top: -40px;
}

.access_list:hover .help_access_buttons {
  pointer-events: all;
}

.delete_access {
  display: flex;
  width: 30px;
  height: 30px;
  align-items: center;
  justify-content: center;
  background: var(--card);
  border: 1px solid var(--bg-table);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.25s;
}

.delete_access svg {
  display: flex;
  width: 9px;
  height: auto;
  fill: var(--red);
  transition: 0.3s;
}

.h3_help {
  color: var(--text-default);
  font-size: 16px;
  font-weight: 700;
}

.access_list {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
/* NEXUS Help redesign */
.nexus-help-page{--help-accent:#5b8cff;--help-accent-2:#7b61ff;--help-surface:rgba(17,21,31,.82);--help-border:rgba(255,255,255,.08);position:relative}
.nexus-help-page button,.nexus-help-page input{font:inherit}
.nexus-help-hero{position:relative;overflow:hidden;border:1px solid var(--help-border);border-radius:20px;background:linear-gradient(135deg,rgba(17,23,36,.96),rgba(11,14,22,.94));box-shadow:0 18px 55px rgba(0,0,0,.22);margin-bottom:22px}
.nexus-help-hero__content{position:relative;z-index:2;padding:42px 42px 38px;max-width:900px}
.nexus-help-hero__glow{position:absolute;border-radius:50%;filter:blur(30px);opacity:.22;pointer-events:none}.nexus-help-hero__glow--one{width:320px;height:320px;right:-70px;top:-150px;background:#4d7cff}.nexus-help-hero__glow--two{width:240px;height:240px;right:180px;bottom:-190px;background:#7b61ff}
.nexus-help-eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--span);font-size:12px;text-transform:uppercase;letter-spacing:.14em;font-weight:700}.nexus-help-eyebrow>span{width:7px;height:7px;border-radius:50%;background:var(--help-accent);box-shadow:0 0 14px var(--help-accent)}
.nexus-help-hero h1{margin:10px 0 8px;color:var(--text-default);font-size:clamp(28px,4vw,42px);line-height:1.08;font-weight:800;letter-spacing:-.025em}.nexus-help-hero p{margin:0 0 24px;color:var(--span);font-size:15px;line-height:1.6;max-width:680px}
.nexus-help-search{height:58px;display:flex;align-items:center;gap:12px;padding:0 16px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:rgba(7,10,17,.72);box-shadow:inset 0 1px rgba(255,255,255,.03),0 12px 35px rgba(0,0,0,.16)}
.nexus-help-search svg{width:21px;height:21px;fill:var(--span);flex:none}.nexus-help-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--text-default);font-size:14px}.nexus-help-search input::placeholder{color:rgba(255,255,255,.38)}.nexus-help-search button{width:30px;height:30px;border:0;background:transparent;color:var(--span);font-size:24px;line-height:1;cursor:pointer;opacity:.7}.nexus-help-search button:hover{opacity:1;color:var(--text-default)}
.nexus-help-search-results{display:none;margin-top:8px;border:1px solid var(--help-border);border-radius:14px;background:rgba(10,13,21,.97);overflow:hidden;box-shadow:0 20px 45px rgba(0,0,0,.3)}.nexus-help-search-results.visible{display:block}.nexus-help-search-item{display:flex;width:100%;text-align:left;flex-direction:column;gap:4px;padding:13px 16px;border:0;border-bottom:1px solid rgba(255,255,255,.06);background:transparent;color:var(--text-default);cursor:pointer}.nexus-help-search-item:last-child{border-bottom:0}.nexus-help-search-item:hover{background:rgba(91,140,255,.09)}.nexus-help-search-item__title{font-weight:700}.nexus-help-search-item__meta{font-size:12px;color:var(--span);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nexus-help-search-empty{padding:16px;color:var(--span);font-size:13px}
.nexus-help-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:22px;align-items:start}.nexus-help-panel{border:1px solid var(--help-border);border-radius:18px;background:var(--help-surface);box-shadow:0 15px 45px rgba(0,0,0,.12);backdrop-filter:blur(10px)}.nexus-help-sidebar{position:sticky;top:20px}.nexus-help-nav-panel{padding:18px}.nexus-help-panel-title{display:flex;justify-content:space-between;align-items:center;margin:0 2px 13px;color:var(--text-default);font-weight:800}.nexus-help-panel-title small{color:var(--span);font-size:11px;font-weight:600}.nexus-help-nav{display:flex;flex-direction:column;gap:7px}.nexus-help-nav .rules_menu{height:46px;margin:0;padding-left:13px;border:1px solid transparent;background:rgba(255,255,255,.025)}.nexus-help-nav .rules_menu:hover{background:rgba(91,140,255,.08);border-color:rgba(91,140,255,.12)}.nexus-help-nav .rules_menu.help_active{background:linear-gradient(90deg,rgba(91,140,255,.16),rgba(91,140,255,.05));border-color:rgba(91,140,255,.18);box-shadow:inset 3px 0 var(--help-accent)}.nexus-help-nav .help_dropdown{display:flex;flex-direction:column;gap:4px;margin:-2px 0 5px 13px;padding-left:12px;border-left:1px solid rgba(255,255,255,.08)}.nexus-help-nav .rules_menu_cat{min-height:36px;padding:8px 10px;border-radius:9px;color:var(--span);cursor:pointer}.nexus-help-nav .rules_menu_cat:hover,.nexus-help-nav .rules_menu_cat.help_active_small{color:var(--text-default);background:rgba(255,255,255,.045)}.nexus-help-admin-actions{display:flex;flex-direction:column;gap:7px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06)}.nexus-help-admin-actions .rules_menu{height:40px;font-size:12px}
.nexus-help-content-panel{min-height:560px}.nexus-help-content-panel .rules_block{padding:0}.nexus-help-article-head{padding:30px 34px 24px;border-bottom:1px solid rgba(255,255,255,.06)}.nexus-help-breadcrumb{font-size:12px;color:var(--span);margin-bottom:10px}.nexus-help-article-head h2{margin:0;color:var(--text-default);font-size:28px;line-height:1.2;font-weight:800;letter-spacing:-.02em}.nexus-help-article-meta{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px;color:var(--span);font-size:12px}.nexus-help-article-meta span+span{padding-left:12px;border-left:1px solid rgba(255,255,255,.1)}.nexus-help-article-body{padding:26px 34px 30px;min-height:300px}.nexus-help-article-body .toastui-editor-contents{color:var(--text-default);font-size:15px;line-height:1.75}.nexus-help-article-body .toastui-editor-contents p{margin:0 0 14px}.nexus-help-article-body .toastui-editor-contents h1,.nexus-help-article-body .toastui-editor-contents h2,.nexus-help-article-body .toastui-editor-contents h3{color:var(--text-default)}.nexus-help-article-footer{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:18px 34px;border-top:1px solid rgba(255,255,255,.06);background:rgba(0,0,0,.1)}.nexus-help-feedback{display:flex;align-items:center;gap:8px;color:var(--span);font-size:12px}.nexus-help-feedback button{padding:7px 12px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(255,255,255,.035);color:var(--span);cursor:pointer}.nexus-help-feedback button:hover{color:var(--text-default);background:rgba(91,140,255,.1)}.nexus-help-feedback.answered button{display:none}.nexus-help-support{color:var(--span);font-size:12px;text-decoration:none}.nexus-help-support strong{color:var(--text-default)}.nexus-help-support:hover{color:var(--text-default)}.nexus-help-edit-actions{position:absolute;right:18px;top:18px;z-index:3}
.nexus-help-popular{margin-top:38px}.nexus-help-section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:16px}.nexus-help-section-heading h2{margin:5px 0 0;color:var(--text-default);font-size:24px}.nexus-help-heading-link{font-size:12px;color:var(--span);text-decoration:none}.nexus-help-heading-link:hover{color:var(--text-default)}.nexus-help-popular-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.nexus-help-popular-card{display:flex;align-items:center;gap:12px;min-width:0;text-align:left;padding:16px;border:1px solid var(--help-border);border-radius:14px;background:rgba(17,21,31,.7);color:var(--text-default);cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease}.nexus-help-popular-card:hover{transform:translateY(-2px);border-color:rgba(91,140,255,.25);background:rgba(91,140,255,.07)}.nexus-help-popular-icon{width:40px;height:40px;display:grid;place-items:center;flex:none;border-radius:11px;background:rgba(91,140,255,.09);color:var(--help-accent)}.nexus-help-popular-icon svg{width:20px;height:20px;fill:currentColor}.nexus-help-popular-icon--article{font-weight:800}.nexus-help-popular-copy{min-width:0;display:flex;flex-direction:column;gap:4px}.nexus-help-popular-copy strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nexus-help-popular-copy small{font-size:11px;color:var(--span)}.nexus-help-popular-arrow{margin-left:auto;color:var(--span);font-size:18px;transition:transform .16s ease}.nexus-help-popular-card:hover .nexus-help-popular-arrow{transform:translateX(3px);color:var(--text-default)}
@media(max-width:1000px){.nexus-help-layout{grid-template-columns:1fr}.nexus-help-sidebar{position:static}.nexus-help-popular-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.nexus-help-hero__content{padding:28px 20px}.nexus-help-hero{border-radius:15px}.nexus-help-layout{gap:14px}.nexus-help-article-head,.nexus-help-article-body{padding-left:20px;padding-right:20px}.nexus-help-article-footer{align-items:flex-start;flex-direction:column;padding-left:20px;padding-right:20px}.nexus-help-popular-grid{grid-template-columns:1fr}.nexus-help-section-heading{align-items:flex-start;gap:12px;flex-direction:column}.nexus-help-hero h1{font-size:30px}.nexus-help-search{height:52px}.nexus-help-content-panel{min-height:420px}}
