/* ===== Marketplace Recursos (escopat) ===== */
#recursos-scope {
  --rc-bg:#fff; --rc-fg:#0b1b2b; --rc-muted:#6b7a8c;
  --rc-line:#e5edf5; --rc-pill:#f1f5f9; --rc-chip-bg:#eef7ff; --rc-chip-fg:#0a4a6b;
  --rc-shadow:0 8px 24px rgba(12,74,110,.10); --rc-radius:16px;
}

/* Layout */
#recursos-scope .rc-container{
  max-width:1100px; margin:24px auto; padding:0 16px;
  display:grid; grid-template-columns:260px 1fr; gap:22px;
}
@media (max-width:900px){ #recursos-scope .rc-container{ grid-template-columns:1fr; } }

#recursos-scope .rc-title{font:800 22px/1.2 system-ui,sans-serif;margin:0 0 6px}
#recursos-scope .rc-sub{color:var(--rc-muted);margin:0 0 18px}

/* Sidebar */
#recursos-scope .rc-side .pill{
  display:flex;justify-content:space-between;align-items:center;
  padding:10px 12px;border-radius:12px;background:#fff;
  box-shadow:0 10px 30px rgba(15,23,42,.12);margin-bottom:10px
}

/* Grid + Cards */
#recursos-scope .rc-grid{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}
@media (min-width:1100px){ #recursos-scope .rc-grid{grid-template-columns:repeat(3,1fr)} }

#recursos-scope .rc-card{
  background:var(--rc-bg); border:1px solid var(--rc-line);
  border-radius:calc(var(--rc-radius) + 4px); overflow:hidden;
  box-shadow:var(--rc-shadow); display:flex; flex-direction:column;
}
#recursos-scope .rc-card-media{position:relative;aspect-ratio:4/3;background:#e5eef6}
#recursos-scope .rc-card-media img{width:100%;height:100%;object-fit:cover;display:block}
#recursos-scope .rc-badges-top{position:absolute;left:12px;top:12px;display:flex;gap:8px;flex-wrap:wrap}
#recursos-scope .rc-price{
  position:absolute;right:12px;bottom:12px;padding:6px 10px;border-radius:999px;
  font-weight:800;background:#fff;border:1px solid var(--rc-line);color:var(--rc-fg)
}
#recursos-scope .rc-badge{
  font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;
  background:var(--rc-pill);color:var(--rc-fg);border:1px solid var(--rc-line)
}
#recursos-scope .rc-badge.dark{background:var(--rc-chip-bg);color:var(--rc-chip-fg);border-color:#cfe8ff}
#recursos-scope .rc-card-body{padding:14px 14px 8px}
#recursos-scope .rc-name{font-weight:800;color:var(--rc-fg);line-height:1.25;margin:6px 0}
#recursos-scope .rc-metarow{display:flex;gap:10px;align-items:center;color:var(--rc-muted);font-size:13px}
#recursos-scope .rc-stars{display:inline-flex;gap:2px}
#recursos-scope .rc-stars svg{width:14px;height:14px;fill:#0a4a6b;opacity:.95}
#recursos-scope .rc-nums{margin-left:auto;display:inline-flex;gap:6px;align-items:center}

/* CTA (botons específics per recursos) */
#recursos-scope .rc-card-cta{display:flex;gap:8px;padding:12px 14px 16px}
#recursos-scope .btn-rc-primary{
  flex:1;text-align:center;background:#0b1b2b;color:#fff;border:0;border-radius:12px;
  padding:10px 12px;font-weight:800;cursor:pointer;transition:.15s ease transform, .15s ease filter
}
#recursos-scope .btn-rc-primary:hover{filter:brightness(1.05);transform:translateY(-1px)}
#recursos-scope .btn-rc-ghost{
  flex:0 0 auto;padding:10px 12px;border-radius:12px;border:1px solid var(--rc-line);
  background:#fff;color:var(--rc-fg);cursor:pointer
}

/* Inputs/selects dins subnav */
#recursos-scope .rc-input,#recursos-scope .rc-select{
  height:40px;padding:8px 12px;border:1px solid var(--rc-line);border-radius:10px;background:#fff;color:var(--rc-fg)
}
#recursos-scope .rc-input::placeholder{color:#98a7b7}

/* Estat buit + paginació */
#recursos-scope .rc-empty{
  padding:24px;border:1px dashed #cfe8ff;border-radius:12px;color:#6b7a8c;background:#fff
}
#recursos-scope .rc-pagination{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:16px}
#recursos-scope .rc-link{padding:8px 10px;border:1px solid var(--rc-line);border-radius:10px;background:#fff;color:var(--rc-fg);cursor:pointer}
#recursos-scope .rc-link:disabled{opacity:.45;cursor:not-allowed}

/* Modal */
#recursos-scope dialog.rc-modal{
  width:min(800px,92vw);border:none;border-radius:18px;box-shadow:0 24px 60px rgba(15,23,42,.3);padding:0
}
#recursos-scope .rc-modal header{padding:16px;border-bottom:1px solid var(--rc-line);display:flex;justify-content:space-between;align-items:center}
#recursos-scope .rc-modal .body{padding:16px}
#recursos-scope .rc-modal .body .cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:700px){ #recursos-scope .rc-modal .body .cols{grid-template-columns:1fr} }
#recursos-scope .rc-modal footer{padding:16px;border-top:1px solid var(--rc-line);display:flex;gap:8px;justify-content:flex-end}
#recursos-scope .rc-cover{aspect-ratio:4/3;border-radius:12px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;color:#6b7a8c}

/* Subnav (només dins recursos) */
#recursos-scope .subnav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.7);backdrop-filter:blur(10px);border-bottom:1px solid rgba(10,26,43,.08);box-shadow:0 6px 20px rgba(15,23,42,.08)}
#recursos-scope .subnav .wrap{max-width:1100px;margin:0 auto;padding:10px 20px;position:relative;display:flex;gap:8px}
#recursos-scope .tab-btn{border:0;cursor:pointer;padding:10px 16px;border-radius:12px;font-weight:700;background:transparent;color:var(--rc-fg)}
#recursos-scope .tab-btn:hover{background:#eef6ff}
#recursos-scope .tab-btn.is-active{color:#0a4a6b;background:#e6f6ff}
#recursos-scope .tab-indicator{position:absolute;bottom:0;height:3px;border-radius:3px;background:linear-gradient(135deg,#1e3a8a,#0ea5ea);width:0;left:0}