﻿@import url('ReferenceTheme.OutSystemsUIWeb.BaseTheme.Plain.css?90005');
@import url('ReferenceTheme.DigitalUI_Th.DigitalUI_Th.Plain.css?90836');
@import url('ReferenceTheme.Forums_Th.ForumsTheme.Plain.css?90005');
@import url('Theme.Forums.Plain.css?90005');

/*Theme.DigitalUI2_0_Th.css*/
.reload-6{}

:root {
    
    --border-radius-soft: 4px;
    --border-radius-mid: 8px;
    --border-radius-hard: 16px;
    --border-radius-circle: 100%;

    
    --color-neutral-0: #F8F9FA;
    --color-neutral-1: #F1F3F5;
    --color-neutral-2: #E9ECEF;
    --color-neutral-3: #DEE2E6;
    --color-neutral-4: #CED4DA;
    --color-neutral-5: #A3ACB5;
    --color-neutral-6: #6A7178;
    --color-neutral-7: #4F575E;
    --color-neutral-8: #272B30;
    --color-neutral-9: #1A1D20;
    --color-neutral-10: #151516;

    --color-indigo-lightest: #F1F2FF;
    --color-indigo-lighter: #E4E4FF;
    --color-indigo-light: #777AFD;
    --color-indigo: #4D4AE6;
    --color-indigo-dark: #3E34AC;
    --color-indigo-darker: #2D2477;

    
    --color-info-lighter: #E5F5FC;
    --color-info-light: #B2DFF1;
    --color-info: #0093D0;
    --color-info-dark: #00597E;
    
    --color-success-lighter: #EAF3EB;
    --color-success-light: #CAE9D0;
    --color-success: #4DB661;
    --color-success-dark: #207630;
    
    --color-warning-lighter: #FDF6E5;
    --color-warning-light: #FFE0B2;
    --color-warning: #FF9900;
    --color-warning-dark: #8B4300;
    
    --color-error-lighter: #FCEAEA;
    --color-error-light: #F4BCBC;
    --color-error: #DC2020;
    --color-error-dark: #A60000;
    
    --color-link-400: var(--color-neutral-10);
    --color-link-700: var(--color-neutral-10);
    --color-link: var(--color-neutral-10);
    
}

a,
a:visited,
a.has-underline {
    color: var(--color-neutral-10);
}

a:hover, 
a:visited:hover {
    color: var(--color-neutral-7);
}

.main a,
.main a:visited, 
.main a:hover, 
.main a:visited:hover,
a.has-underline {
    text-decoration: underline;
    text-underline-offset: 0.3em;
    text-decoration-thickness: 0.1em;
}

.main a:focus {
    color: var(--color-neutral-10);
    text-decoration: none;
}

.main a[class*="os-btn-"],
.main a[class*="btn"] {
    text-decoration: none; 
}

.main a[class*="os-btn-"]:focus,
.main a[class*="btn"]:focus {
    color: inherit;
}


.menu-left-wrapper a .menu-left {
    color: var(--color-neutral-7);
    font-weight: 500;
}

.menu-left-wrapper a {
    text-decoration: none;
    color: var(--color-neutral-7);
    font-weight: 500;
}

.menu-left-wrapper a .menu-left.is-selected {
    font-weight: 700;
}

.menu-left-wrapper a:hover {
    text-decoration: none;
    color: var(--color-neutral-10);
}

.menu-left.is-selected {
    background-color: var(--color-neutral-1);
}

.menu-left-wrapper a.has-underline {
    color: var(--color-neutral-10);
    text-decoration: underline;
    text-underline-offset: 0.3em;
    text-decoration-thickness: 0.1em;
}

.menu-left-wrapper a.has-underline:hover {
    color: var(--color-neutral-7);
}




a.ListNavigation_Previous, 
a.ListNavigation_Next, 
span.ListNavigation_PageNumber, 
span.ListNavigation_CurrentPageNumber, 
a.ListNavigation_PageNumber,
.ListNavigation_PageNumber {
    text-decoration: none;
}

.ListNavigation_PageNumber:hover, 
a.ListNavigation_Previous, 
a.ListNavigation_Next, 
.ListNavigation_PageNumber {
    color: var(--color-link);
}

a.ListNavigation_Previous:hover, 
a.ListNavigation_Next:hover {
    color: var(--color-neutral-7);
    text-decoration: none;
}


.input,
textarea.input, 
.select {
    border: var(--border-size-m) solid var(--color-neutral-5);
}

::placeholder {
    color: var(--color-neutral-6);
}

:-ms-input-placeholder {
    color: var(--color-neutral-6);
}

::-ms-input-placeholder {
    color: var(--color-neutral-6);
}

input::placeholder {
    color: var(--color-neutral-6);
}

input::-webkit-input-placeholder  {
    color: var(--color-neutral-6);
}

input::-moz-placeholder  {
    color: var(--color-neutral-6);
}

input:-ms-input-placeholder {
    color: var(--color-neutral-6);
}

input::-ms-input-placeholder {
    color: var(--color-neutral-6);
}

.input::placeholder {
    color: var(--color-neutral-6);
}

.input-with-icon::placeholder {
    color: var(--color-neutral-6);
}

.search .input-with-icon .input-with-icon-content-icon + .input-with-icon-input input::-webkit-input-placeholder{
    color: var(--color-neutral-6);
}
.search .input-with-icon .input-with-icon-content-icon + .input-with-icon-input input::-moz-placeholder{
    color: var(--color-neutral-6);
}
.search .input-with-icon .input-with-icon-content-icon + .input-with-icon-input input:-ms-input-placeholder{
    color: var(--color-neutral-6);
}
.search .input-with-icon .input-with-icon-content-icon + .input-with-icon-input input::-ms-input-placeholder{
    color: var(--color-neutral-6);
}
.search .input-with-icon .input-with-icon-content-icon + .input-with-icon-input input::placeholder{
    color: var(--color-neutral-6);
}
.search .input-with-icon .input-with-icon-content-icon + .input-with-icon-input input:-ms-input-placeholder{
    color: var(--color-neutral-6);
}
.search .input-with-icon .input-with-icon-content-icon + .input-with-icon-input input::-ms-input-placeholder {
    color: var(--color-neutral-6);
}


.dropdown .dropdown-content .dropdown-content-list a {
    text-decoration: none;
}


.search-forums .search-balloon a {
    text-decoration: none;
}


.pika-prev, 
.pika-next {
    color: var(--color-neutral-10);
}

.is-selected .pika-button,
.is-selected:hover .pika-button {
    background-color: var(--color-neutral-10);
} 

.pika-month.is-selected, .pika-year.is-selected {
    background-color: var(--color-neutral-10);
}


.button-group input[type="radio"]:hover + .btn {
    background-color: var(--color-neutral-4);
    border-color: var(--color-neutral-4);
}

.button-group input[type="radio"]:checked + .btn {
    background-color: var(--color-neutral-10);
    border-color: var(--color-neutral-10);
}


 
.fr-toolbar.fr-top, .fr-box.fr-basic.fr-top .fr-wrapper {
    border: var(--border-size-m) solid var(--color-neutral-5);
}

.fr-toolbar.fr-top, .fr-box.fr-basic.fr-top .fr-wrapper {
    border: var(--border-size-m) solid var(--color-neutral-5);
}

.fr-toolbar.fr-top, 
.fr-second-toolbar,
.fr-box.fr-basic .fr-wrapper {
    border: var(--border-size-none);
}

.fr-toolbar.fr-top,
.fr-box.fr-basic.fr-top .fr-wrapper {
    border: var(--border-size-m) solid var(--color-neutral-5);
}

.fr-toolbar.fr-top, .fr-second-toolbar, .fr-box.fr-basic .fr-wrapper {
    border-bottom: var(--border-size-none);
}

.fr-box.fr-basic.fr-top .fr-wrapper {
    border-top: var(--border-size-none);
}

.fr-toolbar .fr-command.fr-btn svg path, 
.fr-popup .fr-command.fr-btn svg path, 
.fr-modal .fr-command.fr-btn svg path, 
.fr-show-tags .fr-modal-more svg path {
    fill: var(--color-neutral-5);
}

.fr-toolbar .fr-command.fr-btn.fr-active svg path,
.fr-popup .fr-command.fr-btn.fr-dropdown.fr-active, 
.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active,
.fr-popup .fr-command.fr-btn.fr-btn-active-popup, 
.fr-toolbar .fr-command.fr-btn.fr-btn-active-popup,
.fr-toolbar .fr-command.fr-btn.fr-btn-active-popup svg path,
.fr-desktop .fr-command.fr-selected:not(.fr-table-cell), 
.fr-desktop .fr-command:active,
.fr-modal .fr-command.fr-btn.fr-dropdown.fr-active:hover, 
.fr-popup .fr-command.fr-btn.fr-dropdown.fr-active:hover, 
.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active:hover,
.fr-toolbar .fr-command.fr-btn.fr-expanded svg path,
.fr-popup .fr-command.fr-btn.fr-active svg path,
.fr-popup.fr-mobile .fr-command.fr-blink,
.fr-toolbar.fr-mobile .fr-command.fr-blink,
.fr-toolbar .fr-btn-grp .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path,
.fr-toolbar .fr-more-toolbar .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path, 
.fr-toolbar .fr-buttons:not(.fr-tabs) .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path, 
.fr-popup .fr-btn-grp .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path, 
.fr-popup .fr-more-toolbar .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path, 
.fr-popup .fr-buttons:not(.fr-tabs) .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path, 
.fr-modal .fr-btn-grp .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path, 
.fr-modal .fr-more-toolbar .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path, 
.fr-modal .fr-buttons:not(.fr-tabs) .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path {
    fill: var(--color-neutral-6);
}

.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active:after,
.fr-popup .fr-command.fr-btn.fr-dropdown.fr-active:after {
    border-top-color: var(--color-neutral-5);
}


.card-d2 {
    border-radius: var(--border-radius-mid);
    border: 1px solid var(--color-neutral-3);
    box-shadow: 0 3px 8px 0 rgba(16, 18, 19, 0.05);
}

a.card-d2:hover {
    box-shadow: 0 3px 8px 0 rgba(16, 18, 19, 0.20);
}


.file-uploading .filepond--label-action {
    color: var(--color-neutral-10);
    text-decoration: underline;
}

.file-uploading .filepond--panel-root {
    border: var(--border-size-s) dashed var(--color-neutral-4);
}

.filepond--drop-label span.filepond-label-note {
    color: var(--color-neutral-5);
}



.checkbox:hover:before,
.radio-button:hover:before,
.TableRecords .TableRecords_Header [type="checkbox"]:hover:before {
    border-color: var(--color-neutral-7);
}

.checkbox:checked:before,
.TableRecords .TableRecords_Header [type="checkbox"]:checked:before,
.checkbox:hover:checked:before,
.TableRecords .TableRecords_Header [type="checkbox"]:hover:checked:before {
    background-color: var(--color-neutral-10);
    border-color: var(--color-neutral-10);
}

.radio-button:checked:before,
.radio-button:checked:hover:before {
    border-color: var(--color-neutral-10);
}

.checkbox:before {
    border: var(--border-size-m) solid var(--color-neutral-7);
}

.checkbox:hover:before {
    border: var(--border-size-m) solid var(--color-neutral-5);
}

.checkbox:checked:before {
    background-color: var(--color-neutral-10);
    border: var(--border-size-m) solid var(--color-neutral-10);
}

.checkbox:hover:checked:before {
    background-color: var(--color-neutral-5);
    border: var(--border-size-m) solid var(--color-neutral-5);
}


.file-uploading .filepond--panel-root {
    border: var(--border-size-s) dashed var(--color-neutral-6);
}

.file-uploading [data-filepond-item-state="processing-complete"] {
    border: var(--border-size-s) solid var(--color-neutral-5);
}

.file-uploading [data-filepond-item-state="processing-complete"] .filepond--file-action-button.filepond--file-action-button svg, .file-uploading [data-filepond-item-state*=error] .filepond--file-action-button.filepond--file-action-button svg, .file-uploading [data-filepond-item-state*=invalid] .filepond--file-action-button.filepond--file-action-button svg {
    color: var(--color-neutral-5);
}


.tippy-tooltip.light-theme {
    border: var(--border-size-m) solid var(--color-neutral-5);
}


.choices__list--single .choices__item[data-value="0"] {
    color: var(--color-neutral-6);
}

.choices__inner,
.search--wrapper input {
    border: var(--border-size-m) solid var(--color-neutral-5);
}

.choices[data-type*=select-one]:after {
    color: var(--color-neutral-5);
}


.ms-drop input[type="checkbox"]:checked:before {
    background-color: var(--color-neutral-10);
    border-color: var(--color-neutral-10);
}

.ms-drop input[type="checkbox"]:before {
    border: var(--border-size-m) solid var(--color-neutral-5);
    border-radius: 0;
}



.main a.os-btn-primary:visited {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.main a.os-btn-primary:hover,
.main a.os-btn-primary:visited:hover {
    color: var(--color-white);
}

.main a.os-btn-primary:focus {
    color: var(--color-white);
}

.main a.os-btn-primary[disabled],
.main a.os-btn-primary:disabled {
    color: var(--color-neutral-4);
}


.main a.os-btn-secundary:visited  {
    color: var(--color-black);
}

.main a.os-btn-secundary:hover,
.main a.os-btn-secundary:visited:hover {
    color: var(--color-black);
}

.os-btn-secundary:focus {
    color: var(--color-black);
}

.main a.os-btn-secundary[disabled],
.main a.os-btn-secundary:disabled {
    color: var(--color-neutral-2);
}


.main a.os-btn-cancel:visited {
    color: var(--color-neutral-7);
}

.os-btn-cancel:hover, 
.main a.os-btn-cancel:hover,
.main a.os-btn-cancel:visited:hover {
    color: var(--color-neutral-7);
}

.main .os-btn-cancel:focus {
    color: var(--color-neutral-7);
}

.main a.os-btn-cancel[disabled], 
.main a.os-btn-cancel:disabled {
    color: var(--color-neutral-2);
}

 
.main a.os-btn-cancel-inverted:visited {
    color: var(--color-neutral-6);
}

.main a.os-btn-cancel-inverted:hover,
.main a.os-btn-cancel-inverted:visited:hover {
    color: var(--color-neutral-8);
}

.main .os-btn-cancel-inverted:focus {
    color: var(--color-neutral-8);
}

.main a.os-btn-cancel-inverted[disabled],
.main a.os-btn-cancel-inverted:disabled {
    color: var(--color-neutral-2);
}


.main a.os-btn-confirm:hover,
.main a.os-btn-confirm:visited:hover {
    background-color: var(--color-green);
    color: var(--color-white);
}

.main a.os-btn-confirm:focus {
    color: var(--color-white);
}

.main a.os-btn-confirm[disabled],
.main a.os-btn-confirm:disabled {
    color: var(--color-neutral-4);
}


.main a.os-btn-utility:hover,
.main a.os-btn-utility:visited:hover {
    color: var(--color-white);
}

.main a.os-btn-utility:focus {
    color: var(--color-white);
}

.main a.os-btn-utility[disabled],
.main a.os-btn-utility:disabled {
    color: var(--color-neutral-4);
}


.main a.os-btn-dark:hover,
.main a.os-btn-dark:visited:hover {
    color: var(--color-white);
}

.main a.os-btn-dark:focus {
    color: var(--color-white);
}

.main a.os-btn-dark[disabled],
.main a.os-btn-dark:disabled {
    color: var(--color-white);
}


.main a.os-btn-dark-inverted:visited {
    color: var(--color-neutral-10);
}

.main a.os-btn-dark-inverted:hover,
.main a.os-btn-dark-inverted:visited:hover {
    color: var(--color-neutral-8);
}

.main a.os-btn-dark-inverted:focus {
    color: var(--color-neutral-8);
}

.main a.os-btn-dark-inverted[disabled],
.main a.os-btn-dark-inverted:disabled {
    color: var(--color-neutral-10);
}


.main a.os-btn-light:visited {
    background-color: var(--color-white);
    color: var(--color-black);
}

.main a.os-btn-light:hover,
.main a.os-btn-light:visited:hover {
    color: var(--color-black);
}

.main a.os-btn-light:focus {
    color: var(--color-black);
}


.main a.os-btn-light[disabled],
.main a.os-btn-light:disabled {
    color: var(--color-neutral-10);
}


.main a.os-btn-light-inverted:visited {
    color: var(--color-white);
}

.main a.os-btn-light-inverted:hover,
.main a.os-btn-light-inverted:visited:hover {
    color: var(--color-white);
}

.main a.os-btn-light-inverted:focus {
    color: var(--color-white);
}

.main a.os-btn-light-inverted[disabled],
.main a.os-btn-light-inverted:disabled {
    color: var(--color-neutral-6);
}


.btn-sp {
    color: var(--color-neutral-7);
}
a.btn-sp:hover {
    text-decoration: none;
}

.topic-create .post-context-dropdown .ms-parent.select:hover {
    border: var(--border-size-m) solid var(--color-neutral-7);
}

.gamefication-section a {
    color: var(--color-neutral-10);
}

a [class*="osicons-v2-thumbs"] {
    color: var(--color-neutral-5);
}

.border-bottom-size-s {
    border-bottom: var(--border-size-s) solid var(--color-neutral-3);
}

.solution-post-background {
    background: var(--color-success-light);
}

.ai-generated-warning {
    background-color: var(--color-info-light);
}

.post-view .guidelines-card a.internal-link {
    color: var(--color-link);
}

.solution-post-background .comment-thread-pre-filled-text {
    background-color: var(--color-transparent);
}

.topic-forge-component {
    border-radius: var(--border-radius-mid);
    border: 1px solid var(--color-neutral-3);
    box-shadow: 0 3px 8px 0 rgba(16, 18, 19, 0.05);
}

.Post_Quote, .post-quote-reply {
    color: var(--color-neutral-7);
}

.phone .pagination-mobile,
.phone .pagination-mobile .col-sp {
    text-align: center;
}

.topic-card {
    border-bottom: var(--border-size-s) solid var(--color-neutral-1);
}

.main .topic-card a {
    text-decoration: none;
}

.topic-card .title a {
    color: var(--color-neutral-8);
}

.topic-card .title a:visited {
    color: var(--color-neutral-7);
}

.fr-popup .fr-checkbox input:checked+span {
    background: var(--color-neutral-10);
    border: solid 2px var(--color-neutral-10);
}

.min-rank {
    min-width: 80px;
}


.tag-neutral {
    color: var(--color-neutral-7);
    border: 1px solid var(--color-neutral-4);
    background-color: var(--color-white);
}

.tag.background-info-lighter {
    color: var(--color-info-dark);
}

.tag.background-error-lighter {
    color: var(--color-error-dark);
}

.tag.os-staff {
    min-width: 47px;
}

.tag.solved {
    background-color: var(--color-success-lighter);
    border-radius: var(--border-radius-hard-rounded);
    color: var(--color-success-dark);
    font-size: var(--font-size-xs);
    font-weight: var(--font-medium);
    height: 1.25rem;
}

.tag.solved [class*="osicons-v2"] {
    color: var(--color-success-dark);
}

.line.text-solution-tag {
    background-color: var(--color-success-lighter);
    border-color: var(--color-success-lighter);
    border-radius: var(--border-radius-hard);
    color: var(--color-success-dark);
}

.text-solution-tag .osicons-v2-select:before {
    color: var(--color-success-dark);
}

.tag.background-indigo .tag-content .text-neutral-7 {
    color: var(--color-white);
}

.tag.background-indigo .tag-content [class*="osicons-v2"] {
    color: var(--color-white);
    font-size: var(--font-size-s);
}

.tag.deleted {
    background-color: var(--color-neutral-1);
    border: none;
    color: var(--color-neutral-8);
    font-weight: var(--font-medium);
}

.tag.spam {
    background-color: var(--color-error-lighter);
    border: none;
    color: var(--color-error-dark);
    font-size: var(--font-size-s);
    font-weight: var(--font-medium);
}

.tag.spam .tag-content {
    font-size: var(--font-size-s);
}

.tag-content {
    white-space: nowrap;
}


.ai-generated-frame {
    border: var(--border-size-s) solid var(--color-indigo-light);
    border-bottom: var(--border-size-none);
    border-radius: var(--border-radius-mid) var(--border-radius-mid) var(--border-radius-none) var(--border-radius-none);
}

.ai-generated-warning {
    background-color: var(--color-indigo-lighter);
    border: var(--border-size-s) solid var(--color-indigo-light);
    border-top: var(--border-size-none);
    border-radius: var(--border-radius-none) var(--border-radius-none) var(--border-radius-mid) var(--border-radius-mid);
    color: var(--color-neutral-10);
}

.ai-frame {
    border: var(--border-size-s) solid var(--color-indigo-light);
    border-radius: var(--border-radius-mid);
}

.ai-frame .comment {
    margin-top: var(--space-none);
}


.comment-thread .accordion-item, .comment-thread .accordion-item.is--open {
    padding: var(--space-base);
}

.phone .post-view .topic-detail-wrapper .posts-wrapper-list {
    margin-left: var(--space-none);
}

@media (max-width: 725px) {
    .topic-creator .poster-name {
        white-space: normal;
    }
}

.poster-name {
    align-items: center;
    display: inline-flex;
}


.comment-thread .accordion {
    border: none; 
    margin-top: var(--space-m);
}

.phone .post-view .comment-thread .accordion-item, 
.tablet .post-view .comment-thread .accordion-item, 
.comment-thread .accordion-item,
.comment-thread .accordion-item.is--open {
    background-color: var(--color-neutral-0);
    border-radius: var(--border-radius-mid);
    border: var(--border-size-s) solid var(--color-neutral-2);
    padding: var(--space-s);
}

.comment-thread .accordion-item-header {
    padding: var(--space-none);
}

.comment-thread .accordion-item.is--open .accordion-item-header {
    border-bottom: var(--border-size-s) solid var(--color-neutral-2);
    padding-bottom: var(--space-s);
}

.comment-thread-pre-filled-text {
    background-color: var(--color-neutral-2);
    color: var(--color-neutral-7);
}

.comment-thread .commment {
    margin-top: var(--space-s);
}

.comment-user-translate {
    align-items: center;
    display: flex; 
    flex-direction: row;
    justify-content: space-between;
}

.comment-translate {
    display: inline-flex;
    justify-content: flex-end;
}

.topic-detail-wrapper .dropdown-simple--translate .dropdown-header {
    padding-left: var(--space-none);
    padding-right: var(--space-none);
}

@media (max-width: 725px) {
    .comment-user-translate {
        flex-direction: column;
    }

    .comment-translate {
        margin-top: var(--space-s);
        width: 100%;
    }

    .topic-detail-wrapper .dropdown-simple--translate {
        align-self: flex-end;
    }

    .comment-user-translate .no-responsive.ThemeGrid_Width6 {
        width: auto;
    }
}

.user-name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
}

@media (min-width: 725px) {
    .user-name {
        -webkit-line-clamp: 1;
    }
}


.top-right-actions-tags {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-base);
    flex-wrap: wrap;
    margin-top: var(--space-s);
}

.top-right-actions-tags > div {
    display: inline-flex;
}


.fake-input.fake-forum {
    border-radius: 6px;
}


[class*="os-btn"].os-btn-see-solution,
[class*="os-btn"].os-btn-see-solution:hover  {
    background-color: var(--color-white);
    border-radius: var(--border-radius-mid);
    color: var(--color-black);
}


.solution-post-background {
    background-color: var(--color-neutral-1);
    border-radius: var(--border-radius-mid);
}


.neo-wrapper {
    background-color: var(--color-white);
    border: var(--border-size-s) solid var(--color-neutral-8);
    border-radius: var(--border-radius-mid);
    padding: var(--space-m);
}

.neo-wrapper .neo-btn {
    border-radius: 50px;
}