/* HSA Resource Folder Browser — defaults only.
   Every value here is overridden by the Elementor Style tab via {{WRAPPER}} rules,
   so this file is just a sane starting point (and what the shortcode falls back to). */

.hsa-rb-root{--rb-blue:#2ba3e8;--rb-navy:#16223c;--rb-cols:2;font-family:inherit}

/* nav bar — a robust flex that can never overlap at any width:
     row 1 = breadcrumb, on its OWN full-width line (kept to one line; scrolls sideways if long)
     row 2 = search (grows) + Back (right) SHARE one line — so nothing is left alone
   Each of the three parts can be shown/hidden per device from the Elementor
   "Navigation → Show / hide" controls. */
.hsa-rb-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin-bottom:18px}
/* The breadcrumb is one non-wrapping line that scrolls sideways. It opens scrolled to
   the END so the CURRENT (deepest) crumb is what you see; the earlier ancestors sit
   off-screen to the LEFT and are revealed by dragging back (mouse OR touch — see
   enableDragScroll in the JS). touch-action:pan-y lets the page still scroll vertically
   while we own the horizontal drag. The scrollbar is hidden; an edge fade hints that
   there is more on whichever side is still off-screen. */
.hsa-rb-crumbs{flex:1 1 100%;min-width:0;display:flex;flex-wrap:nowrap;align-items:center;gap:2px;font-size:.95rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;touch-action:pan-y;overscroll-behavior-x:contain}
.hsa-rb-crumbs::-webkit-scrollbar{display:none}
.hsa-rb-crumbs.rb-can-scroll{cursor:grab}
.hsa-rb-crumbs.rb-dragging{cursor:grabbing;user-select:none}
.hsa-rb-crumbs.rb-fade-left{-webkit-mask-image:linear-gradient(to right,transparent,#000 34px);mask-image:linear-gradient(to right,transparent,#000 34px)}
.hsa-rb-crumbs.rb-fade-right{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 34px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 34px),transparent)}
.hsa-rb-crumbs.rb-fade-both{-webkit-mask-image:linear-gradient(to right,transparent,#000 34px,#000 calc(100% - 34px),transparent);mask-image:linear-gradient(to right,transparent,#000 34px,#000 calc(100% - 34px),transparent)}
.hsa-rb-crumbs a,.hsa-rb-crumbs .cur{white-space:nowrap}
.hsa-rb-crumbs a{color:var(--rb-blue);font-weight:600;cursor:pointer;text-decoration:none;padding:3px 5px;border-radius:6px;-webkit-user-drag:none;user-select:none}
.hsa-rb-crumbs a:hover{background:rgba(0,0,0,.06)}
.hsa-rb-crumbs .sep{opacity:.45;margin:0 1px}
.hsa-rb-crumbs .cur{font-weight:700}
.hsa-rb-search{order:2;flex:1 1 0;min-width:0;max-width:420px;margin:0;padding:9px 14px;border:1px solid rgba(0,0,0,.15);border-radius:10px;font:inherit}
.hsa-rb-back{order:3;flex:0 0 auto;margin-left:auto;cursor:pointer;border:1px solid rgba(0,0,0,.15);background:#fff;border-radius:8px;padding:6px 12px;font-weight:600;font-size:.85rem;color:inherit;font-family:inherit;white-space:nowrap}
.hsa-rb-back[hidden]{display:none}

/* panels — only one is visible at a time */
.hsa-rb-panel[hidden]{display:none}

/* folder cards */
.hsa-rb-grid{display:grid;grid-template-columns:repeat(var(--rb-cols),minmax(0,1fr));gap:22px}
.hsa-rb-card{background:#fff;border:2px solid var(--rb-blue);border-radius:16px;padding:18px;cursor:pointer;text-align:center;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease;width:100%;font-family:inherit;display:block;color:inherit}
.hsa-rb-card:hover{transform:translateY(-4px)}
.hsa-rb-card:focus-visible{outline:3px solid var(--rb-blue);outline-offset:3px}
.hsa-rb-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--rb-navy);border-radius:9px;min-height:150px;padding:18px}
.hsa-rb-title{color:#fff;font-size:1.7rem;font-weight:700;line-height:1.2}
/* optional caption lines under a folder title — styled like the button's small lines */
.hsa-rb-csub{display:block;margin-top:6px;color:#dbe7ff;font-size:.9rem;font-weight:600;line-height:1.25}
.hsa-rb-csub.hsa-rb-csmall{margin-top:3px;color:#aac4ef;font-size:.82rem;font-weight:500}
.hsa-rb-hint{display:block;margin-top:10px;font-size:.8rem;opacity:.65;font-weight:600}

/* chapter collection */
.hsa-rb-collection{display:flex;flex-direction:column;gap:24px;max-width:660px;margin:0 auto}
.hsa-rb-chapter{text-align:center}
.hsa-rb-chapter-head{font-size:1.8rem;font-weight:800;line-height:1.2;margin:0 0 16px}
.hsa-rb-btnrow{display:block}
.hsa-rb-btn{display:block;width:100%;background:var(--rb-blue);color:#fff;border:0;border-radius:12px;padding:18px 22px;cursor:pointer;text-align:center;transition:background-color .16s,transform .16s,border-color .16s;font-family:inherit}
.hsa-rb-btn:hover{background:#1e88cf;transform:translateY(-2px)}
.hsa-rb-btn:focus-visible{outline:3px solid var(--rb-navy);outline-offset:3px}
.hsa-rb-btn .t{display:block;font-size:1.05rem;font-weight:700}
.hsa-rb-btn .s{display:block;font-size:.9rem;opacity:.92;margin-top:5px}
.hsa-rb-btn .s.sm{font-size:.82rem;opacity:.8}
.hsa-rb-btn--nodoc{opacity:.5;cursor:not-allowed}

.hsa-rb-empty{opacity:.6;text-align:center;padding:34px}

/* ── PDF Viewer embed ──────────────────────────────────────────────────────────
   The viewer inserts its own `.pdfv-block` immediately AFTER the button it was
   opened from, i.e. inside our chapter row. These rules make sure it always gets
   the full width of the chapter and never inherits the button's centring or any
   flex sizing — the viewer's own stylesheet handles everything inside it. */
.hsa-rb-chapter .pdfv-block,
.hsa-rb-btnrow .pdfv-block{display:block;width:100%;max-width:100%;flex:0 0 100%;text-align:left;margin-top:12px}
.hsa-rb-chapter .pdfv-panel,
.hsa-rb-btnrow .pdfv-panel{width:100%}
/* the viewer's own toolbar buttons must not pick up our button styling */
.hsa-rb-root .pdfv-bar button{width:auto;display:inline-block}

/* smooth hover transitions for the styleable bits (Normal ↔ Hover in Elementor) */
.hsa-rb-inner{transition:background-color .16s,border-color .16s,box-shadow .16s}
.hsa-rb-title,.hsa-rb-hint,.hsa-rb-csub,.hsa-rb-chapter-head{transition:color .16s}
.hsa-rb-back{transition:background-color .16s,border-color .16s,color .16s}
.hsa-rb-crumbs a{transition:background-color .16s,color .16s}

/* motion */
.hsa-rb-anim{animation:hsaRbFade .25s ease}
@keyframes hsaRbFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

@media(max-width:600px){.hsa-rb-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){
	.hsa-rb-card,.hsa-rb-btn,.hsa-rb-anim,.hsa-rb-inner,.hsa-rb-title,.hsa-rb-hint,.hsa-rb-csub,.hsa-rb-chapter-head,.hsa-rb-back,.hsa-rb-crumbs a{transition:none;animation:none}
	.hsa-rb-card:hover,.hsa-rb-btn:hover{transform:none}
}