widgets.css

.citation-view-container {
    position:absolute;

    border-radius:1%;
    
    background: rgba(200, 175, 190, 0.85);
    box-shadow: 1.5px 0.5px 2px 1px rgb(0 0 0 / 10%);
    /*max-width: 30vw;*/
}

.citation-view-container .citation-view-verse{
    font: 0.9rem "Garamond";
    display: flex;
    padding:1rem;
    gap:1rem;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
}

#osd-element .a9s-inner {
	fill: rgb(12 40 200 / 0.1);
}

#osd-element .r6o-editor {
	width: fit-content;
}

.r6o-editor-inner > .widget {
	width: fit-content;
}

/* because of internal a9s css rules, there is no way around the !import decl */
.a9s-handle-inner {
	fill: transparent !important;
	stroke: transparent !important;
}

.a9s-handle-outer {
	fill: rgb(144 38 67 / 0.15) !important;
	stroke: rgb(255 245 250 / 0.8) !important;
}

.annotation-widget-container {
	display: flex;
	padding: 1rem;
	gap: 1rem;
	flex-flow: column nowrap;
	justify-content: center;
	align-items: center;
}

.annotation-widget-verse {
	background-color: rgb(240 240 240);
	display: flex;
	flex-flow: row nowrap;
	width: 100%;
	gap: 2rem;
	padding: 1rem;
}


.annotation-widget-verse br {
	counter-increment: line;
}

.annotation-widget-verse br:before {
	content: counter(line);
	padding-right: .5rem;
	background: rgb(220 220 220 / 0.4);
}


.cite-widget-container {
	display: flex;
	flex-flow: row wrap;
	gap: 1rem;
}

.cite-widget-input-container {
	display: flex;
	flex-flow: column nowrap;
}