.scb-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
gap: 12px;
margin-top: 8px;
}
.scb-thumb {
border: 1px solid #ddd;
border-radius: 6px;
padding: 8px;
background: #fff;
}
.scb-thumb__preview {
width: 100%;
aspect-ratio: 1 / 1;
overflow: hidden;
display: grid;
place-items: center;
margin-bottom: 6px;
}
.scb-thumb__preview img {
max-width: 100%;
max-height: 100%;
display: block;
}
.scb-thumb__name {
font-size: 12px;
line-height: 1.4;
margin-bottom: 6px;
word-break: break-all;
} .scb-grid--modal {
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}
.scb-modal-toolbar .components-base-control__field {
margin-bottom: 0;
}
.scb-placeholder {
border: 1px dashed #aaa;
padding: 16px;
border-radius: 8px;
background: #fff;
} .wp-block-media-text.scb-bubble .wp-block-media-text__content {
position: relative;
background: #fff;
border: 2px solid #222;
border-radius: 16px;
padding: 1rem 1.25rem;
box-shadow: 0 2px 0 #222;
} .wp-block-media-text.scb-bubble .wp-block-media-text__content::before,
.wp-block-media-text.scb-bubble .wp-block-media-text__content::after {
content: "";
position: absolute;
top: 24px;
left: -14px;
width: 0; height: 0;
border-style: solid;
}
.wp-block-media-text.scb-bubble .wp-block-media-text__content::before {
border-width: 10px 14px 10px 0;
border-color: transparent #222 transparent transparent; }
.wp-block-media-text.scb-bubble .wp-block-media-text__content::after {
left: -12px;
border-width: 9px 12px 9px 0;
border-color: transparent #fff transparent transparent; } .wp-block-media-text.is-media-on-the-right.scb-bubble .wp-block-media-text__content::before {
left: auto; right: -14px;
border-width: 10px 0 10px 14px;
border-color: transparent transparent transparent #222;
}
.wp-block-media-text.is-media-on-the-right.scb-bubble .wp-block-media-text__content::after {
left: auto; right: -12px;
border-width: 9px 0 9px 12px;
border-color: transparent transparent transparent #fff;
} @media (max-width: 781px) {
.wp-block-media-text.is-stacked-on-mobile.scb-bubble .wp-block-media-text__content::before,
.wp-block-media-text.is-stacked-on-mobile.scb-bubble .wp-block-media-text__content::after {
top: -12px; left: 24px; right: auto;
border-width: 0 10px 12px 10px;
}
.wp-block-media-text.is-stacked-on-mobile.scb-bubble .wp-block-media-text__content::before {
border-color: transparent transparent #222 transparent;
}
.wp-block-media-text.is-stacked-on-mobile.scb-bubble .wp-block-media-text__content::after {
top: -10px;
border-color: transparent transparent #fff transparent;
}
} @media (prefers-color-scheme: dark) {
.wp-block-media-text.scb-bubble .wp-block-media-text__content {
background: #111;
border-color: #eee;
box-shadow: 0 2px 0 #eee;
color: #eee;
}
.wp-block-media-text.scb-bubble .wp-block-media-text__content::before { border-color: transparent #eee transparent transparent; }
.wp-block-media-text.scb-bubble .wp-block-media-text__content::after  { border-color: transparent #111 transparent transparent; }
.wp-block-media-text.is-media-on-the-right.scb-bubble .wp-block-media-text__content::before { border-color: transparent transparent transparent #eee; }
.wp-block-media-text.is-media-on-the-right.scb-bubble .wp-block-media-text__content::after  { border-color: transparent transparent transparent #111; }
}