.mdx-section-title-edit-btn {
    margin-left: 8px;
}
.mdx-section label.xux-labelableBox-label {
    font-weight: bold;
}
.mdx-section {
    margin-bottom: 0!important;
}
.mdx-section .xux-section-content {
    background-color: #fff;
    position: relative;
}
.mdx-section .xux-section-content > .xux-throbber.xux-throbber-modal {
    z-index: 1000;
    background: rgba(0, 0, 0, 0.2)!important;
}
.mdx-section .mdx-static-text-item {
    color: #0a0a0a
}

.mdx-section-title .mdx-section-header-btn .xux-section-collapse {
    vertical-align: top;
}

.mdx-section > .xux-section-content:has(>.mdx-section>h2) {
    padding: 0;
}

.mdx-section-title > span.xux-validate-error-tip {
    display: inline-flex;
    align-items: center;
    margin-left: 8px;
}

#campaign-edit-box .mdx-section > h2 {
    border-bottom: 1px solid #ccc;
}

.mdx-ads-creative-list-section > .xux-section-content {
    height: auto !important;
}

.display-creative-section .change-input,
.search-creative-section .change-input {
    width: calc(100%);
}

.display-creative-section .ad-long-title-table-parent{
    width: 100%;
}

.target-retargeting-section .audience-table .xux-piece.xux-last {
    height: 20px;
    line-height: 20px;
}

.ad-option-section table {
   table-layout: fixed;
}

.mdx-main-keyword-section table td,
.mdx-except-keyword-section table td,
.ad-option-section table td,
.target-retargeting-section table td,
.search-creative-section table td,
.display-creative-section table td {
    vertical-align: top !important;
}

.search-creative-section .ad-append-button,
.display-creative-section .ad-append-button,
.ad-option-section .option-append-button,
.target-retargeting-section .retargeting-list-append-button {
    margin-top: 8px;
}

.search-creative-section button,
.display-creative-section button,
.display-creative-section input[type='button'],
.ad-option-section button {
    width: 190px;
}

.display-creative-section .img-delete-button {
    margin-left: 4px;
}

.target-retargeting-section .audience-new .xux-button {
    margin-left: 0 !important;
}

.ad-option-section .site-link-table-parent-div {
    width: 80%;
}

.ad-option-section .snippet-table-parent .xux-table-wrapper {
    margin-left: 0;
}

.ad-option-section .callout-table-parent-div, .ad-option-section .phone-num-table-parent-div, .ad-option-section .snippet-table-parent {
    width: 40%;
}

.display-creative-section .media-file-table-div td {
    align-content: center;
}

.display-creative-section .image-preview {
    margin-top: 2px;
}

.display-creative-section .image-preview > img {
    height: 65px
}

.display-creative-section .image-preview > span {
    vertical-align: bottom;
}

.display-creative-section .media-file-preview {
    display: flex;
    flex-wrap: wrap;
}

.mdx-section-flex-item {
    display: flex;
}
.mdx-section-flex-item .leading-box {
    width: 240px!important;
}

.mdx-section-flex-item .xux-horizontalLayout-margin {
    width: 80px;
}

.mdx-weekday-row:not(:first-child) {
    margin-top: 8px;
}

.mdx-weekday-column,
.mdx-time-column {
    display: inline-block;
}
.mdx-weekday-column .xux-choice .xux-choice-bg {
    top: 3px;
}
.mdx-time-column {
    margin-left: 16px;
}
.mdx-time-combine-char {
    margin: 0 8px;
}
.mdx-zero-margin-left-box {
    margin-left: 0!important;
}

.mdx-campaign-content-targeting-table-box {
    margin-left: 0!important;
}

.mdx-campaign-section .mdx-text-align-end {
    text-align: end!important;
}

.mdx-section .import-keyword-box {
    border: solid 2px #ccc;
    height: 300px;
    background-color: white;
    overflow-y: auto;
}
.mdx-section .green-arc-box-medium-mark {
    min-width: 80px;
    float: left;
    margin: 5px;
    background-color: #fff;
    border:solid 2px #2B979F;
    border-radius: 20px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    color: #2B979F;
}

.assorted-keyword-box .xux-table-wrapper, .exclude-keyword-box .xux-table-wrapper{
    max-height: 300px!important;
}
.assorted-keyword-box table thead, .exclude-keyword-box table thead {
    position: 'sticky';
    top: '0';
    z-index: '2';
}

.mdx-preview {
    border: solid 1px #D6D6D6;
}

.mdx-preview .header {
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
    justify-content: center;
    display: none;
}

.mdx-preview .circle-small {
    border-radius: 50%;
    background-color: #D6D6D6;
    height: 10px;
    width: 10px;
}

.mdx-preview .container .content {
    display: inline-flex;
    width: 100%;
}

.mdx-preview .container .desc {
    padding-left: 8px;
}
.mdx-preview .container .desc-box .desc {
    padding-left: 0px;
}


.mdx-preview .container .responsive .logo-box {
    margin-top: 8px;
    margin-bottom: 8px;
}

.mdx-preview .container .responsive-long .logo-box {
    width: 20%;
    min-width: 20%;
}

.mdx-preview .container.responsive-long .desc {
    width: 80%;
}

.mdx-preview .container .logo-box > img {
    width: calc(20%);
}

.mdx-preview .container .responsive-long .logo-box > img {
    width: calc(100%);
}

.mdx-preview .container .responsive, .container .responsive-long, .container .banner-container {
    display: none;
}

.container .banner-container {
    min-height: 52px;
}

.mdx-preview .container > .main {
    border: solid 1px #D6D6D6;
    background-color: #fff;
}

.mdx-preview .container .media-box {
    width: 100%;
}

.mdx-preview .banner, .mdx-preview .responsive-container .media-box {
    text-align: center;
}

.mdx-preview .container .responsive > .main {
    text-align: center;
}

.mdx-preview .container .button {
    margin-top: 16px;
    margin-bottom: 16px;
}

.mdx-preview .container .title {
    font-weight: bold;
    font-size: 22px;
    margin-bottom: 8px;
}

.mdx-preview .container .sponsor {
    margin: 10px;
    font-weight: bold;
}

.mdx-preview .container .title-box {
    display: flex;
    margin-left: 10px;
}

.mdx-preview .main>.final-url-box {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.mdx-preview .main>.final-url-box .final-url {
    width: calc(100% - 15px);
}

.responsive-container .main {
    padding: 8px 16px 16px 16px
}

.responsive-container .main .title {
    color: #1681E0;
}

.mdx-preview .container .title-box div {
    color: #1681E0;
    font-size: 18px;
    font-weight: 700;
    line-height: 23px;
}

.mdx-preview .container .desc-box {
    margin-left: 10px;
    margin-bottom: 10px;
    line-height: 1.5;
}

.mdx-preview .container .final-url {
    min-height: 20px;
}
.mdx-preview .container .title,
.mdx-preview .container .desc,
.mdx-preview .container .final-url {
    white-space: pre-wrap;
    word-break: break-all;
}

.mdx-preview .container .circle-medium {
    width: 15px;
    height: 15px;
    color: #fff;
    float: left;
    margin: 0 10px;
    background-color: #eee;
    border-radius: 50%;
}

.ad-section > .xux-section-content,
.retargeting-section > .xux-section-content{
    padding: 0
}

.ad-section > h2,
.retargeting-section > h2{
    border-bottom: 1px solid rgb(204, 204, 204);
}

.mdx-section-collapse > span {
    display: block !important;
}

.mdx-section .xux-horizontalLayout-item {
    box-sizing: border-box;
}

.mdx-section .xux-horizontalLayout-item:not(:last-child) {
    padding-right: 16px;
}

.campaign-schedule-section .xux-horizontalLayout-item:not(:last-child) {
    padding-right: 32px;
}

.mdx-section .xux-horizontalLayout-margin {
    width: 0;
}
.mdx-section hr {
    margin-top: 24px;
    margin-bottom: 24px;
}

.mdx-auto-issue-name-title {
    display: inline-block;
    height: 100%;
    flex-grow: 1;
    min-width: 1px;
    opacity: 0;
    pointer-events: auto;
    cursor: pointer;
}
.mdx-manual-issue-name-title {
    display: block;
    height: 24px;
    opacity: 0;
    pointer-events: auto;
    cursor: pointer;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: inherit;
}
.mdx-section > h2 {
    display: flex;
    align-items: center;
}
.mdx-section > h2 > .xux-section-title-text {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 500px;
}

.mdx-section > h2 > .xux-textField {
    height: 22.5px;
}

.ad-option-section .snippet-select-box {
    display: inline-flex;
    margin-bottom: 8px;
    width: 100%;
}

.ad-option-section .snippet-select-box .snippet-language,
.ad-option-section .snippet-select-box .snippet-header-type {
    width: 30%;
}

.ad-option-section .snippet-select-box > :not(div:first-child) :not(:first-child) {
    margin-left: 8px;
}

.mdx-flexable-box {
    display: flex;
}

.mdx-flexable-box > .flex-grow-item {
    flex-grow: 1;
    flex-basis: 200px;
}
.mdx-flexable-box > .flex-shrink-item {
    flex-shrink: 1;
}
.mdx-flexable-box > .normal-margin {
    margin-left: 16px;
    margin-right: 16px;
}

.mdx-sticky-table-head {
    position: sticky;
    z-index: 2;
    top: 0;
}

.target-retargeting-section .audience-access-time-parent-div div.xux-layoutGroup:not(.xux-first) {
    display: inline-flex !important;
}

.target-retargeting-section .audience-access-time {
    width: 50px !important;
}

.mdx-except-keyword-section button.xux-icon-rightarrow,
.mdx-main-keyword-section button.xux-icon-rightarrow,
.target-retargeting-section button.xux-icon-rightarrow,
.target-audience-section button.xux-icon-rightarrow {
    min-width: 32px !important;
    padding: 0 !important;
}

.mdx-except-keyword-section .xux-staticText .xux-icon:before,
.mdx-main-keyword-section .xux-staticText .xux-icon:before {
    vertical-align: unset;
}

.target-retargeting-section button.delete-button,
.target-audience-section button.delete-button {
    margin-left: 16px;
}

.target-retargeting-section .xux-margin-normal .xux-horizontalLayout-item-1,
.target-audience-section .xux-margin-normal .xux-horizontalLayout-item-1 {
    text-align: center;
}

.target-retargeting-section .xux-tree.treeview li>span {
    border-bottom: 1px solid rgb(204, 204, 204);
}

.target-retargeting-section .content-targeting-topic-tree {
    background-color: #fff !important;
}

.target-retargeting-section .content-targeting-topic-tree-parent {
    max-height: 250px;
    overflow-y: auto;
}

#placement-sidebar-nav .xux-badge.xux-emptyBadge {
    display: none !important;
}

#mdx_dialog .xux-modalWindow-content {
    word-break: break-all !important;
}

.target-retargeting-section .xux-margin-normal [class*="xux-horizontalLayout-item-5.5"],
.target-audience-section .xux-margin-normal [class*="xux-horizontalLayout-item-5.5"],
.target-content-targeting-section .xux-margin-normal [class*="xux-horizontalLayout-item-5.5"] {
    vertical-align: top !important;
}

.mdx-campaign-section > h2.mdx-section-title,
.mdx-ads-creative-list-section > h2.mdx-section-title,
.ad-option-section > h2.mdx-section-title,
.target-retargeting-section > h2.mdx-section-title,
.target-audience-section > h2.mdx-section-title,
.target-content-targeting-section > h2.mdx-section-title {
    background: #F0F0F0;
}

.mdx-ads-group-section > h2.mdx-section-title {
    background: #FAFAFA;
}

.mdx-main-keyword-section > h2.mdx-section-title,
.mdx-except-keyword-section > h2.mdx-section-title,
.display-creative-section > h2.mdx-section-title,
.search-creative-section > h2.mdx-section-title,
.mdx-ads-group-section > div.xux-section-content,
.mdx-ads-creative-list-section > div.xux-section-content {
    background: #F5F5F5;
}

.mdx-ads-creative-list-section > h2.mdx-section-title,
.mdx-main-keyword-section > h2.mdx-section-title,
.mdx-except-keyword-section > h2.mdx-section-title,
.ad-option-section  > h2.mdx-section-title,
.target-retargeting-section > h2.mdx-section-title,
.target-audience-section > h2.mdx-section-title,
.target-content-targeting-section > h2.mdx-section-title {
    padding-left: 32px !important;
}

.search-creative-section > h2.mdx-section-title,
.display-creative-section > h2.mdx-section-title {
    padding-left: 48px !important;
}

.mdx-campaign-section > h2.mdx-section-title,
.mdx-ads-creative-list-section > h2.mdx-section-title,
.ad-option-section > h2.mdx-section-title,
.target-retargeting-section > h2.mdx-section-title,
.target-audience-section > h2.mdx-section-title,
.target-content-targeting-section > h2.mdx-section-title,
.mdx-ads-group-section > h2.mdx-section-title,
.mdx-main-keyword-section > h2.mdx-section-title,
.mdx-except-keyword-section > h2.mdx-section-title,
.display-creative-section > h2.mdx-section-title,
.search-creative-section > h2.mdx-section-title {
    cursor: pointer;
}

.mdx-rating {
    display: flex;
    align-items: center;
    font-size: 16px;
}

.mdx-rating > span:not(:first-child) {
    margin-left: 5px;
}

.mdx-icon-color-gray {
    color: #BFBFBF;
}

.mdx-text-align-right {
    text-align: right !important;
}

.mdx-web-topic-card {
    box-sizing: border-box;
    border: 2px solid #ccc;
    padding: 24px;
    width: 385px;
    position: relative;
}

.row-main:focus-within {
    outline: thin dotted;
}

.row-main a:focus {
    outline: none;
}

.mdx-web-topic-card:not(:first-child) {
    margin-top: 16px
}

.mdx-web-topic-card:not(.mdx-web-topic-card-selected):focus {
    border-color: transparent;
    outline: 3px dotted rgba(144, 215, 219);
    outline-offset: -3px;
}

.mdx-web-topic-card:not(.mdx-web-topic-card-selected):hover {
    border-color: transparent;
    outline: 3px solid rgba(144, 215, 219);
    outline-offset: -3px;
}

.mdx-web-topic-card.mdx-web-topic-card-selected {
    border-color: transparent;
    padding: 24px;
    outline: 3px solid #009da6;
    outline-offset: -3px;
}

.mdx-web-topic-row {
    display: flex;
}

.mdx-web-topic-row:not(:last-child) {
    margin-bottom: 8px;
}

.mdx-web-topic-stars-box {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.mdx-web-topic-row > span.row-main {
    flex-grow: 1;
    flex-shrink: 1;
    word-break: keep-all;
    cursor: pointer;
}
.mdx-web-topic-row > span.row-suffix {
    text-align: right;
    font-size: 14px;
    color: #736c6c;
    flex: auto;
}

.mdx-text-ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.mdx-flex-basis-80 {
    flex-basis: 80%;
}
.mdx-flex-basis-20 {
    flex-basis: 20%;
}
.mdx-flex-basis-40 {
    flex-basis: 40%;
}
.mdx-flex-basis-60 {
    flex-basis: 60%;
}

.mdx-font-size-24 {
    font-size: 24px;
}
.mdx-font-size-18 {
    font-size: 18px;
}
.mdx-font-size-16 {
    font-size: 16px;
}
.mdx-font-size-14 {
    font-size: 14px;
}
.mdx-font-size-12 {
    font-size: 12px;
}

.mdx-line-height-16 {
    line-height: 16px;
}
.mdx-line-height-18 {
    line-height: 18px;
}

.mdx-web-ai-card {
    position: relative;
    box-sizing: border-box;
    border: 2px solid #ccc;
    padding:24px;
    min-width: 355px;
    width: auto;
    min-height: 134px;
}

.mdx-web-ai-card:not(.mdx-web-ai-card-selected):focus {
    border-color: transparent;
    outline: 3px dotted rgba(144, 215, 219);
    outline-offset: -3px;
}

.mdx-web-ai-card.mdx-web-ai-card-selected {
    border-color: transparent;
    padding: 24px;
    outline: 3px solid #009da6;
    outline-offset: -3px;
}

.mdx-web-ai-card:not(.mdx-web-ai-card-collapsed) {
    padding: 24px 24px 74px 24px !important;
}

.mdx-web-ai-card:not(.mdx-web-ai-card-selected):hover {
    border-color: transparent;
    outline: 3px solid rgba(144, 215, 219);
    outline-offset: -3px;
}

.mdx-web-topic-row .xux-icon.xux-icon-redirect {
    font-size: 16px;
    margin-right: 4px;
    color: #00838d;
    vertical-align: middle;
}
.mdx-web-topic-stars-box .xux-button.xux-size-small .xux-iconButton {
    font-size: 20px;
    height: 20px;
    width: 20px;
    display: flex;
    align-items: center;
}

.mdx-web-topic-stars-box .xux-icon.xux-icon-size-small.xux-icon-property.xux-button-icon {
    font-size: 20px;
    line-height: 1;
    width: 20px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.mdx-web-topic-stars-box .xux-icon.xux-icon-size-small.mdx-icon-heat-map.xux-button-icon {
    font-size: 20px;
    line-height: 18px;
    width: 18px;
    height: 18px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.mdx-web-ai-summary-box.xux-button.xux-size-small .xux-iconButton .xux-icon {
    font-size: 20px;
}
.mdx-web-ai-summary-toolbar {
    padding: 0 120px 0 0;
    position: relative;
    height: 16px;
    display: flex;
    align-items: center;
}

.mdx-web-ai-summary-toolbar .xux-button.xux-size-small .xux-iconButton .xux-icon {
    font-size: 20px;
    line-height: 1;
}

.mdx-web-ai-factor-rating {
    line-height: 26px;
}

.mdx-web-ai-summary-title-position {
    line-height: 22px;
    margin: 12px 0 0 0;
}
.mdx-web-ai-card.mdx-web-ai-card-collapsed .mdx-web-ai-summary-title-position {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.mdx-web-ai-summary-text-position {
    line-height: 24px!important;
    margin: 12px 0px 0px 0px;
}

.mdx-web-ai-scores-text,
.mdx-web-ai-issue-name-text {
    color: #736c6c;
}


.mdx-web-ai-detail-item-title {
    display: flex;
    align-items: center;
}

.mdx-web-ai-detail-item-title > .xux-icon {
    color: #736c6c;
    margin-right: 8px;
}

.mdx-web-ai-card > hr {
    margin-left: -24px;
    margin-right: -24px;
}

.mdx-web-ai-card.mdx-web-ai-card-collapsed > hr,
.mdx-web-ai-card.mdx-web-ai-card-collapsed > .mdx-web-ai-details-box {
    display: none;
}

.mdx-web-ai-card.mdx-web-ai-card-collapsed .xux-icon-uparrowhead::before {
    transform: rotate(180deg);
}

.mdx-web-ai-detail-item:not(:first-child) {
    margin-top: 24px
}

.mdx-web-ai-detail-item p {
    margin-top: 8px;
    margin-bottom: 0px;
}

.mdx-web-ai-summary-text,.mdx-web-ai-detail-item-desc {
    line-height: 1.5;
}

span.xux-button.ui-state-disabled:has(>.mdx-web-ai-pushpin-btn) {
    opacity: 1;
}

section.mdx-side-collapsible-section.mdx-collapsed {
    width: 44.5px;
    position: relative;
}

section.mdx-side-collapsible-section.mdx-collapsed > div {
    display: none;
}

section.mdx-side-collapsible-section.mdx-collapsed > h2.xux-section-title {
    padding: 40px 11px 16px 11px!important;
    padding-left: 11px!important;
    writing-mode: vertical-lr;
    position:absolute;
    top: 0px;
    left: 0px;
    /* z-index:99; */
    width: 44.5px;
    height: 100%;
}

section.mdx-side-collapsible-section.mdx-collapsed .mdx-section-header-btn {
    top: 8px;
    right: 6px!important;
}

section.mdx-side-collapsible-section.mdx-collapsed .xux-section-title-text {
    transform: rotate(90deg) translateX(50%);
    writing-mode: lr;
}

section.mdx-side-collapsible-section.mdx-collapsed+section,
section.mdx-side-collapsible-section.mdx-collapsing+section {
    display: none;
}

#website-plan-setting-btn {
    border:0px;
    cursor: pointer;
}

div.mdx-web-ai-card-tag-box {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 16px 24px;
    border-top: 1px solid #ccc;
    box-sizing: border-box;
}
.mdx-measure-tags-container {
    background: #fff;
    color: #0a0a0a;
    border: 1px solid #8c8c8c;
    width: calc(100% - 34px) !important;
    min-height: 32px;
    box-sizing: border-box;
    padding: 4px 8px;
    line-height: 22px;
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.mdx-measure-tags-container.disabled {
    cursor: default;
    border: 1px solid transparent;
}
.mdx-measure-tag-item {
    border-radius: 5px;
    display: inline-block;
    padding: 0 4px;
}

.mdx-measure-tag-text {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
    display: block;
    white-space: nowrap;
}
.mdx-measure-tag-close {
    vertical-align: middle;
    margin-left: 4px;
}
.mdx-measure-tag-close:before {
    cursor: pointer;
}

/* COMMENT dialog */
span.mdx-comment-textarea-wrapper {
    border-radius: 4px;
    border: 1px solid rgb(140, 140, 140);
    background-color: #FFF;
    display: inline-flex;
    padding: 2px;
    box-sizing: border-box;
    width: 100%;
    margin-top: 10px;
}

span.mdx-comment-textarea-wrapper > textarea {
    flex-grow: 1;
    border-color: transparent;
    box-shadow: none;
    outline: none;
    resize: none;
    -ms-resize: none;
    -moz-resize: none;
    -webkit-resize: none;
}
div.mdx-comment-popup-titlebar > span.xux-button > button.xux-iconButton > span.xux-icon,
div.mdx-comment-item-header > span.xux-button > button.xux-iconButton > span.xux-icon {
    width: 16px;
    height: 16px;
    line-height: 16px;
    font-size: 16px;
}
span.mdx-comment-textarea-wrapper > span.xux-button > button.xux-iconButton {
    width: 22px;
    height: 22px;
}
span.mdx-comment-textarea-wrapper > span.xux-button > button.xux-iconButton > span.xux-icon {
    width: 18px;
    height: 18px;
    line-height: 18px;
    font-size: 18px; 
}
span.mdx-comment-textarea-wrapper:has(textarea:not(:focus)):hover {
    background-color: #F0F0F0;
}

span.mdx-comment-textarea-wrapper:hover > textarea:not(:focus) {
    background-color: #F0F0F0;
}
span.mdx-comment-textarea-wrapper.mdx-comment-multi-rows {
    flex-direction: column;
}
span.mdx-comment-textarea-wrapper> span.xux-button {
    padding: 2px;
}
span.mdx-comment-textarea-wrapper.mdx-comment-multi-rows > span.xux-button {
    text-align: right;
}

span.mdx-comment-textarea-wrapper.mdx-comment-multi-rows:not(.ui-state-disable):has(button:not([disabled]):focus),
span.mdx-comment-textarea-wrapper.mdx-comment-multi-rows:not(.ui-state-disable):has(>textarea:not([disabled]):not([readonly]):focus) {
    border-color: #00838d;
    box-shadow: 0 0 0 1px #00838d inset;
}
span.mdx-comment-textarea-wrapper.mdx-comment-multi-rows:has(>textarea.xux-validate-error),
span.mdx-comment-textarea-wrapper.mdx-comment-multi-rows:has(>textarea.xux-validate-error:focus) {
    border-color: #b32029!important;
    box-shadow: 0 0 0 1px #b32029 inset!important;
}

.mdx-comment-popup-wrapper {
    max-width: initial !important;
    min-width: 280px;
    max-height: 300px;
}
.mdx-comment-popup-wrapper .xux-infotip-arrow {
    display: none;
}
.mdx-comment-popup-wrapper >.xux-infotip-body {
    padding: 0;
    width: 100%;
    height: 100%;
    min-width: 280px !important;
}

.mdx-comment-popup-titlebar {
    display: none;
    align-items: center;
    background: #eaeaea;
    padding: 2px 16px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.mdx-comment-popup-title {
    flex-grow: 1;
}

.mdx-comment-popup-body {
    display: none;
    overflow-y: auto;
    overflow-x: hidden;
    flex-direction: column;
    max-height: 160px !important;
}

.mdx-comment-popup-wrapper:has(.mdx-comment-item-wrapper) .mdx-comment-popup-body,
.mdx-comment-popup-wrapper:has(.mdx-comment-item-wrapper) .mdx-comment-popup-titlebar {
    display: flex;
}
.mdx-comment-popup-wrapper:has(.mdx-comment-item-wrapper) .mdx-comment-popup-footer {
    padding: 0px 16px 16px 16px;
}
.mdx-comment-popup-body .mdx-comment-item-wrapper {
    width: 100%;
}
.mdx-comment-item-wrapper {
    padding: 8px 16px;
    box-sizing: border-box;
    min-height: 112px;
    display: flex;
    flex-direction: column;
}
.mdx-comment-item-wrapper.hoverable:hover {
    background-color: #F0F0F0;
}
.mdx-comment-item-wrapper.hoverable:active {
    background-color: #b2b2b24d;
}
.mdx-comment-item-wrapper.mdx-comment-item-selected {
    background-color: #00848d66;
}
.mdx-comment-item-wrapper.mdx-comment-item-selected.hoverable:hover {
    background-color: #00848d33;
}
.mdx-comment-item-wrapper .underline {
    margin: 0px;
}
.mdx-comment-item-header {
    display: flex;
    align-items: center;
}
.mdx-comment-item-header .mdx-comment-author {
    flex-grow: 1;
}
.mdx-comment-item-time {
    color: #999;
}
.mdx-comment-item-cotentbox {
    flex-grow: 1;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
}