/* Start custom CSS for html, class: .elementor-element-675fffb *//* =========================================================
BOOKISH MOMENTS
REZENSIONSINDEX – KOMPLETTER CSS
========================================================= */

.bm-rezensionsindex {

--pink: #d82d7d;
--pink-light: #f9d6e8;
--pink-soft: #fff3f8;
--blue: #3159a6;
--blue-light: #dce9fb;
--blue-soft: #f2f7ff;
--purple: #51408d;
--text: #13235d;
--border: #d7def1;
--white: #ffffff;

width: 100%;
max-width: 100%;

margin: 0;

padding: 0 18px 35px;

box-sizing: border-box;

font-family: Arial, Helvetica, sans-serif;

color: var(--text);

background:
    radial-gradient(
        circle at 10% 35%,
        rgba(220,235,255,.55),
        transparent 18%
    ),
    radial-gradient(
        circle at 90% 55%,
        rgba(255,220,239,.55),
        transparent 20%
    ),
    #ffffff;

overflow: hidden;

}

/* =========================================================
HEADER
========================================================= */

.bm-ri-header {

width: 100%;
max-width: 100%;

height: 260px;

background-image:
    url("https://bookish-moments.com/wp-content/uploads/2026/09/Rezensionsindexheader.png");

background-position: center;
background-size: cover;
background-repeat: no-repeat;

border-radius: 0 0 10px 10px;

overflow: hidden;

box-sizing: border-box;

}



/* =========================================================
STATISTIK
========================================================= */

.bm-ri-stats {

display: grid;

grid-template-columns:
    repeat(4, minmax(0, 1fr));

gap: 18px;

width: 100%;
max-width: 100%;

margin: 16px 0 22px;

box-sizing: border-box;

}

.bm-ri-stat {

min-width: 0;
min-height: 88px;

display: flex;

align-items: center;
justify-content: center;

gap: 18px;

padding: 12px 15px;

box-sizing: border-box;

background:
    radial-gradient(
        circle at 20% 20%,
        rgba(255,255,255,.95),
        transparent 35%
    ),
    linear-gradient(
        135deg,
        #fffaf4,
        #f8e8df 55%,
        #fffaf4
    );

border: 1px solid #d7b5a1;

border-radius: 13px;

box-shadow:
    0 5px 16px rgba(91,45,43,.13),
    inset 0 0 18px rgba(255,255,255,.8);

position: relative;

overflow: hidden;

}

.bm-ri-stat::before,
.bm-ri-stat::after {

content: "✧";

position: absolute;

color: #a85a73;

font-size: 20px;

opacity: .65;

}

.bm-ri-stat::before {

left: 8px;
bottom: 7px;

}

.bm-ri-stat::after {

right: 9px;
top: 5px;

}

.bm-ri-stat-icon {

flex-shrink: 0;

font-size: 40px;

line-height: 1;

color: #6b2348;

text-shadow:
    2px 2px 0 #e8c4c5;

}

.bm-ri-stat span {

display: block;

font-size: 12px;

font-weight: 700;

letter-spacing: .6px;

margin-bottom: 3px;

color: #70453e;

}

.bm-ri-stat strong {

display: block;

font-size: 29px;

line-height: 1;

color: #541b3d;

}

/* =========================================================
SUCHFELD
========================================================= */

.bm-ri-search {

width: 100%;
max-width: 100%;

height: 52px;

display: flex;

align-items: center;

box-sizing: border-box;

margin: 0 0 12px;

border: 2px solid #c98b96;

border-radius: 30px;

background: rgba(255,250,245,.96);

box-shadow:
    0 3px 12px rgba(91,45,43,.10);

overflow: hidden;

}

.bm-ri-search-icon {

flex-shrink: 0;

margin-left: 18px;
margin-right: 12px;

font-size: 32px;

line-height: 1;

color: #6b2348;

transform: rotate(-15deg);

}

#bmRISearch {

flex: 1;

min-width: 0;

width: 100%;

height: 100%;

border: 0;

outline: none;

background: transparent;

font-size: 16px;

color: #593d3b;

}

#bmRISearch::placeholder {

color: #8c716b;

}

#bmRISearchButton {

flex-shrink: 0;

height: 42px;

min-width: 140px;

margin-right: 5px;

padding: 0 22px;

border: 0;

border-radius: 24px;

background:
    linear-gradient(
        180deg,
        #9b3f65,
        #5a1e40
    );

color: #ffffff;

font-size: 15px;

font-weight: 700;

cursor: pointer;

box-shadow:
    0 4px 10px rgba(90,30,64,.28);

transition: .2s ease;

}

#bmRISearchButton {

background:
    linear-gradient(
        180deg,
        #b04f76,
        #6b2348
    );

transform: translateY(-1px);

}

/* =========================================================
GENRE FILTER
========================================================= */

.bm-ri-genres {

display: flex;

justify-content: center;
align-items: center;

gap: 10px;

width: 100%;
max-width: 100%;

margin: 0 0 16px;

padding: 0;

box-sizing: border-box;

flex-wrap: wrap;

}

.bm-ri-genre {

flex: 0 1 auto;

max-width: 100%;

min-width: 0;

height: 42px;

padding: 0 25px;

box-sizing: border-box;

border: 1px solid #c99aa3;

border-radius: 23px;

background:
    linear-gradient(
        180deg,
        #fffdf9,
        #f5e4dc
    );

color: #652443;

font-size: 14px;

font-weight: 600;

white-space: nowrap;

cursor: pointer;

box-shadow:
    0 3px 7px rgba(91,45,43,.12);

transition: .2s ease;

}

.bm-ri-genre {

transform: translateY(-1px);

border-color: #9b3f65;

background:
    linear-gradient(
        180deg,
        #fff8f5,
        #efd2d3
    );

}

.bm-ri-genre.active {

color: #ffffff;

border-color: #5a1e40;

background:
    linear-gradient(
        180deg,
        #9b3f65,
        #5a1e40
    );

box-shadow:
    0 5px 12px rgba(90,30,64,.28);

}

/* =========================================================
BEWERTUNGSFILTER
========================================================= */

.bm-ri-rating-filter {

display: flex;

justify-content: center;
align-items: center;

gap: 10px;

width: 100%;
max-width: 100%;

margin: 0 0 13px;

padding: 0;

box-sizing: border-box;

flex-wrap: wrap;

}

.bm-ri-rating-filter strong {

margin-right: 5px;

font-size: 14px;

color: #653f3c;

white-space: nowrap;

}

.bm-ri-rating-filter button {

width: auto;

min-width: 120px;

max-width: 100%;

height: 39px;

padding: 0 15px;

box-sizing: border-box;

border: 1px solid #d7a9ad;

border-radius: 22px;

background: #fffaf7;

color: #8d3d60;

font-size: 20px;

letter-spacing: 2px;

cursor: pointer;

box-shadow:
    0 2px 7px rgba(91,45,43,.08);

transition: .2s ease;

}

.bm-ri-rating-filter button {

background: #f8e7e1;

border-color: #a85a73;

}

.bm-ri-rating-filter button.active {

background:
    linear-gradient(
        180deg,
        #f3d9d5,
        #e9c1c1
    );

border-color: #8d3d60;

color: #6b2348;

}

/* =========================================================
ALPHABET
========================================================= */

.bm-ri-alphabet {

display: flex;

justify-content: center;
align-items: center;

gap: 8px;

width: 100%;
max-width: 100%;

margin: 0 0 20px;

padding: 0;

box-sizing: border-box;

flex-wrap: wrap;

}

.bm-ri-alphabet button {

width: 32px;

height: 30px;

flex: 0 0 auto;

padding: 0;

border: 1px solid #cda8a2;

border-radius: 7px;

background:
    linear-gradient(
        180deg,
        #fffdf9,
        #f3e3db
    );

color: #652443;

font-size: 14px;

cursor: pointer;

box-sizing: border-box;

transition: .2s ease;

}

.bm-ri-alphabet button {

border-color: #8d3d60;

background: #f4ddd9;

}

.bm-ri-alphabet button {

width: 54px;

}

.bm-ri-alphabet button.active {

background:
    linear-gradient(
        180deg,
        #9b3f65,
        #5a1e40
    );

color: #ffffff;

border-color: #5a1e40;

box-shadow:
    inset 0 0 0 1px #7e2d53;

}

/* =========================================================
TRENNER / ÜBERSCHRIFT
========================================================= */

.bm-ri-section-title {

display: flex;

align-items: center;
justify-content: center;

gap: 16px;

width: 100%;
max-width: 100%;

margin: 0 0 18px;

box-sizing: border-box;

}

.bm-ri-section-title > span {

height: 1px;

flex: 1;

min-width: 20px;

max-width: 180px;

background:
    linear-gradient(
        90deg,
        transparent,
        #a85a73,
        transparent
    );

}

.bm-ri-section-title div {

color: #6b2348;

font-size: 30px;

line-height: 1;

}

.bm-ri-section-title h2 {

margin: 0;

font-family: Georgia, serif;

font-size: 16px;

font-weight: 500;

letter-spacing: 1.3px;

color: #652443;

white-space: nowrap;

}

.bm-ri-section-title b {

color: #9b3f65;

font-size: 18px;

}

/* =========================================================
BUCH-GRID
========================================================= */

.bm-ri-books {

display: grid;

grid-template-columns:
    repeat(6, minmax(0, 1fr));

gap: 10px;

width: 100%;
max-width: 100%;

margin: 0;

padding: 0;

box-sizing: border-box;

}

/* =========================================================
BUCHKARTE
========================================================= */

.bm-ri-book {

position: relative;

min-width: 0;

width: 100%;

padding: 8px 8px 12px;

box-sizing: border-box;

background:
    linear-gradient(
        145deg,
        #fffdf9,
        #fdf1ec 65%,
        #fffdf9
    );

border: 1px solid #dbc3bb;

border-radius: 10px;

box-shadow:
    0 3px 10px rgba(91,45,43,.12);

overflow: hidden;

transition:
    transform .2s ease,
    box-shadow .2s ease;

}

.bm-ri-book {

transform: translateY(-3px);

box-shadow:
    0 9px 20px rgba(91,45,43,.20);

}

/* =========================================================
LABEL
========================================================= */

.bm-ri-label {

position: relative;

z-index: 4;

width: max-content;

max-width: calc(100% - 8px);

min-height: 25px;

display: flex;

align-items: center;

padding: 0 9px;

margin: -2px 0 -4px -3px;

box-sizing: border-box;

border-radius: 14px;

font-size: 9px;

font-weight: 700;

white-space: nowrap;

box-shadow:
    0 2px 5px rgba(91,45,43,.15);

}

.bm-ri-label.pink {

color: #762342;

background:
    linear-gradient(
        180deg,
        #fff5f2,
        #efc8ca
    );

border: 1px solid #c98b96;

}

.bm-ri-label.blue {

color: #653f3c;

background:
    linear-gradient(
        180deg,
        #fffaf2,
        #ead8c8
    );

border: 1px solid #c9aa8d;

}

/* =========================================================
COVER
========================================================= */

.bm-ri-cover-link {

display: block;

width: 100%;

aspect-ratio: 2 / 3;

margin-top: 2px;

overflow: hidden;

border-radius: 3px;

box-sizing: border-box;

}

.bm-ri-cover-link img {

display: block;

width: 100%;
height: 100%;

object-fit: cover;

border-radius: 3px;

transition:
    transform .25s ease;

}

.bm-ri-book
.bm-ri-cover-link img {

transform: scale(1.015);

}

/* =========================================================
HERZ
========================================================= */

.bm-ri-heart {

position: absolute;

top: 11px;
right: 8px;

z-index: 5;

width: 27px;
height: 27px;

padding: 0;

border: 0;

background:
    rgba(255,250,247,.94);

color: #7e2d53;

border-radius: 50%;

font-size: 22px;

line-height: 27px;

cursor: pointer;

box-shadow:
    0 2px 5px rgba(91,45,43,.15);

transition: .2s ease;

}

.bm-ri-heart {

color: #b04f76;

transform: scale(1.08);

}

/* =========================================================
BUCH-INFORMATION
========================================================= */

.bm-ri-book-info {

width: 100%;

text-align: center;

padding-top: 7px;

box-sizing: border-box;

}

.bm-ri-book-info h3 {

min-height: 36px;

margin: 0 0 2px;

color: #5a1e40;

font-size: 13px;

line-height: 1.15;

font-weight: 700;

}

.bm-ri-book-info p {

min-height: 16px;

margin: 0 0 4px;

color: #76514c;

font-size: 12px;

}

/* =========================================================
STERNE
========================================================= */

.bm-ri-stars {

color: #b04f76;

font-size: 20px;

line-height: 20px;

letter-spacing: 1px;

margin-bottom: 2px;

}

.bm-ri-score {

display: block;

color: #653f3c;

font-size: 13px;

margin-bottom: 7px;

}

/* =========================================================
TAGS
========================================================= */

.bm-ri-tags {

display: flex;

justify-content: center;

align-items: center;

gap: 4px;

min-height: 29px;

width: 100%;

margin-bottom: 8px;

box-sizing: border-box;

flex-wrap: wrap;

}

.bm-ri-tags span {

display: flex;

align-items: center;
justify-content: center;

min-height: 25px;

max-width: 100%;

padding: 2px 7px;

box-sizing: border-box;

border: 1px solid #d1b3aa;

border-radius: 13px;

background:
    linear-gradient(
        180deg,
        #fffdf9,
        #f0e1d9
    );

color: #6b3d42;

font-size: 8.5px;

line-height: 1.1;

text-align: center;

}

/* =========================================================
REZENSIONS-BUTTON
========================================================= */

.bm-ri-button {

display: flex;

align-items: center;
justify-content: center;

width: 100%;

max-width: 100%;

height: 35px;

padding: 0 8px;

box-sizing: border-box;

border-radius: 19px;

background:
    linear-gradient(
        180deg,
        #9b3f65,
        #5a1e40
    );

color: #ffffff !important;

font-size: 12px;

font-weight: 700;

text-decoration: none !important;

white-space: nowrap;

box-shadow:
    0 4px 9px rgba(90,30,64,.28);

transition: .2s ease;

}

.bm-ri-button {

transform: translateY(-1px);

background:
    linear-gradient(
        180deg,
        #b04f76,
        #6b2348
    );

color: #ffffff !important;

}

/* =========================================================
KEINE TREFFER
========================================================= */

.bm-ri-no-results {

display: none;

width: 100%;

padding: 50px 20px;

box-sizing: border-box;

text-align: center;

color: #76514c;

font-size: 18px;

}

/* =========================================================
TABLET
========================================================= */

@media (max-width: 1100px) {

.bm-ri-books {

    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

}

/* =========================================================
KLEINER TABLET-BEREICH
========================================================= */

@media (max-width: 850px) {

.bm-ri-stats {

    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}


.bm-ri-books {

    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}


.bm-ri-header {

    height: 210px;
}

}

/* =========================================================
MOBILE
========================================================= */

@media (max-width: 700px) {

.bm-rezensionsindex {

    padding-left: 10px;
    padding-right: 10px;
}


.bm-ri-header {

    height: 160px;
}


.bm-ri-stats {

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}


.bm-ri-stat {

    gap: 8px;

    min-height: 75px;

    padding: 9px;
}


.bm-ri-stat-icon {

    font-size: 28px;
}


.bm-ri-stat span {

    font-size: 9px;
}


.bm-ri-stat strong {

    font-size: 21px;
}


.bm-ri-genres {

    justify-content: center;

    gap: 7px;
}


.bm-ri-genre {

    height: 37px;

    padding-left: 15px;
    padding-right: 15px;

    font-size: 12px;
}


.bm-ri-rating-filter {

    gap: 7px;
}


.bm-ri-rating-filter button {

    min-width: 100px;

    height: 35px;

    padding: 0 10px;

    font-size: 17px;
}


.bm-ri-alphabet {

    gap: 5px;
}


.bm-ri-alphabet button {

    width: 28px;

    height: 28px;

    font-size: 12px;
}


.bm-ri-alphabet button:first-child {

    width: 48px;
}


.bm-ri-section-title {

    gap: 8px;
}


.bm-ri-section-title h2 {

    font-size: 12px;

    letter-spacing: .7px;
}


.bm-ri-section-title div {

    font-size: 22px;
}


.bm-ri-books {

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 8px;
}


.bm-ri-book {

    padding: 6px 6px 9px;
}


.bm-ri-book-info h3 {

    font-size: 11px;
}


.bm-ri-book-info p {

    font-size: 10px;
}


.bm-ri-stars {

    font-size: 16px;
}


.bm-ri-score {

    font-size: 11px;
}


.bm-ri-button {

    height: 32px;

    font-size: 10px;
}

}

/* =========================================================
SEHR KLEINES HANDY
========================================================= */

@media (max-width: 430px) {

.bm-rezensionsindex {

    padding-left: 7px;
    padding-right: 7px;
}


.bm-ri-search {

    height: 46px;
}


.bm-ri-search-icon {

    margin-left: 10px;
    margin-right: 7px;

    font-size: 26px;
}


#bmRISearch {

    font-size: 13px;
}


#bmRISearchButton {

    min-width: 80px;

    height: 36px;

    padding: 0 12px;

    font-size: 12px;
}


.bm-ri-genre {

    padding-left: 11px;
    padding-right: 11px;

    font-size: 11px;
}


.bm-ri-rating-filter strong {

    width: 100%;

    text-align: center;

    margin-right: 0;
}


.bm-ri-rating-filter button {

    min-width: 85px;

    font-size: 15px;

    letter-spacing: 1px;
}


.bm-ri-book-info h3 {

    min-height: 32px;

    font-size: 10px;
}


.bm-ri-tags span {

    font-size: 7.5px;

    padding-left: 5px;
    padding-right: 5px;
}

}

/* =========================================================
AUTOMATISCHER REZENSIONSINDEX – NEUE ELEMENTE
========================================================= */

.bm-ri-notice {
margin: 18px 0 24px;
padding: 12px 16px;
border: 1px solid #D6A66A;
border-radius: 10px;
background: rgba(252,239,226,.72);
color: #4A1738;
font-size: 14px;
line-height: 1.6;
}

.bm-ri-filter-title {
margin: 24px 0 10px;
text-align: center;
color: #4A1738;
font-weight: 600;
letter-spacing: 1px;
}

.bm-ri-main-filter,
.bm-ri-sub-filter {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 8px;
margin-bottom: 14px;
}

.bm-ri-sub-button {
border: 1px solid #D6A66A;
background: #FCEFE2;
color: #4A1738;
border-radius: 999px;
padding: 7px 13px;
cursor: pointer;
}

.bm-ri-year-heading {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
margin: 30px 0 16px;
color: #4A1738;
}

.bm-ri-year-heading::after {
content: "";
position: absolute;
}

.bm-ri-books-year {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 18px;
}

.bm-ri-status {
position: absolute;
left: 8px;
bottom: 8px;
background: rgba(255,255,255,.9);
color: #7A285A;
border-radius: 8px;
padding: 5px 8px;
font-size: 11px;
font-weight: 600;
}

.bm-ri-cover-wrap {
position: relative;
}

.bm-ri-planned {
opacity: .62;
}

.bm-ri-planned .bm-ri-cover {
filter: grayscale(15%);
}

.bm-ri-disabled {
opacity: .55;
cursor: default;
}

.bm-ri-series {
margin-top: 8px;
font-size: 13px;
color: #7A285A;
}

.bm-ri-cover-placeholder {
aspect-ratio: 2 / 3;
display: flex;
align-items: center;
justify-content: center;
background: rgba(232,169,184,.25);
border-radius: 8px;
font-size: 30px;
}

.bm-ri-no-results {
padding: 30px;
text-align: center;
color: #7A285A;
}

@media (max-width: 900px) {

.bm-ri-books-year {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

}

@media (max-width: 650px) {

.bm-ri-books-year {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

}

@media (max-width: 430px) {

.bm-ri-books-year {
    grid-template-columns: 1fr;
}

}/* End custom CSS */