/* BCC Simple Reviews public styles */
.bcc-sr { font-family: inherit; }
.bcc-sr-summary { margin-bottom: 1rem; padding: .75rem 1rem; background: #f7f7f7; border: 1px solid #e5e5e5; border-radius: 6px; text-align: center; }
.bcc-sr-summary-title { font-size: 1rem; color: #111; }
.bcc-sr-summary-rating { font-size: 1.125rem; margin-top: .25rem; display: flex; align-items: center; gap: .5rem;justify-content: center; }
.bcc-sr-summary-based { color: #555; }

/* Toolbar */
.bcc-sr-toolbar { margin: .5rem 0 1rem; display: flex; gap: .5rem; flex-wrap: wrap; justify-content: center; align-items: center; }
.bcc-sr-filter-label { color: #444; }
.bcc-sr-select { border: 1px solid #ddd; background: #fff; padding: .35rem .6rem; border-radius: 6px; }

/* Stars */
.bcc-sr-stars { position: relative; display: inline-block; font-size: 1.05rem; line-height: 1; }
.bcc-sr-stars .stars-bg { color: #e5e7eb; }
.bcc-sr-stars .stars-fill { position: absolute; inset: 0 auto 0 0; color: #f59e0b; width: 0; overflow: hidden; white-space: nowrap; }

/* Media thumbs */
.bcc-sr-media { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .5rem; margin-bottom: .5rem; }
.bcc-sr-thumb { position: relative; border: none; background: transparent; padding: 0; cursor: pointer; }
.bcc-sr-thumb img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 6px; border: 1px solid #e5e7eb; }
.bcc-sr-thumb .bcc-sr-play { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 1.25rem; text-shadow: 0 1px 2px rgba(0,0,0,.6); }

/* Reset theme button hover conflicts inside plugin scope */
.bcc-sr .bcc-sr-thumb,
.bcc-sr .bcc-sr-modal-close,
.bcc-sr .bcc-sr-modal-nav { background: transparent !important; border: none !important; box-shadow: none !important; color: inherit;height: unset!important; }
.bcc-sr .bcc-sr-thumb:hover,
.bcc-sr .bcc-sr-modal-close:hover,
.bcc-sr .bcc-sr-modal-nav:hover { background: transparent !important; box-shadow: none !important; height: unset!important; }
.bcc-sr .bcc-sr-modal-nav:hover { background: rgba(0,0,0,.6) !important; color: #fff !important; }
.bcc-sr .modal-thumb { background: transparent !important; border: none !important; box-shadow: none !important; }
.bcc-sr .modal-thumb:hover { box-shadow: none !important; }
.bcc-sr .bcc-sr-thumb:focus-visible,
.bcc-sr .modal-thumb:focus-visible,
.bcc-sr .bcc-sr-modal-close:focus-visible,
.bcc-sr .bcc-sr-modal-nav:focus-visible { outline: 2px solid #f59e0b; outline-offset: 2px;height: unset!important; }

/* Modal */
.bcc-sr-modal { position: fixed; inset: 0; background: rgba(0,0,0,.7); display: none; align-items: center; justify-content: center; padding: 1rem; z-index: 99999; }
.bcc-sr-modal.is-open { display: flex; }
.bcc-sr-modal-inner { max-width: 90vw; max-height: 85vh; background: #000; border-radius: 8px; overflow: hidden; position: relative; }
.bcc-sr-modal-inner img, .bcc-sr-modal-inner video, .bcc-sr-modal-inner iframe { display: block; max-width: 90vw; max-height: 70vh; margin: 0 auto; }
.bcc-sr-modal-close { position: absolute; top: .25rem; right: .25rem; background: rgba(0,0,0,.6); color: #fff; border: none; border-radius: 4px; padding: .25rem .5rem; cursor: pointer; }
.bcc-sr-modal-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,.45); color: #fff; border: none; border-radius: 4px; width: 36px; height: 36px; cursor: pointer; font-size: 22px; line-height: 1; display: grid; place-items: center; }
.bcc-sr-modal-nav.prev { left: .25rem; }
.bcc-sr-modal-nav.next { right: .25rem; }
.bcc-sr-modal-thumbs { display: flex; gap: .5rem; padding: .5rem; overflow-x: auto; background: #0b0b0b; }
.bcc-sr-modal-thumbs .modal-thumb { border: none; background: transparent; padding: 0; cursor: pointer; opacity: .7; }
.bcc-sr-modal-thumbs .modal-thumb.is-active { opacity: 1; outline: 2px solid #f59e0b;height: unset !important; border-radius: unset !important; }
.bcc-sr-modal-thumbs img { width: 60px; height: 60px; object-fit: cover; border-radius: 4px; }

/* Masonry-like using CSS columns */
.bcc-sr-grid.view-masonry { column-gap: 1rem; }
@media (min-width: 480px) { .bcc-sr-grid.view-masonry { columns: 2; } }
@media (min-width: 900px) { .bcc-sr-grid.view-masonry { columns: 3; } }
.bcc-sr-card { break-inside: avoid; background: #fff; border: 1px solid #e8e8e8; border-radius: 8px; padding: 12px 14px; margin: 0 0 1rem; box-shadow: 0 1px 2px rgba(0,0,0,.03); transition: transform .2s ease, opacity .2s ease; }
.bcc-sr-card:hover { transform: translateY(-2px); }
.bcc-sr-card.is-hidden { display: none !important; }
.bcc-sr-title { margin: 0 0 .25rem; font-size: 1.05rem; }
.bcc-sr-rating { color: #d97706; font-weight: 600; margin-bottom: .5rem; display: flex; align-items: center; gap: .5rem; }
.bcc-sr-content { color: #222; }
.bcc-sr-footer { margin-top: .5rem; color: #666; font-size: .9rem; display: flex; justify-content: space-between; }

/* pagination */
.bcc-sr-pagination { margin-top: 1rem; text-align: center; }
.bcc-sr-pagination ul.page-numbers { display: inline-flex; gap: .25rem; list-style: none; padding-left: 0; margin: 0; }
.bcc-sr-pagination .page-numbers { display: inline-block; padding: .25rem .5rem; margin: 0; border: 1px solid #ddd; border-radius: 4px; text-decoration: none; color: #333; }
.bcc-sr-pagination .page-numbers.current { background: #0073aa; color: #fff; border-color: #0073aa; }
