/* ============================ */
/* 🔆 Mode clair (style Spider Web) */
/* ============================ */
[data-md-color-scheme="default"] .md-typeset pre {
    background: #f9f9f9;
    color: #333;
    border-radius: 12px;
    padding: 24px 16px 16px 16px;
    font-family: "Fira Code", monospace;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    position: relative;
    overflow: auto;
    border: 1px solid #e0e0e0;
}

[data-md-color-scheme="default"] .md-typeset pre::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 12px;
    width: 12px;
    height: 12px;
    background-color: #32b192; /* vert */
    border-radius: 50%;
    box-shadow:
        18px 0 0 #fbcf52,   /* jaune */
        36px 0 0 #4dc5ec;   /* bleu */
}

[data-md-color-scheme="default"] .md-typeset pre code {
    display: block;
    margin-top: 12px;
}


/* ============================ */
/* 🌙 Mode sombre (style Spider Web) */
/* ============================ */
[data-md-color-scheme="slate"] .md-typeset pre {
    background: #262626; /* fond noir */*
    color: #ccc;
    border-radius: 12px;
    padding: 24px 16px 16px 16px;
    font-family: "Fira Code", monospace;
    box-shadow: 0 0 10px rgba(0,0,0,0.4);
    position: relative;
    overflow: auto;
    border: 1px solid #2c2c2c;
}

[data-md-color-scheme="slate"] .md-typeset pre::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 12px;
    width: 12px;
    height: 12px;
    background-color: #32b192; /* vert */
    border-radius: 50%;
    box-shadow:
        18px 0 0 #fbcf52,   /* jaune */
        36px 0 0 #4dc5ec;   /* bleu */
}

[data-md-color-scheme="slate"] .md-typeset pre code {
    display: block;
    margin-top: 12px;
}