.csm-toolbar { background: #f5f8fb; border: 1px solid #d5e0e8; border-radius: 7px; box-shadow: 0 2px 7px rgba(35, 55, 72, .08); margin: 0 0 12px; padding: 12px; } /* Ранняя загрузка без вспышки штатного шаблона. Класс ставится внешним JS ещё в , до разбора body, и снимается после успешной инициализации либо при безопасном возврате к штатной странице. */ html.csm-page-boot .page > .row { min-height: 220px; position: relative; } html.csm-page-boot .page > .row > [class*="col-md-"] { opacity: 0; pointer-events: none; visibility: hidden; } html.csm-page-boot .page > .row::before { animation: csm-skeleton-pulse 1.1s ease-in-out infinite alternate; background: linear-gradient(#303b49, #303b49) 0 0 / 100% 36px no-repeat, linear-gradient(90deg, #eef3f6 0%, #f9fbfc 48%, #e7eef3 100%) 0 50px / 100% 112px no-repeat, #fff; border: 1px solid #d4dee6; border-radius: 7px; box-shadow: 0 3px 10px rgba(35, 55, 72, .08); content: ''; display: block; height: 178px; left: 15px; position: absolute; right: 15px; top: 0; } html.csm-page-boot .page > .row::after { color: #637888; content: 'Загружаем список…'; display: block; font-size: 13px; font-weight: 700; left: 50%; position: absolute; top: 101px; transform: translate(-50%, -50%); white-space: nowrap; } html.csm-ban-boot .page > .row::after { content: 'Загружаем банлист…'; } html.csm-mute-boot .page > .row::after { content: 'Загружаем мутлист…'; } html.csm-application-boot .page > .row::after { content: 'Загружаем заявки…'; } @keyframes csm-skeleton-pulse { from { opacity: .72; } to { opacity: 1; } } @keyframes csm-content-reveal { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } } /* После успешной инициализации серверы и статистика находятся в панели фильтров, а штатная колонка 3/12 скрывается. */ .csm-page-layout.csm-context-integrated { display: block; } .csm-page-layout.csm-context-integrated > .csm-page-main { animation: csm-content-reveal .18s ease-out; float: none; width: 100%; } .csm-page-layout.csm-context-integrated > .csm-page-sidebar { display: none; } .csm-search { align-items: center; display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) auto; position: relative; } .csm-search > .glyphicon:first-child { color: #708395; left: 12px; position: absolute; top: 13px; z-index: 2; } .csm-search .form-control { border: 1px solid #bfcdd8; border-radius: 5px; box-shadow: inset 0 1px 2px rgba(35, 55, 72, .05); height: 40px; min-width: 0; padding: 8px 12px 8px 34px; } .csm-search .form-control:focus, .csm-filter-group .form-control:focus { border-color: #477fae; box-shadow: 0 0 0 2px rgba(71, 127, 174, .16); } .csm-search-button, .csm-reset-button { align-items: center; border-radius: 5px !important; display: inline-flex; flex: 0 0 auto; font-weight: 600; gap: 7px; height: 40px; justify-content: center; margin: 0 !important; min-width: 104px; padding: 8px 15px; } .csm-search-button .glyphicon, .csm-reset-button .glyphicon { line-height: 1; } .csm-filter-row { align-items: flex-end; display: flex; flex-wrap: wrap; gap: 9px; margin-top: 11px; } .csm-filter-group { flex: 0 1 205px; min-width: 150px; } .csm-filter-group label, .csm-toolbar-section-label { color: #586b7b; display: block; font-size: 11px; font-weight: 700; letter-spacing: .035em; margin: 0 0 5px; text-transform: uppercase; } .csm-filter-group .form-control { border-color: #c7d3dc; border-radius: 5px; height: 38px; max-width: none; } .csm-server-filter { flex: 1 1 175px; min-width: 160px; } .csm-server-select { position: relative; } .csm-server-select > .glyphicon { color: #47749f; left: 11px; pointer-events: none; position: absolute; top: 12px; z-index: 2; } .csm-server-select .form-control { background: #fff; cursor: pointer; font-weight: 600; overflow: hidden; padding-left: 32px; text-overflow: ellipsis; white-space: nowrap; } .csm-stats-control { align-self: flex-end; flex: 0 0 auto; margin-left: auto; position: relative; z-index: 15; } .csm-stats-trigger { align-items: center; background: linear-gradient(180deg, #fff 0%, #edf4f8 100%); border: 1px solid #aabfce; border-radius: 5px; color: #315b79; cursor: pointer; display: inline-flex; font-weight: 700; gap: 7px; height: 38px; justify-content: center; padding: 7px 11px; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; white-space: nowrap; } .csm-stats-trigger:hover, .csm-stats-trigger:focus, .csm-stats-control.is-open .csm-stats-trigger { border-color: #477fae; box-shadow: 0 0 0 2px rgba(71, 127, 174, .14); color: #234f70; outline: 0; } .csm-stats-trigger > strong { background: #356f9f; border-radius: 11px; color: #fff; font-size: 11px; line-height: 21px; min-width: 29px; padding: 0 7px; text-align: center; } .csm-stats-popover { background: #fff; border: 1px solid #c7d5df; border-radius: 9px; box-shadow: 0 14px 34px rgba(27, 47, 64, .22); opacity: 0; padding: 12px; pointer-events: none; position: absolute; right: 0; top: calc(100% + 9px); transform: translateY(-5px); transition: opacity .16s ease, transform .16s ease, visibility .16s ease; visibility: hidden; width: min(320px, calc(100vw - 40px)); z-index: 100; } .csm-stats-popover::before, .csm-stats-popover::after { border-left: 7px solid transparent; border-right: 7px solid transparent; content: ''; position: absolute; right: 26px; } .csm-stats-popover::before { border-bottom: 8px solid #c7d5df; top: -8px; } .csm-stats-popover::after { border-bottom: 7px solid #fff; top: -6px; } .csm-stats-control:hover .csm-stats-popover, .csm-stats-control:focus-within .csm-stats-popover, .csm-stats-control.is-open .csm-stats-popover { opacity: 1; pointer-events: auto; transform: translateY(0); visibility: visible; } .csm-stats-title { align-items: baseline; display: flex; justify-content: space-between; margin-bottom: 10px; } .csm-stats-title > span { color: #283f52; font-size: 14px; font-weight: 800; } .csm-stats-title > small { color: #80909d; font-size: 10px; } .csm-stats-grid { display: grid; gap: 8px; grid-template-columns: 1fr 1fr; } .csm-stat-card { background: #f3f7fa; border-left: 4px solid #47749f; border-radius: 6px; min-height: 58px; padding: 8px 9px; } .csm-stat-card > span { color: #6d7e8b; display: block; font-size: 10px; font-weight: 700; line-height: 1.2; margin-bottom: 4px; text-transform: uppercase; } .csm-stat-card > strong { color: #253d50; display: block; font-size: 18px; line-height: 1; } .csm-stat-active { background: #edf8f0; border-left-color: #4f9c63; } .csm-stat-permanent { background: #f4f0fa; border-left-color: #8264ad; } .csm-stat-temporal { background: #fff6e8; border-left-color: #d09036; } .csm-context-action { align-items: center; align-self: flex-end; display: inline-flex; gap: 6px; height: 38px; justify-content: center; } .csm-reset-button { background: #fff; border-color: #c7d3dc; color: #3e6482; height: 38px; } .csm-reset-button:hover { background: #eaf2f7; border-color: #9fb6c7; color: #284e6b; } .csm-result-count { background: #e5edf3; border-radius: 14px; color: #415b70; font-size: 12px; font-weight: 600; line-height: 28px; margin-left: auto; min-height: 28px; padding: 0 11px; white-space: nowrap; } .csm-result-count:empty { display: none; } .csm-toolbar-section-label { margin-top: 11px; } .csm-core-ban-search { display: none !important; } .csm-ban-table, .csm-application-table, .csm-mute-table { border-collapse: separate; border-spacing: 0; table-layout: fixed; width: 100%; } .csm-ban-table > thead > tr > td, .csm-application-table > thead > tr > td, .csm-mute-table > thead > tr > td { background: #edf3f7; border-bottom: 2px solid #c9d7e1 !important; color: #43596b; font-size: 11px; font-weight: 700; letter-spacing: .025em; padding: 10px 8px !important; text-transform: uppercase; } .csm-ban-table > tbody > [data-csm-ready="1"] > td, .csm-application-table > tbody > .csm-application-row > td, .csm-mute-table > tbody > [data-csm-ready="1"] > td { border-color: #dde5eb !important; padding: 10px 8px !important; transition: background-color .15s ease, box-shadow .15s ease; } .csm-ban-table > tbody > [data-csm-ready="1"]:hover > td, .csm-application-table > tbody > .csm-application-row:hover > td, .csm-mute-table > tbody > [data-csm-ready="1"]:hover > td { background-color: #eef6fb !important; } .csm-ban-table > tbody > [data-csm-ready="1"]:focus, .csm-application-table > tbody > .csm-application-row:focus, .csm-mute-table > tbody > [data-csm-ready="1"]:focus { outline: 0; } .csm-ban-table > tbody > [data-csm-ready="1"]:focus-visible > td, .csm-application-table > tbody > .csm-application-row:focus-visible > td, .csm-mute-table > tbody > [data-csm-ready="1"]:focus-visible > td { background-color: #eef6fb !important; } .csm-ban-table > thead td:nth-child(1) { width: 21%; } .csm-ban-table > thead td:nth-child(2) { width: 24%; } .csm-ban-table > thead td:nth-child(3) { width: 15%; } .csm-ban-table > thead td:nth-child(4) { width: 18%; } .csm-ban-table > thead td:nth-child(5) { width: 22%; } .csm-mute-table > thead td:nth-child(1) { width: 20%; } .csm-mute-table > thead td:nth-child(2) { width: 20%; } .csm-mute-table > thead td:nth-child(3) { width: 12%; } .csm-mute-table > thead td:nth-child(4) { width: 14%; } .csm-mute-table > thead td:nth-child(5) { width: 17%; } .csm-mute-table > thead td:nth-child(6) { width: 17%; } .csm-ban-table > tbody > [data-csm-ready="1"] { cursor: pointer; } .csm-mute-table > tbody > [data-csm-ready="1"] { cursor: pointer; } .csm-mute-table > tbody > [data-csm-ready="1"] > td { overflow-wrap: anywhere; vertical-align: middle !important; } .csm-mute-issued { text-align: center; } .csm-mute-term > small { color: #717b84; display: block; font-size: 11px; line-height: 1.25; margin-top: 3px; } .csm-mute-note { color: #6f5718; display: flex; gap: 8px; line-height: 1.4; margin-top: 12px; padding: 6px 0; } .csm-ban-table > tbody > [data-csm-ready="1"] > td { overflow-wrap: anywhere; vertical-align: middle !important; } .csm-ban-issued { text-align: center; } .csm-ban-term > small, .csm-detail-subline { color: #717b84; display: block; font-size: 11px; line-height: 1.25; margin-top: 3px; } .csm-ban-term .btn2 { display: inline-block; font-size: 11px; margin-top: 5px; padding: 2px 5px; } .csm-comment-preview { color: #6c7781; display: -webkit-box; font-size: 11px; line-height: 1.25; margin-top: 5px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .csm-comment-preview .glyphicon { color: #47749f; } .csm-comment-value { line-height: 1.45; white-space: pre-wrap; } .csm-comment-empty, .csm-muted { color: #8a949d; font-style: italic; } .csm-comment-edit { border-radius: 4px; margin-top: 8px; } .csm-comment-editor { background: #f4f8fb; border: 1px solid #cbd9e3; border-radius: 7px; box-shadow: 0 2px 7px rgba(35, 55, 72, .06); margin-top: 10px; padding: 11px; } .csm-comment-editor textarea { border-color: #bfcdd8; border-radius: 5px; box-shadow: inset 0 1px 2px rgba(35, 55, 72, .05); min-height: 96px; resize: vertical; } .csm-comment-editor textarea:focus { border-color: #477fae; box-shadow: 0 0 0 2px rgba(71, 127, 174, .16); } .csm-comment-editor-meta { color: #7d8790; display: flex; font-size: 12px; gap: 8px; justify-content: space-between; margin-top: 4px; min-height: 17px; } .csm-comment-editor.is-invalid .csm-comment-length, .csm-comment-limit-error { color: #b24747; } .csm-comment-editor-actions { display: flex; gap: 7px; justify-content: flex-end; margin-top: 10px; } .csm-comment-editor-actions .btn { border-radius: 4px; font-weight: 600; min-width: 92px; } .csm-comment-editor.is-saving { opacity: .72; } .csm-source-badge { background: #e8f0f7; border-radius: 10px; color: #38658f !important; display: block; font-size: 10px; line-height: 1.3; margin-top: 4px; max-width: max-content; padding: 2px 7px; text-decoration: none !important; } .csm-ban-warning { align-items: flex-start; background: transparent; color: #6f5718; display: flex; gap: 9px; line-height: 1.45; margin-top: 12px; padding: 6px 0; } .csm-ban-warning .glyphicon { font-size: 16px; margin-top: 1px; } .csm-end-editor { max-width: 280px; } .csm-inline-error { background: #fee9e8; border: 1px solid #efb2ae; border-left: 4px solid #cf493f; border-radius: 4px; color: #9c3029; font-weight: 600; line-height: 1.4; margin-top: 9px; padding: 9px 11px; } .csm-comment-unavailable { background: #fff4d7; border-left: 3px solid #c79a2c; color: #6f5718; line-height: 1.4; margin-top: 10px; padding: 8px 10px; } .csm-fallback-note { background: #eef4f9; border-left: 3px solid #47749f; color: #496579; padding: 8px 11px; } .csm-loading { opacity: .55; pointer-events: none; } .csm-empty { color: #7d8790; padding: 25px 10px !important; text-align: center; } .csm-pagination { align-items: center; display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; padding: 18px 5px; } .csm-pagination button { background: #fff; border: 1px solid #d4d9de; border-radius: 4px; color: #3f6f9d; font-weight: 600; min-width: 34px; padding: 7px 9px; transition: background-color .15s ease, border-color .15s ease, color .15s ease; } .csm-pagination button:hover, .csm-pagination button.active { background: #47749f; border-color: #47749f; color: #fff; } .csm-pagination button:focus-visible, .csm-status-filters button:focus-visible, .csm-toolbar .btn:focus-visible, .csm-toolbar .form-control:focus-visible { box-shadow: 0 0 0 2px rgba(71, 116, 159, .35); outline: 0; } .csm-application-table > thead td:nth-child(1) { width: 29%; } .csm-application-table > thead td:nth-child(2) { width: 17%; } .csm-application-table > thead td:nth-child(3) { width: 15%; } .csm-application-table > thead td:nth-child(4) { width: 20%; } .csm-application-table > thead td:nth-child(5) { width: 19%; } .csm-application-row { cursor: pointer; } .csm-application-row td { overflow-wrap: anywhere; vertical-align: middle !important; } .csm-application-title { display: block; font-size: 13px; font-weight: 700; line-height: 1.35; text-decoration: none !important; } .csm-application-title:hover { color: #245b88; text-decoration: underline !important; } .csm-application-title + small { color: #6f7f8c; display: block; line-height: 1.25; margin-top: 4px; } .csm-application-open { align-items: center; color: #2f6f9f !important; display: inline-flex; font-size: 11px; font-weight: 700; gap: 4px; margin-top: 7px; text-decoration: none !important; } .csm-application-open:hover { color: #1e527b !important; text-decoration: underline !important; } .csm-application-open .glyphicon { font-size: 9px; } .csm-user { align-items: center; display: inline-flex; gap: 4px; } .csm-user .small_us_av { height: 28px; width: 28px; } .csm-status { align-items: center; border: 1px solid transparent; border-radius: 14px; display: inline-flex; font-size: 12px; font-weight: 700; gap: 6px; justify-content: center; min-height: 27px; padding: 4px 10px; white-space: nowrap; } .csm-status::before { background: currentColor; border-radius: 50%; content: ''; height: 7px; width: 7px; } .csm-status-success { background: #d9f2df; border-color: #9dd5aa; color: #226e38; } .csm-status-danger { background: #fde1df; border-color: #efaaa5; color: #a42e28; } .csm-status-warning { background: #fff0bd; border-color: #e8c865; color: #775a00; } .csm-status-filters { display: flex; flex-wrap: wrap; gap: 7px; } .csm-status-filters button { align-items: center; background: #fff; border: 1px solid #c8d4dd; border-radius: 17px; color: #455b6c; display: inline-flex; font-weight: 600; gap: 7px; min-height: 34px; padding: 5px 11px; transition: background-color .15s ease, border-color .15s ease, color .15s ease; } .csm-status-filters button:hover { background: #edf5fa; border-color: #98b5ca; color: #284f6d; } .csm-status-filters button.active { background: #356f9f; border-color: #356f9f; color: #fff; } .csm-status-filters [data-count] { background: rgba(53, 111, 159, .12); border-radius: 10px; font-size: 11px; line-height: 20px; min-width: 20px; padding: 0 5px; text-align: center; } .csm-status-filters button.active [data-count] { background: rgba(255, 255, 255, .22); } .csm-application-status-success > td:first-child { box-shadow: inset 3px 0 #3f9b59; } .csm-application-status-danger > td:first-child { box-shadow: inset 3px 0 #cf5148; } .csm-application-status-warning > td:first-child { box-shadow: inset 3px 0 #d6a72f; } .csm-ban-details td, .csm-mute-details td { overflow-wrap: anywhere; } @media (max-width: 991px) { .csm-source-badge { max-width: 100%; } } @media (max-width: 767px) { .csm-toolbar { border-radius: 6px; margin-bottom: 10px; padding: 10px; } .csm-search { align-items: stretch; display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) auto; } .csm-search-button { min-width: 96px; } .csm-filter-row { align-items: stretch; display: grid; gap: 9px; grid-template-columns: 1fr 1fr; } .csm-filter-group { min-width: 0; } .csm-filter-row select { max-width: none; } #csm-mute-toolbar .csm-filter-row { grid-template-columns: 1fr 1fr; } #csm-ban-reset, #csm-mute-toolbar .csm-filter-sort, #csm-mute-reset { grid-column: 1 / -1; width: 100%; } .csm-reset-button { width: 100%; } .csm-server-filter { min-width: 0; } .csm-stats-control, .csm-stats-trigger, .csm-context-action { margin-left: 0; width: 100%; } .csm-stats-popover { right: 0; } .csm-result-count { grid-column: 1 / -1; margin: 0; text-align: right; width: max-content; justify-self: end; } .csm-status-filters { display: grid; grid-template-columns: 1fr 1fr; } .csm-status-filters button { justify-content: space-between; width: 100%; } .csm-ban-table, .csm-ban-table > tbody, .csm-application-table, .csm-application-table > tbody, .csm-mute-table, .csm-mute-table > tbody { display: block; width: 100%; } .csm-ban-table > thead, .csm-application-table > thead, .csm-mute-table > thead { display: none; } .csm-ban-table > tbody > [data-csm-ready="1"], .csm-application-table > tbody > .csm-application-row, .csm-mute-table > tbody > [data-csm-ready="1"] { background: #fff; border: 1px solid #cedae3; border-left: 4px solid #47749f; border-radius: 7px; box-shadow: 0 2px 5px rgba(34, 46, 58, .09); display: block; margin: 9px 6px; overflow: hidden; padding: 3px 11px; } .csm-ban-table > tbody > [data-csm-ready="1"].danger { border-left-color: #bd5252; } .csm-ban-table > tbody > [data-csm-ready="1"].success { border-left-color: #5d9b58; } .csm-mute-table > tbody > [data-csm-ready="1"].danger { border-left-color: #bd5252; } .csm-mute-table > tbody > [data-csm-ready="1"].success { border-left-color: #5d9b58; } .csm-application-table > tbody > .csm-application-status-success { border-left-color: #3f9b59; } .csm-application-table > tbody > .csm-application-status-danger { border-left-color: #cf5148; } .csm-application-table > tbody > .csm-application-status-warning { border-left-color: #d6a72f; } .csm-ban-table > tbody > [data-csm-ready="1"] > td, .csm-application-table > tbody > .csm-application-row > td, .csm-mute-table > tbody > [data-csm-ready="1"] > td { align-items: start; background: transparent !important; border: 0 !important; border-bottom: 1px solid #edf0f2 !important; display: grid; gap: 10px; grid-template-columns: 84px minmax(0, 1fr); min-height: 35px; padding: 8px 0 !important; text-align: left !important; width: auto !important; } .csm-application-table > tbody > .csm-application-row > td { grid-template-columns: 92px minmax(0, 1fr); } .csm-ban-table > tbody > [data-csm-ready="1"] > td:last-child, .csm-application-table > tbody > .csm-application-row > td:last-child, .csm-mute-table > tbody > [data-csm-ready="1"] > td:last-child { border-bottom: 0 !important; } .csm-ban-table > tbody > [data-csm-ready="1"] > td::before, .csm-application-table > tbody > .csm-application-row > td::before, .csm-mute-table > tbody > [data-csm-ready="1"] > td::before { color: #7a858f; content: attr(data-label); font-size: 10px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; } .csm-ban-term > small, .csm-source-badge { margin-left: 0; } .csm-ban-table > tbody > .hidden-tr { display: table-row; height: 0; } .csm-mute-table > tbody > .hidden-tr { display: table-row; height: 0; } .csm-ban-details td:first-child, .csm-mute-details td:first-child { width: 38%; } .csm-ban-warning { margin-top: 8px; } .csm-application-open { background: #e8f2f8; border-radius: 4px; display: flex; justify-content: center; margin-top: 8px; padding: 7px 9px; width: 100%; } .csm-status { min-width: 124px; } .csm-ban-modal .modal-dialog, .csm-mute-modal .modal-dialog { margin: 8px; width: auto; } } @media (max-width: 380px) { .csm-search { grid-template-columns: minmax(0, 1fr); } .csm-search .btn { width: 100%; } .csm-filter-row { gap: 8px; } .csm-filter-group label, .csm-toolbar-section-label { font-size: 10px; } .csm-filter-group .form-control, .csm-reset-button { height: 36px; } #csm-ban-reset, .csm-result-count { grid-column: 1 / -1; } #csm-mute-toolbar .csm-filter-sort, #csm-mute-reset { grid-column: auto; } .csm-result-count { justify-self: stretch; text-align: center; width: auto; } .csm-ban-table > tbody > [data-csm-ready="1"] > td, .csm-application-table > tbody > .csm-application-row > td, .csm-mute-table > tbody > [data-csm-ready="1"] > td { grid-template-columns: 78px minmax(0, 1fr); } .csm-comment-editor-actions { align-items: stretch; flex-direction: column-reverse; } .csm-comment-editor-actions .btn { width: 100%; } } /* Компактный мобильный список. Ранее каждая ячейка превращалась в отдельный большой блок с подписью, из-за чего один бан занимал пол-экрана. На узком экране сохраняем привычную табличную строку, но не ужимаем пять-шесть колонок до нечитаемого размера: таблица листается внутри своего блока. */ .csm-swipe-hint { display: none; } @media (max-width: 767px) { .csm-swipe-hint { align-items: center; background: #eaf2f7; border: 1px solid #c9d9e4; border-radius: 5px; color: #47677e; display: flex; font-size: 11px; font-weight: 700; gap: 7px; justify-content: center; margin: 0 6px 7px; min-height: 30px; padding: 5px 9px; transition: opacity .2s ease, max-height .2s ease, margin .2s ease, padding .2s ease; } .csm-swipe-hint.is-dismissed { margin-bottom: 0; max-height: 0; opacity: 0; overflow: hidden; padding-bottom: 0; padding-top: 0; } .csm-table-scroll { -webkit-overflow-scrolling: touch; isolation: isolate; overflow-x: auto !important; overscroll-behavior-inline: contain; padding-bottom: 4px; scrollbar-color: #7f9bb0 #e7edf1; scrollbar-width: thin; } .csm-ban-table, .csm-application-table, .csm-mute-table { display: table; table-layout: fixed; width: 100%; } .csm-ban-table { min-width: 900px; } .csm-application-table { min-width: 900px; } .csm-mute-table { min-width: 1050px; } .csm-ban-table > thead td:nth-child(1) { width: 18%; } .csm-ban-table > thead td:nth-child(2) { width: 28%; } .csm-ban-table > thead td:nth-child(3) { width: 18%; } .csm-ban-table > thead td:nth-child(4) { width: 18%; } .csm-ban-table > thead td:nth-child(5) { width: 18%; } .csm-mute-table > thead td:nth-child(1) { width: 17%; } .csm-mute-table > thead td:nth-child(2) { width: 24%; } .csm-mute-table > thead td:nth-child(3) { width: 10%; } .csm-mute-table > thead td:nth-child(4) { width: 16%; } .csm-mute-table > thead td:nth-child(5) { width: 16%; } .csm-mute-table > thead td:nth-child(6) { width: 17%; } .csm-ban-table > thead, .csm-application-table > thead, .csm-mute-table > thead { display: table-header-group; } .csm-ban-table > tbody, .csm-application-table > tbody, .csm-mute-table > tbody { display: table-row-group; } .csm-ban-table > tbody > [data-csm-ready="1"], .csm-application-table > tbody > .csm-application-row, .csm-mute-table > tbody > [data-csm-ready="1"] { background: #fff; border: 0; border-left: 3px solid #47749f; border-radius: 0; box-shadow: none; display: table-row; margin: 0; overflow: visible; padding: 0; } .csm-ban-table > tbody > [data-csm-ready="1"] > td, .csm-application-table > tbody > .csm-application-row > td, .csm-mute-table > tbody > [data-csm-ready="1"] > td { align-items: center; border: 0 !important; border-bottom: 1px solid #e2e8ed !important; display: table-cell; font-size: 13px; line-height: 1.35; max-width: 0; min-height: 0; overflow: hidden; padding: 9px 8px !important; text-align: left !important; text-overflow: ellipsis; white-space: nowrap; width: auto !important; } .csm-ban-table > tbody > [data-csm-ready="1"] > td::before, .csm-application-table > tbody > .csm-application-row > td::before, .csm-mute-table > tbody > [data-csm-ready="1"] > td::before { display: none; } .csm-ban-table > thead > tr > td, .csm-application-table > thead > tr > td, .csm-mute-table > thead > tr > td { background: #edf3f7; font-size: 11px; line-height: 1.2; padding: 9px 8px !important; position: sticky; text-align: left; top: 0; white-space: nowrap; z-index: 2; } .csm-ban-table > tbody > [data-csm-ready="1"]:hover > td, .csm-application-table > tbody > .csm-application-row:hover > td, .csm-mute-table > tbody > [data-csm-ready="1"]:hover > td { background: #eef6fb !important; } .csm-ban-table > tbody > [data-csm-ready="1"] > td:first-child, .csm-application-table > tbody > .csm-application-row > td:first-child, .csm-mute-table > tbody > [data-csm-ready="1"] > td:first-child { background-color: #fff !important; background-image: linear-gradient(#fff, #fff) !important; box-shadow: 2px 0 4px rgba(48, 70, 87, .08); left: 0; position: sticky; z-index: 3; } .csm-ban-table > thead > tr > td:first-child, .csm-application-table > thead > tr > td:first-child, .csm-mute-table > thead > tr > td:first-child { left: 0; z-index: 4; } .csm-ban-table > tbody > [data-csm-ready="1"].danger > td, .csm-mute-table > tbody > [data-csm-ready="1"].danger > td { background-color: #f5dddd !important; } .csm-ban-table > tbody > [data-csm-ready="1"].danger > td:first-child, .csm-mute-table > tbody > [data-csm-ready="1"].danger > td:first-child { background-image: linear-gradient(#f5dddd, #f5dddd) !important; } .csm-ban-table > tbody > [data-csm-ready="1"].success > td, .csm-mute-table > tbody > [data-csm-ready="1"].success > td { background-color: #e0f1dc !important; } .csm-ban-table > tbody > [data-csm-ready="1"].success > td:first-child, .csm-mute-table > tbody > [data-csm-ready="1"].success > td:first-child { background-image: linear-gradient(#e0f1dc, #e0f1dc) !important; } .csm-ban-table > tbody > [data-csm-ready="1"].warning > td, .csm-mute-table > tbody > [data-csm-ready="1"].warning > td { background-color: #fff1cc !important; } .csm-ban-table > tbody > [data-csm-ready="1"].warning > td:first-child, .csm-mute-table > tbody > [data-csm-ready="1"].warning > td:first-child { background-image: linear-gradient(#fff1cc, #fff1cc) !important; } .csm-ban-table > tbody > [data-csm-ready="1"] > td:last-child, .csm-application-table > tbody > .csm-application-row > td:last-child, .csm-mute-table > tbody > [data-csm-ready="1"] > td:last-child { border-bottom: 1px solid #e2e8ed !important; } .csm-ban-table .csm-user, .csm-mute-table .csm-user { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .csm-ban-table td img, .csm-application-table td img, .csm-mute-table td img { display: inline-block !important; height: 25px !important; margin-right: 4px; max-height: 25px !important; max-width: 25px !important; object-fit: cover; vertical-align: middle; width: 25px !important; } .csm-ban-issued, .csm-mute-issued { text-align: center !important; } .csm-ban-term > small, .csm-detail-subline, .csm-mute-term > small { color: #6f7e89; display: block; font-size: 10px; line-height: 1.25; margin-top: 2px; } .csm-ban-term .btn2 { display: none; } .csm-source-badge { display: none; } .csm-application-title { display: block; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .csm-application-title + small, .csm-application-open { display: none; } .csm-status { border-radius: 10px; font-size: 9px; gap: 3px; min-height: 21px; min-width: 0; padding: 2px 5px; } .csm-status::before { height: 5px; width: 5px; } .csm-ban-table > tbody > .hidden-tr, .csm-mute-table > tbody > .hidden-tr { display: table-row; height: 0; } }