/* Cards */
.cards { display:grid; gap:1rem; grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); }
.card { background:var(--color-bg-alt); padding:1rem; border:1px solid var(--border-color); border-radius:var(--radius); display:flex; flex-direction:column; gap:.5rem; transition:background .3s var(--ease-standard), border-color .3s var(--ease-standard); }
.card h3 { margin:0; font-size:1rem; display:flex; gap:.5rem; align-items:center; }
.card p { margin:0; font-size:var(--font-size-base); color:var(--color-muted);} 
.card-chico { margin:0; font-size:var(--font-size-base); color:var(--color-muted); }


/* Featured Card - use theme tokens from main.css to support light/dark themes */
.card-featured { color: var(--ui-card-featured-text); background: var(--ui-card-featured-bg); border:1px solid var(--ui-card-featured-border); border-radius: var(--radius); padding:1rem; }
.card-featured .icon { color: var(--ui-card-featured-icon); }
.card-featured p, .card-featured li { color: var(--ui-card-featured-text); opacity:0.95; font-size:var(--font-size-base); }
.card-featured h3 { color: var(--ui-card-featured-text); margin:0 0 .25rem 0; }


/* Ghost / padding utilities for cards (moved here to keep card variants together) */
.card-ghost { background: transparent; border: none; box-shadow: none; }
.card-padding { padding: .75rem; }

/* Ghost con borde estándar: fondo transparente, borde del tema y sin sombra */
.card-ghost-bordered { background: transparent; border:1px solid var(--border-color); box-shadow:none; border-radius: var(--radius); }