/* Library category pages: visual treatment inspired by the provided reference. */
.inner-hero:not(.compact) {
  min-height: 355px;
  display: flex;
  align-items: center;
  color: #fff;
  background-color: #043b34;
  background-image: linear-gradient(90deg, rgba(2,38,32,.04), rgba(2,38,32,.72)), url('library-hero.webp');
  background-position: center;
  background-size: cover;
  position: relative;
  overflow: hidden;
  border-bottom: 4px solid rgba(199,155,75,.65);
}
.inner-hero:not(.compact)::before {
  content: ""; position:absolute; inset:15px; border:1px solid rgba(226,188,104,.28); pointer-events:none;
}
.inner-hero:not(.compact) .container { position:relative; z-index:1; width:min(850px,calc(100% - 40px)); margin:0 auto; text-align:center; }
.inner-hero:not(.compact) .eyebrow { color:#f3cf84; }
.inner-hero:not(.compact) h1 {
  color:#fff; font-size:62px; text-shadow:0 4px 14px rgba(0,0,0,.28); margin-bottom:13px;
}
.inner-hero:not(.compact) h1::after { content:"✦ ───── ✦ ───── ✦"; display:block; color:#d5aa55; font:16px Amiri; margin-top:8px; letter-spacing:5px; }
.category-intro { margin:9px 0 15px; font-size:15px; color:#f2f4ee; }
.hero-library-search { display:flex; max-width:600px; margin:0 auto 13px; padding:6px; border-radius:12px; background:#fff; box-shadow:0 10px 23px rgba(0,0,0,.2); }
.hero-library-search input { flex:1; min-width:0; border:0; outline:0; padding:11px 14px; font:13px Cairo,sans-serif; background:transparent; }
.hero-library-search button { border:0; border-radius:8px; background:linear-gradient(135deg,#c79b4b,#9c702f); color:#fff; padding:8px 18px; font:700 13px Cairo,sans-serif; cursor:pointer; }
.inner-hero:not(.compact) .breadcrumbs { justify-content:center; color:#f1f3ee; }
.inner-hero:not(.compact) .breadcrumbs a { color:#f2d189; }
.listing-layout { align-items:start; gap:26px; padding-top:36px; }
.library-sidebar {
  background:#fff; border:1px solid #ece7dc; border-radius:13px; padding:22px 16px;
  box-shadow:0 8px 24px rgba(4,55,46,.07); border-left:0;
}
.library-sidebar h3 { color:#073d35; border-bottom:1px solid #ebe6db; padding:0 8px 12px; margin-bottom:9px; }
.library-sidebar>a { padding:11px 12px; border-radius:7px; transition:.18s ease; font-size:13px; }
.library-sidebar>a:hover { background:#f8f4e9; color:#9f742f; }
.library-sidebar>a.active { background:linear-gradient(90deg,#f9f3e4,#fff); color:#a47732; border-right:3px solid #c79b4b; }
.library-sidebar .tree-root { margin-top:3px; }
.results { min-width:0; }
.inline-search { border:0; padding:6px; border-radius:11px; background:#fff; box-shadow:0 8px 20px rgba(3,48,41,.08); }
.inline-search input { font-size:14px; }
.inline-search button { background:linear-gradient(135deg,#c79b4b,#a77930); border-radius:8px; }
.result-count { background:#f5f1e7; color:#64736d; padding:8px 12px; display:inline-block; border-radius:16px; margin-bottom:17px; }
.results-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:17px; }
.results-toolbar .result-count { margin:0; }
.sort-form { display:flex; align-items:center; gap:7px; font-size:11px; color:#6c7873; }
.sort-form select { border:1px solid #e3ded3; background:#fff; border-radius:7px; padding:7px 9px; color:#174b40; font:12px Cairo,sans-serif; outline:0; }
.results-grid { grid-template-columns:1fr; gap:14px; }
.result-card {
  background:#fff; border:1px solid #ece9e1; border-radius:11px; padding:19px;
  box-shadow:0 5px 16px rgba(3,48,41,.045); transition:.2s ease; align-items:center;
}
.result-card:hover { border-color:#dfc68e; box-shadow:0 11px 25px rgba(3,48,41,.1); transform:translateY(-2px); }
.result-card .type-icon { background:#edf4ef; width:54px; height:54px; color:#075047; }
.result-card.audio-result { align-items:center; gap:18px; }
.result-player { width:64px; flex:none; display:flex; flex-direction:column; align-items:center; gap:7px; }
.result-player .play-button { width:52px; height:52px; background:linear-gradient(135deg,#0b5c50,#043b34); box-shadow:0 6px 14px rgba(3,54,45,.2); }
.audio-duration { min-width:48px; border-radius:10px; padding:4px 6px; text-align:center; background:#edf1ed; color:#34554d; font:700 10px Arial,sans-serif; direction:ltr; }
.result-content { min-width:0; flex:1; }
.result-card footer { align-items:center; gap:9px; flex-wrap:wrap; }
.result-card footer time { color:#75847e; }
.result-download { margin-right:auto; width:30px; height:30px; }
.result-card h2 { font-size:21px; color:#063d35; }
.result-card p { color:#87908b; margin-bottom:8px; }
.result-card footer { border-top:1px dashed #e9e3d7; padding-top:8px; }
.pagination { justify-content:center; margin:38px 0 4px; direction:rtl; }
.pagination a { border-radius:8px; width:38px; height:38px; background:#fff; }
.pagination a.active { background:linear-gradient(135deg,#c79b4b,#9f7331); box-shadow:0 5px 12px rgba(159,115,49,.25); }
.pagination-ellipsis { width:30px; height:38px; display:grid; place-items:center; color:#9a8b70; font-size:20px; }
/* Fallback for older browsers that do not run the JavaScript paginator. */
.pagination a:nth-child(n+5):nth-last-child(n+2) { display:none; }
.pagination a.active { display:grid !important; }
@media (max-width:800px) {
  .inner-hero:not(.compact) { min-height:300px; }
  .inner-hero:not(.compact) .container { width:calc(100% - 32px); margin:auto; }
  .inner-hero:not(.compact) h1 { font-size:45px; }
  .listing-layout { padding-top:25px; }
  .listing-layout .results { order:-1; }
  .results-toolbar { align-items:flex-start; flex-direction:column; }
  .result-card.audio-result { gap:11px; }
  .result-player { width:52px; }
  .result-player .play-button { width:45px; height:45px; }
  .result-card h2 { font-size:17px; }
  .result-card p { display:none; }
  .library-sidebar.legacy-accordion-ready { padding:0; overflow:hidden; }
  .legacy-accordion-toggle {
    width:100%; display:block; border:0; padding:16px; background:#075047; color:#fff;
    text-align:right; font:700 15px Tahoma,Arial,sans-serif; cursor:pointer;
  }
  .legacy-accordion-toggle span { float:right; }
  .legacy-accordion-toggle b { float:left; color:#f0c978; font:22px Arial,sans-serif; line-height:16px; }
  .legacy-accordion-toggle:after { content:""; display:block; clear:both; }
  .legacy-accordion-content { display:none; padding:12px; }
  .library-sidebar.legacy-accordion-open .legacy-accordion-content { display:block; }
  .library-sidebar.legacy-accordion-open .legacy-accordion-toggle b { transform:rotate(180deg); }
}