#bs-library-wrapper {
    display: flex;
    font-family: inherit;
    min-height: 700px;
    background: #fff;
    border: 1px solid #ddd;
    direction: rtl;
    gap: 0;
    font-size: 20px;
}

#bs-sidebar { width: 320px; background: #f9f9f9; border-left: 1px solid #ddd; flex-shrink: 0; padding-bottom: 20px; }
.bs-sidebar-header { background: #0a1f2e; color: #fff; padding: 25px; text-align: center; }
.bs-sidebar-header h3 { margin: 0; color: #fff; font-size: 28px; font-weight: bold; }

.bs-filter-box { padding: 25px; border-bottom: 1px solid #ddd; background: #eee; }
.bs-filter-box label { display: block; margin-bottom: 8px; font-weight: bold; font-size: 18px; color: #333; }

#bs-search-input, #bs-book-filter {
    width: 100%; padding: 12px; border: 1px solid #bbb; border-radius: 4px;
    font-size: 18px; color: #000; background: #fff; margin-bottom: 15px;
}

/* כפתורי חיפוש */
#bs-search-btn { 
    width: 100%; background: #f37021; color: #fff; border: none; 
    padding: 12px; border-radius: 4px; cursor: pointer; 
    font-weight: bold; font-size: 20px; margin-bottom: 10px;
}
#bs-search-btn:hover { background: #d35400; }

#bs-clear-btn {
    width: 100%; background: #fff; color: #555; border: 1px solid #ccc;
    padding: 8px; border-radius: 4px; cursor: pointer; font-size: 16px;
}
#bs-clear-btn:hover { background: #f1f1f1; }

/* ניווט */
.bs-nav-header { padding: 15px 25px 5px; font-size: 18px; color: #888; font-weight: bold; }
.bs-cat-nav ul { list-style: none; padding: 0; margin: 0; }
.bs-cat-nav li { 
    padding: 15px 25px; border-bottom: 1px solid #e0e0e0; cursor: pointer; 
    transition: 0.2s; font-size: 20px; font-weight: 500; color: #444; 
}
.bs-cat-nav li:hover, .bs-cat-nav li.active { 
    background: #fff; color: #f37021; border-right: 6px solid #f37021; font-weight: bold; 
}

#bs-main-content { flex-grow: 1; padding: 50px; background: #fff; position: relative; }
.bs-section-title { 
    color: #0a1f2e; border-bottom: 3px solid #f37021; padding-bottom: 10px; 
    margin-bottom: 40px; font-size: 32px; font-weight: bold; 
}

.bs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 30px; }
.bs-book-card {
    height: 280px; background: linear-gradient(135deg, #0a1f2e 0%, #163b55 100%); color: #ffd700;
    border: 1px solid #000; padding: 20px; display: flex; align-items: center; justify-content: center;
    text-align: center; position: relative; cursor: pointer; box-shadow: 4px 4px 12px rgba(0,0,0,0.2);
    border-radius: 4px;
}
.bs-book-face h3 { margin: 0; font-size: 26px; line-height: 1.4; text-shadow: 2px 2px 4px #000; }
.bs-book-spine { position: absolute; right: 0; top: 0; bottom: 0; width: 12px; background: rgba(0,0,0,0.3); border-left: 1px solid rgba(255,255,255,0.1); }

/* תוצאות חיפוש - דק וקריא */
.bs-result-item { 
    border: 1px solid #ddd; padding: 25px; border-radius: 6px; cursor: pointer; margin-bottom: 20px; background: #fafafa;
}
.bs-result-item:hover { background: #fff; border-color: #f37021; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
.bs-result-item strong { color: #0a1f2e; display: block; margin-bottom: 10px; font-size: 24px; font-weight: bold; }
.bs-result-item p { 
    margin: 0; color: #333; font-size: 20px; line-height: 1.6; 
    font-weight: 400; /* דק יותר */
}
mark { background: #ffeeba; padding: 0 2px; }

/* קורא - טקסט דק */
.bs-reader-wrapper { max-width: 900px; margin: 0 auto; }
.bs-page-title { 
    color: #0a1f2e; font-size: 40px; margin-bottom: 30px; text-align: center; 
    border-bottom: 2px solid #f37021; padding-bottom: 15px; 
}
.bs-reader-text { 
    font-size: 28px; line-height: 1.9; color: #111; text-align: justify;
    font-weight: 400; /* דק יותר */
}

/* כלים */
#bs-top-tools { display: flex; justify-content: flex-end; gap: 15px; margin-bottom: 20px; border-bottom: 1px solid #eee; padding-bottom: 10px; }
.bs-tool-btn { width: 50px; height: 50px; font-size: 26px; border: 1px solid #ccc; background: #fff; border-radius: 5px; cursor: pointer; }
.bs-tool-btn:hover { background: #f37021; color: #fff; border-color: #f37021; }

.bs-reader-nav { display: flex; justify-content: center; gap: 15px; margin: 30px 0; }
.bs-reader-nav button { font-size: 22px; padding: 12px 30px; background: #0a1f2e; color: #fff; border: none; border-radius: 6px; cursor: pointer; }
.bs-reader-nav input { font-size: 22px; padding: 8px; width: 90px; text-align: center; }

@media (max-width: 768px) { #bs-library-wrapper { flex-direction: column; } #bs-sidebar { width: 100%; } }