.w10{width: 10px; height: 10px;}
.w15{width: 15px; height: 15px;}
.w20{width: 20px; height: 20px;}
.w25{width: 25px; height: 25px;}
.w30{width: 30px; height: 30px;}
.w40{width: 40px; height: 40px;}
.w50{width: 50px; height: 50px;}
.w60{width: 60px; height: 60px;}
.w70{width: 70px; height: 70px;}
.w80{width: 80px; height: 80px;}
.w90{width: 90px; height: 90px;}
.w100{width: 100px; height: 100px;}
.loader {
    position: relative;
    display:inline-block
}
.loader:before , .loader:after{
content: '';
border-radius: 50%;
position: absolute;
inset: 0;
box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.1) inset;
}
.loader:after {
    box-shadow: 0 1px 0 blue inset;
    animation: rotate 0.5s linear infinite;
}
@keyframes rotate {
    0% {  transform: rotate(0)}
    100% { transform: rotate(360deg)}
}

/* === Editor.js Frontend Styles === */
.editorjs-image { margin: 1rem 0; text-align: center; }
.editorjs-image img { max-width: 100%; height: auto; border-radius: 6px; }
.editorjs-img-stretched img { width: 100%; }
.editorjs-img-bordered img { border: 2px solid #dee2e6; }
.editorjs-img-bg { background: #f8f9fa; padding: 15px; border-radius: 8px; }
.editorjs-image figcaption { font-size: .875rem; color: #6c757d; margin-top: .5rem; }

.editorjs-quote { border-left: 4px solid #dee2e6; padding: .75rem 1.25rem; margin: 1rem 0; background: #f8f9fa; border-radius: 0 6px 6px 0; }
.editorjs-quote p { margin-bottom: .25rem; }
.editorjs-quote cite { font-size: .875rem; color: #6c757d; font-style: italic; }

.editorjs-checklist { list-style: none; padding-left: 0; }
.editorjs-checklist-item { padding: .25rem 0; }
.editorjs-checklist-item.checked { text-decoration: line-through; color: #6c757d; }
.editorjs-checklist-checkbox { margin-right: .5rem; }

.editorjs-delimiter { text-align: center; padding: 1rem 0; }
.editorjs-delimiter span { font-size: 1.5rem; letter-spacing: .5rem; color: #adb5bd; }

.editorjs-embed { margin: 1rem 0; aspect-ratio: 16/9; border-radius: 6px; overflow: hidden; }
.editorjs-embed iframe { width: 100%; height: 100%; border: none; }

.editorjs-button { margin: 1.5rem 0; }
.editorjs-button .btn { padding: .75rem 2rem; font-weight: 600; border-radius: 8px; text-decoration: none; }

.editorjs-columns { margin: 1.5rem 0; }
.editorjs-columns > div { padding: 0 15px; }

/* Summernote Grid (frontend) */
.sn-grid { display: flex; flex-wrap: wrap; }
.sn-grid-col iframe, .sn-grid-col video { max-width: 100%; width: 100%; aspect-ratio: 16/9; }
.sn-grid-col img { max-width: 100%; height: auto; }
.snp-block { border: none; padding: 0; margin: 0; }
.snp-controls { display: none !important; }

.editorjs-callout { background: #e8f4fd; border-left: 4px solid #0d6efd; padding: 1rem 1.25rem; margin: 1rem 0; border-radius: 0 6px 6px 0; }
.editorjs-citation { font-style: italic; border-left: 4px solid #6c757d; padding: .75rem 1.25rem; margin: 1rem 0; color: #495057; }
.editorjs-details { margin: 1rem 0; border: 1px solid #dee2e6; border-radius: 6px; padding: .75rem 1rem; }
.editorjs-details summary { font-weight: 600; cursor: pointer; }

