/* Base highlight styles - works in both editor and frontend */
.marked {
    padding: 0 2px;
}

.marked-yellow {
    background-color: #ffff00;
}

.marked-cyan {
    background-color: #00ffff;
}

.marked-green {
    background-color: #00ff00;
}

.marked-magenta {
    background-color: #ff00ff;
}

.marked-red {
    background-color: #ff0000;
    color: #fff;
}

.marked-blue {
    background-color: #0000ff;
    color: #fff;
}

.marked-darkblue {
    background-color: #00008b;
    color: #fff;
}

.marked-darkcyan {
    background-color: #008b8b;
}

.marked-darkgreen {
    background-color: #006400;
    color: #fff;
}

.marked-darkred {
    background-color: #8b0000;
    color: #fff;
}

.marked-darkyellow {
    background-color: #9b870c;
}

.marked-darkgray {
    background-color: #a9a9a9;
}

.marked-lightgray {
    background-color: #d3d3d3;
}

/* Ensure highlights work within Gutenberg blocks */
.wp-block p .marked,
.wp-block-heading .marked,
.wp-block-list li .marked {
    padding: 0 2px;
}