* {
    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;
}

/* Prevent background scroll when mobile panel is open */
.no-scroll {
    overflow: hidden !important;
    height: 100% !important;
}

* {
    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;
}

.scrollbar-hide::-webkit-scrollbar {
	display: none;
}
.scrollbar-hide {
	-ms-overflow-style: none;
	scrollbar-width: none;
}

/* 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;
} */

/* Override Tailwind Typography */
/* .prose.ql-render p {
    text-align: justify !important; */

/* Critical fixes */
/* hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;

    word-break: normal;
    overflow-wrap: break-word;

    text-justify: inter-word;
} */

/* Keep headings left-aligned */
/* .prose.ql-render h1,
.prose.ql-render h2,
.prose.ql-render h3,
.prose.ql-render h4,
.prose.ql-render h5,
.prose.ql-render h6 {
    text-align: left !important;
} */

/* 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;
    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;
} */

/* ===========================
   TEXT ALIGNMENT (QUILL)
=========================== */

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

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

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

/* ===========================
   BASE TYPOGRAPHY
=========================== */

.prose.ql-render {
    line-height: 1.75;
}

/* Paragraphs */
.prose.ql-render p {
    margin: 0.9em 0;
    text-align: justify !important;
    hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;

    word-break: normal;
    overflow-wrap: break-word;
    text-justify: inter-word;
}

/* ===========================
   HEADERS – LORA + CAPITALISED
=========================== */

.prose.ql-render h1,
.prose.ql-render h2,
.prose.ql-render h3,
.prose.ql-render h4,
.prose.ql-render h5,
.prose.ql-render h6 {
    font-family: "Lora", serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;

    text-align: left !important;
    line-height: 1.3;

    margin-top: 2.6em;
    margin-bottom: 1em;
}

/* Size tuning */
.prose.ql-render h1 {
    font-size: 2.3em;
}
.prose.ql-render h2 {
    font-size: 1.85em;
}
.prose.ql-render h3 {
    font-size: 1.45em;
}
.prose.ql-render h4 {
    font-size: 1.2em;
}

/* ===========================
   FIX: HEADING → PARA GAP
=========================== */

.prose.ql-render h1 + p,
.prose.ql-render h2 + p,
.prose.ql-render h3 + p,
.prose.ql-render h4 + p,
.prose.ql-render h5 + p,
.prose.ql-render h6 + p {
    margin-top: 5.45em;
}

/* ===========================
   LISTS (QUILL SAFE)
=========================== */

.ql-render ul,
.ql-render ol {
    list-style: none;
    padding-left: 1.6em;
    margin: 1.1em 0;
}

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

.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;
    margin: 0.5em 0;
}

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

/* ===========================
   INDENTS
=========================== */

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

/* ===========================
   BLOCKQUOTE
=========================== */

.prose.ql-render blockquote {
    border-left: 4px solid #d1d5db;
    margin: 1.6em 0;
    padding-left: 1.3em;
    color: #374151;
    font-style: italic;
}

/* ===========================
   QUILL FONT SIZES
=========================== */

.ql-size-small {
    font-size: 0.85em;
}
.ql-size-large {
    font-size: 1.4em;
}
.ql-size-huge {
    font-size: 2.2em;
}

/* ===========================
   LINKS
=========================== */

.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 */
}

.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 */
}