.bbcode-content {
    line-height: 1.5;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word
}

.bbcode-content a {
    color: #1d4ed8;
    text-decoration: underline;
    text-underline-offset: .12em
}

.bbcode-content a:hover,
.bbcode-content a:focus-visible {
    color: #1e40af
}

.bbcode-content .bbcode-underline {
    text-decoration: underline
}

.bbcode-content .bbcode-heading {
    margin: .7rem 0 .5rem;
    line-height: 1.25
}

.bbcode-content .bbcode-heading-1 {
    font-size: 1.6rem
}

.bbcode-content .bbcode-heading-2 {
    font-size: 1.35rem
}

.bbcode-content .bbcode-heading-3 {
    font-size: 1.2rem
}

.bbcode-content .bbcode-heading-4 {
    font-size: 1.05rem
}

.bbcode-content .bbcode-align-left {
    text-align: left
}

.bbcode-content .bbcode-align-center {
    text-align: center
}

.bbcode-content .bbcode-align-right {
    text-align: right
}

.bbcode-content .bbcode-quote {
    margin: .75rem 0;
    padding: .65rem .85rem;
    border-left: 4px solid #2563eb;
    background: rgba(37, 99, 235, .1);
    border-radius: .45rem
}

.bbcode-content .bbcode-quote-author {
    display: block;
    margin: 0 0 .35rem;
    color: var(--bbcodeQuoteAuthorColor, #1e3a8a);
    font-weight: 700;
    font-style: normal
}

.bbcode-content .bbcode-code {
    margin: .8rem 0;
    padding: .6rem .7rem;
    background: #0f172a;
    color: #e2e8f0;
    border-radius: .45rem;
    overflow: auto;
    white-space: pre
}

.bbcode-content .bbcode-code code {
    font-family: Consolas, 'Courier New', monospace;
    font-size: .88rem
}

.bbcode-content .bbcode-image {
    max-width: 100%;
    height: auto;
    border-radius: .35rem
}

.bbcode-content .bbcode-iframe-wrap {
    margin: .85rem 0
}

.bbcode-content .bbcode-iframe {
    max-width: none;
    border: 1px solid rgba(100, 116, 139, .55);
    border-radius: .45rem;
    background: #000
}

.bbcode-editor-visual .bbcode-iframe-wrap {
    position: relative;
    display: inline-block;
    max-width: 100%
}

.bbcode-editor-visual .bbcode-iframe {
    pointer-events: none;
    user-select: none
}

.bbcode-editor-visual .bbcode-iframe-wrap::after {
    content: 'iframe';
    position: absolute;
    top: .35rem;
    left: .35rem;
    padding: .1rem .38rem;
    border-radius: .28rem;
    background: rgba(15, 23, 42, .75);
    color: #fff;
    font: 700 .72rem/1 'Segoe UI', Tahoma, sans-serif;
    letter-spacing: .02em
}

.bbcode-content .bbcode-table-wrap {
    overflow: auto;
    margin: .75rem 0
}

.bbcode-content .bbcode-table {
    width: 100%;
    border-collapse: collapse;
    white-space: normal
}

.bbcode-content .bbcode-table th,
.bbcode-content .bbcode-table td {
    border: 1px solid rgba(100, 116, 139, .5);
    padding: .35rem .45rem;
    vertical-align: top;
    background: var(--bbcodeTableTdBackground, transparent);
    color: var(--bbcodeTableTdColor, inherit)
}

.bbcode-content .bbcode-table th {
    background: var(--bbcodeTableThBackground, #e2e8f0);
    color: var(--bbcodeTableThColor, #0f172a);
    font-weight: 700
}

.bbcode-content .bbcode-list {
    margin: .55rem 0 .55rem 1.1rem;
    padding-left: .7rem;
    white-space: normal
}

.bbcode-content .bbcode-list li {
    margin: .2rem 0
}

.bbcode-content .bbcode-hr {
    border: 0;
    border-top: 1px solid rgba(100, 116, 139, .55);
    margin: .9rem 0
}

.bbcode-content .bbcode-style-arial {
    font-family: Arial, Helvetica, sans-serif
}

.bbcode-content .bbcode-style-verdana {
    font-family: Verdana, Geneva, sans-serif
}

.bbcode-content .bbcode-style-tahoma {
    font-family: Tahoma, Geneva, sans-serif
}

.bbcode-content .bbcode-style-trebuchet {
    font-family: 'Trebuchet MS', sans-serif
}

.bbcode-content .bbcode-style-georgia {
    font-family: Georgia, serif
}

.bbcode-content .bbcode-style-times {
    font-family: 'Times New Roman', Times, serif
}

.bbcode-content .bbcode-style-courier {
    font-family: 'Courier New', Courier, monospace
}

.bbcode-editor-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .32rem;
    margin: 0 0 .45rem;
    padding: .45rem;
    border: 1px solid var(--bbUiBorderSoft);
    border-radius: .45rem;
    background: var(--bbUiBg)
}

.bbcode-editor-btn {
    appearance: none;
    min-width: 2rem;
    min-height: 2rem;
    padding: 0 .45rem;
    border: 1px solid var(--bbUiBorder);
    border-radius: .35rem;
    background: var(--bbUiBg);
    color: var(--bbUiText);
    font: 700 .78rem/1 'Segoe UI', Tahoma, sans-serif;
    white-space: nowrap;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease
}

.bbcode-editor-btn:hover,
.bbcode-editor-btn:focus-visible {
    background: var(--bbUiHoverBg);
    border-color: var(--bbUiFocus);
    outline: none
}

.bbcode-editor-btn.is-active {
    background: var(--bbUiActive);
    border-color: var(--bbUiActiveBorder);
    color: #fff
}

.bbcode-editor-btn.is-disabled {
    opacity: .45;
    cursor: not-allowed
}

.bbcode-editor-lineinfo {
    margin-left: auto;
    padding: 0 .2rem;
    color: var(--bbUiMuted);
    font: 600 .78rem/1 'Segoe UI', Tahoma, sans-serif;
    white-space: nowrap
}

.bbcode-editor-input,
.bbcode-editor-visual {
    width: 100%;
    box-sizing: border-box;
    min-height: 180px;
    height: 360px;
    max-height: 72vh;
    overflow: auto
}

.bbcode-editor-input {
    border: 1px solid var(--bbUiBorder);
    border-radius: .35rem;
    padding: .55rem;
    background: var(--bbUiBg);
    color: var(--bbUiText);
    caret-color: var(--bbUiText);
    line-height: 1.45;
    font-family: 'Segoe UI', Tahoma, sans-serif;
    resize: none
}

.bbcode-editor-visual {
    border: 1px solid var(--bbUiBorder);
    border-radius: .35rem;
    padding: .55rem;
    background: var(--bbUiBg);
    color: var(--bbUiText);
    line-height: 1.45;
    white-space: pre-wrap
}

.bbcode-editor-visual[contenteditable='true'] {
    cursor: text
}

.bbcode-editor-visual[contenteditable='true']:focus-visible,
.bbcode-editor-input:focus-visible,
.bbcode-dialog-input:focus-visible,
.bbcode-editor-field:focus-visible {
    outline: none;
    border-color: var(--bbUiFocus);
    box-shadow: var(--bbUiFocusRing)
}

.bbcode-editor-input::placeholder,
.bbcode-dialog-input::placeholder,
.bbcode-editor-field::placeholder {
    color: var(--bbUiPlaceholder)
}

.bbcode-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(2, 6, 23, .45)
}

.bbcode-dialog {
    width: min(100%, 420px);
    max-height: calc(100vh - 2rem);
    overflow: auto;
    border: 1px solid var(--bbUiBorderSoft);
    border-radius: .55rem;
    background: var(--bbUiBg);
    box-shadow: 0 15px 38px rgba(15, 23, 42, .3);
    padding: .8rem
}

.bbcode-dialog-title {
    margin: 0 0 .65rem;
    font-size: 1rem;
    color: var(--bbUiText)
}

.bbcode-dialog-form {
    display: grid;
    gap: .5rem
}

.bbcode-dialog-row {
    display: grid;
    gap: .2rem
}

.bbcode-dialog-row.is-checkbox {
    display: flex;
    align-items: center;
    gap: .5rem
}

.bbcode-dialog-label {
    font-size: .85rem;
    font-weight: 700;
    color: var(--bbUiMuted)
}

.bbcode-dialog-input,
.bbcode-editor-field {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--bbUiBorder);
    border-radius: .35rem;
    padding: .35rem .45rem;
    font-size: .9rem;
    background: var(--bbUiBg);
    color: var(--bbUiText)
}

.bbcode-dialog-row.is-checkbox .bbcode-dialog-input {
    width: auto;
    padding: 0;
    accent-color: var(--bbUiFocus)
}

.bbcode-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: .45rem;
    margin-top: .2rem
}

.bbcode-dialog-btn {
    appearance: none;
    border: 1px solid var(--bbUiBorder);
    border-radius: .35rem;
    padding: .34rem .6rem;
    font-weight: 700;
    background: #f1f5f9;
    color: var(--bbUiText);
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease
}

.bbcode-dialog-btn:hover,
.bbcode-dialog-btn:focus-visible {
    background: var(--bbUiHoverBg);
    border-color: var(--bbUiFocus);
    outline: none
}

.bbcode-dialog-btn.primary {
    background: var(--bbUiHoverBg);
    color: #1e3a8a;
    border-color: var(--bbUiFocus)
}

.bbcode-dialog-btn.danger {
    background: #fee2e2;
    color: #991b1b;
    border-color: #ef4444;
    margin-right: auto
}
