* {
    box-sizing: border-box;
}

.poppins-thin {
    font-family: "Poppins", sans-serif;
    font-weight: 100;
    font-style: normal;
}

.poppins-extralight {
    font-family: "Poppins", sans-serif;
    font-weight: 200;
    font-style: normal;
}

.poppins-light {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: normal;
}

.poppins-regular {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.poppins-medium {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.poppins-semibold {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: normal;
}

.poppins-bold {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.poppins-extrabold {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: normal;
}

.poppins-black {
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-style: normal;
}

.poppins-thin-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 100;
    font-style: italic;
}

.poppins-extralight-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 200;
    font-style: italic;
}

.poppins-light-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: italic;
}

.poppins-regular-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: italic;
}

.poppins-medium-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: italic;
}

.poppins-semibold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: italic;
}

.poppins-bold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: italic;
}

.poppins-extrabold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: italic;
}

.poppins-black-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-style: italic;
}

* {
    scrollbar-width: thin; /* Firefox */
    scrollbar-color: #d4d4d8 transparent; /* Firefox thumb + track */
}

/* Chrome, Edge, Safari */
*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*::-webkit-scrollbar-track {
    background: transparent;
}

*::-webkit-scrollbar-thumb {
    background: #d4d4d8; /* neutral-300 */
    border-radius: 9999px;
}

/* DARK MODE */
@media (prefers-color-scheme: dark) {
    * {
        scrollbar-color: #52525b transparent; /* thumb = neutral-600 */
    }

    *::-webkit-scrollbar-thumb {
        background: #52525b; /* neutral-600 */
    }
}

/* Alignment */
.ql-align-right {
    text-align: right;
}

.ql-align-center {
    text-align: center;
}

.ql-align-justify {
    text-align: justify;
}

/* Lists */
.ql-indent-1 {
    padding-left: 3em;
}
.ql-indent-2 {
    padding-left: 6em;
}
.ql-indent-3 {
    padding-left: 9em;
}

/* Blockquote */
blockquote {
    border-left: 4px solid #ccc;
    margin-left: 0;
    padding-left: 1em;
}

/* Headers */
.ql-size-small {
    font-size: 0.75em;
}
.ql-size-large {
    font-size: 1.5em;
}
.ql-size-huge {
    font-size: 2.5em;
}
/* Reset OL/UL for Quill output rendering */
.ql-render ul,
.ql-render ol {
    list-style: none; /* Remove default browser bullets/numbers */
    padding-left: 1.5em;
    margin: 0.75em 0;
}

/* Bulleted lists */
.ql-render li[data-list="bullet"] {
    position: relative;
    padding-left: 1.2em;
}

.ql-render li[data-list="bullet"]::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 0;
}

/* Ordered lists */
.ql-render ol {
    counter-reset: ql-list-counter;
}

.ql-render li[data-list="ordered"] {
    position: relative;
    padding-left: 1.5em;
}

.ql-render li[data-list="ordered"]::before {
    counter-increment: ql-list-counter;
    content: counter(ql-list-counter) ". ";
    position: absolute;
    left: 0;
    top: 0;
}

.ql-link-cus {
    color: #0066cc;
    text-decoration: underline;
    font-weight: 500;
}

.ql-link-cus:hover {
    color: #004499;
}

#talk-editor .ql-editor {
    font-family: "Poppins", sans-serif !important;
    font-size: 1rem;
}

#talk-editor .ql-editor.ql-blank::before {
    color: #737373 !important;
}

@media (prefers-color-scheme: dark) {
    #talk-editor .ql-editor.ql-blank::before {
        color: #a3a3a3 !important;
    }
}

#talk-toolbar .ql-active {
    background-color: #ededed; /* light mode */
}

@media (prefers-color-scheme: dark) {
    #talk-toolbar .ql-active {
        background-color: #262626; /* zinc-700 */
    }
}

#talk-toolbar .ql-size .ql-picker-options {
    background-color: #1f2937 !important; /* your theme color */
}