/* Actus page styles (light/dark aware) */
:root { color-scheme: dark light; }

.news {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
  padding-top: var(--content-gap-top);
  padding-inline: var(--content-gap-x);
  padding-bottom: var(--content-gap-bottom);
}

.news-toolbar {
  position: static;
  backdrop-filter: blur(6px) saturate(1.05);
  background: rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: .6rem .75rem;
  margin: .75rem 0 1rem;
}
.news-toolbar .row { display: grid; grid-template-columns: 1fr auto auto auto; gap: .5rem; align-items: center; }
.input, .select, .btn { background: #0f1115; color: #fff; border: 1px solid rgba(255,255,255,.18); border-radius: 8px; padding: .6rem .7rem; font: inherit; }
.btn { cursor: pointer; }
.btn--link { background: transparent; border: none; text-decoration: underline; padding: 0; }
.sources { margin-top: .5rem; }
.sources-actions { display: flex; justify-content: flex-end; margin: .25rem 0 .25rem; }
.sources-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .35rem .75rem; padding-top: .5rem; }
.sources-grid label { display: flex; align-items: center; gap: .5rem; }

.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(.8rem, 2vw, 1.2rem); margin-top: .5rem; }
@media (max-width: 980px){ .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px){ .cards { grid-template-columns: 1fr; } }

.card-n { position: relative; display: grid; grid-template-rows: auto auto 1fr auto; gap: .5rem; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); border-radius: 12px; padding: .8rem; text-decoration: none; color: #fff; }
.card-n > * { pointer-events: none; }
.card-n__thumb { position: relative; aspect-ratio: 16/9; border-radius: 10px; overflow: hidden; background: rgba(255,255,255,.06); }
.card-n__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card-n:hover { border-color: rgba(255,255,255,.28); transform: translateY(-2px); transition: transform .15s ease; }
.card-n__meta { display: flex; align-items: center; gap: .5rem; opacity: .9; font-size: .9rem; }
.card-n__meta img { width: 18px; height: 18px; border-radius: 4px; object-fit: cover; flex: 0 0 auto; }
.card-n { cursor: pointer; }
.card-n__title { font-weight: 700; font-size: 1rem; line-height: 1.35; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card-n__summary { opacity: .95; font-size: .95rem; line-height: 1.45; margin: .2rem 0 .4rem; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card-n__tags { opacity: .9; font-size: .85rem; display: flex; flex-wrap: wrap; gap: .25rem .4rem; }
.card-n__tags .tag { border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: .1rem .4rem; }

.cards--skeleton::before { content: ""; display: block; height: 140px; margin: .6rem 0; background: linear-gradient(90deg, rgba(255,255,255,.06), rgba(255,255,255,.14), rgba(255,255,255,.06)); animation: shimmer 1.2s infinite; border-radius: 12px; }
@keyframes shimmer { 0%{ background-position: -200px 0; } 100%{ background-position: calc(200px + 100%) 0; } }

.paginator { display: flex; align-items: center; justify-content: center; gap: .6rem; margin-top: 1rem; }
.meta { opacity: .9; }
.error { margin-top: 1rem; background: rgba(255,56,56,.12); border: 1px solid rgba(255,56,56,.35); border-radius: 8px; padding: .6rem .8rem; }

@media (prefers-color-scheme: light){
  .news-toolbar{ background: rgba(255,255,255,.6); border-color: rgba(0,0,0,.08); }
  .input,.select,.btn{ background:#fff; color:#111; border-color: rgba(0,0,0,.18); }
  .card-n{ background:#fff; color:#111; border-color: rgba(0,0,0,.12); }
  .card-n__thumb{ background: rgba(0,0,0,.06); }
  .error{ background:#fee2e2; border-color:#fecaca; }
}
