/* ─────────────────────────────────────────────────────────────────────────────── */
/* NOVASIO — Context menu                                                          */
/* ─────────────────────────────────────────────────────────────────────────────── */
.novasio-context-menu {
    position        : fixed;
    z-index         : 9999;
    background      : #ffffff;
    border          : 1px solid #d1d5db;
    border-radius   : 8px;
    box-shadow      : 0 4px 16px rgba(0,0,0,0.15);
    padding         : 6px 0;
    min-width       : 160px;
    font-family     : 'Segoe UI', sans-serif;
    font-size       : 14px;
}

.novasio-context-menu button {
    display         : flex;
    align-items     : center;
    gap             : 8px;
    width           : 100%;
    padding         : 8px 16px;
    border          : none;
    background      : transparent;
    text-align      : left;
    cursor          : pointer;
    color           : #374151;
    transition      : background 0.15s;
}

.novasio-context-menu button:hover {
    background      : #fee2e2;
    color           : #991b1b;
}

.novasio-context-menu button svg {
    width           : 16px;
    height          : 16px;
    flex-shrink     : 0;
}

/* ── YouTube mini-overlay (3 dots) ──────────────────────────────── */
.novasio-youtube-dots {
    position        : absolute;
    top             : 6px;
    right           : 6px;
    z-index         : 10;
    width           : 28px;
    height          : 28px;
    background      : #facc15;          /* jaune vif pour debug        */
    background      : #fffb;
    border-radius   : 6px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    cursor          : pointer;
    font-size       : 18px;
    font-weight     : bold;
    line-height     : 1;
    color           : #1f2937;
    user-select     : none;
    box-shadow      : 0 2px 6px rgba(0,0,0,0.25);
    transition      : background 0.15s;
    opacity         : 0.5;
}

.novasio-youtube-dots:hover {
    background      : #fde047;          /* jaune plus clair au survol  */
    opacity         : 1;
}

.novasio-youtube-dots * { 
    cursor          : pointer;
}

/* ── Code block ─────────────────────────────────────────────────── */
.novasio-code,
.novasio-source {
    display             : inline-block;
    font-family         : 'Courier New', Courier, monospace;
    font-size           : 0.8em;
    background          : #f4f4f4;
    border              : 1px solid #ddd;
    border-radius       : 4px;
    padding             : 2px 6px;
    color               : #c0392b;
    white-space         : pre-wrap;
    word-break          : break-all;
}

.novasio-source {
    display             : block;
    width               : 100%;
    max-width           : 100%;
    overflow            : auto;
}

/* ── Links inside the editable zone ───────────────────────────── */
/* ── Editable zone : resizable ──────────────────────────────────── */
[contenteditable] {
    resize          : vertical;
    overflow        : auto;
    min-height      : 150px;
    max-height      : 80vh;
    box-sizing      : border-box;
}

[contenteditable] a
{
    color           : #7f1d1d;          /* red-900 : visible but not aggressive  */
    text-decoration : underline;
    cursor          : pointer;
    transition      : color 0.2s ease;
}

[contenteditable] a:hover
{
    color           : #b91c1c;          /* red-700 : slightly brighter on hover  */
    text-decoration : underline wavy;   /* wavy underline on hover for feedback  */
}

[contenteditable] a:visited
{
    color           : #6b21a8;          /* purple-800 : classic visited colour   */
}

/* ── Resizable wrapper ──────────────────────────────────────────── */
#novasio-resizable-wrapper {
    position        : relative;
    width           : 100%;
}

/* ── Resize handle (poignée) ────────────────────────────────────── */
#novasio-resize-handle {
    display         : flex;
    align-items     : center;
    justify-content : center;
    width           : 100%;
    height          : 14px;
    background      : #f3f4f6;      /* gris très clair               */
    border          : 1px solid #d1d5db;
    border-top      : none;
    border-radius   : 0 0 8px 8px;
    cursor          : ns-resize;    /* curseur flèche haut/bas       */
    user-select     : none;
    transition      : background 0.2s;
}

#novasio-resize-handle:hover {
    background      : #e5e7eb;      /* légèrement plus foncé au survol */
}

/* Trois petits points décoratifs pour indiquer la poignée */
#novasio-resize-handle span {
    display         : block;
    width           : 32px;
    height          : 4px;
    border-top      : 2px solid #9ca3af;
    border-bottom   : 2px solid #9ca3af;
    border-radius   : 2px;
}



/* ── Headings inside the editable zone ─────────────────────────── */
[contenteditable] h1,
[contenteditable] h2,
[contenteditable] h3
{
    font-family     : Georgia, 'Times New Roman', serif;
    font-weight     : 700;
    line-height     : 1.2;
    color           : #7f1d1d;          /* red-900 — cohérent avec la charte NOVASIO  */
    margin-top      : 1.25em;
    margin-bottom   : 0.4em;
    padding-bottom  : 0.2em;
    letter-spacing  : -0.01em;
}

[contenteditable] h1
{
    font-size       : 2em;
    border-bottom   : 3px solid #7f1d1d;
}

[contenteditable] h2
{
    font-size       : 1.5em;
    border-bottom   : 1.5px solid #b91c1c;  /* red-700 — légèrement plus clair        */
}

[contenteditable] h3
{
    font-size       : 1.2em;
    border-bottom   : none;
    color           : #b91c1c;              /* red-700 — hiérarchie visuelle claire    */
    text-transform  : uppercase;
    letter-spacing  : 0.05em;
    font-size       : 1em;
}

/* ── First heading needs no top margin ─────────────────────────── */

[contenteditable] h1:first-child,
[contenteditable] h2:first-child,
[contenteditable] h3:first-child
{
    margin-top      : 0;
}


/* Styles pour les listes dans l'éditeur NOVASIO */
/* Liste non ordonnée - puces */
[contenteditable] ul {
    list-style-type: disc !important;
    margin: 1em 0 !important;
    padding-left: 2.5em !important;
}

[contenteditable] ul ul {
    list-style-type: circle !important;
    margin: 0.5em 0 !important;
}

[contenteditable] ul ul ul {
    list-style-type: square !important;
}

/* Liste ordonnée - numérotation */
[contenteditable] ol {
    list-style-type: decimal !important;
    margin: 1em 0 !important;
    padding-left: 2.5em !important;
}

[contenteditable] ol ol {
    list-style-type: lower-alpha !important;
    margin: 0.5em 0 !important;
}

[contenteditable] ol ol ol {
    list-style-type: lower-roman !important;
}

/* Éléments de liste */
[contenteditable] li {
    margin: 0.25em 0 !important;
    line-height: 1.5 !important;
    display: list-item !important;
}

/* Marges spécifiques pour les listes imbriquées */
[contenteditable]   ul ul,
[contenteditable]   ol ul,
[contenteditable]   ul ol,
[contenteditable]   ol ol
{
    margin-top: 0.25em !important;
    margin-bottom: 0.25em !important;
}

/* Pour éviter que les styles Tailwind ne perturbent l'affichage */
[contenteditable]   ul,
[contenteditable]   ol {
    list-style-position: outside !important;
}


/* ── Scrollbar invisible ────────────────────────────────────────── */
.novasio-scroll-hidden {
    overflow-y          : auto;
    -ms-overflow-style  : none;
    scrollbar-width     : none;
}

.novasio-scroll-hidden::-webkit-scrollbar {
    display             : none;
}


