/* Training Portal Styles - similar vibe to shift calendar, clean/dark-mode aware */
:root{
  --rssc-bg:#0f172a;
  --rssc-card:#111827;
  --rssc-border:#1f2937;
  --rssc-text:#e5e7eb;
  --rssc-muted:#9ca3af;
  --rssc-accent:#3b82f6;
  --rssc-accent-2:#64748b;
  --rssc-chip:#0ea5e9;
  --rssc-green:#10b981;
}
@media (prefers-color-scheme: light) {
  :root{
    --rssc-bg:#f8fafc;
    --rssc-card:#ffffff;
    --rssc-border:#e5e7eb;
    --rssc-text:#111827;
    --rssc-muted:#6b7280;
    --rssc-accent:#2563eb;
    --rssc-accent-2:#334155;
    --rssc-chip:#0284c7;
    --rssc-green:#059669;
  }
}

.rssc-training-portal{
  background:var(--rssc-bg);
  border:1px solid var(--rssc-border);
  padding:1rem;
  border-radius:1rem;
  box-shadow:0 10px 30px rgba(0,0,0,.2);
  color:var(--rssc-text);
}

.rssc-tabs{
  display:flex;
  gap:.5rem;
  margin-bottom:1rem;
}
.rssc-tab{
  background:transparent;
  border:1px solid var(--rssc-border);
  color:var(--rssc-text);
  padding:.5rem 1rem;
  border-radius:999px;
  cursor:pointer;
}
.rssc-tab.active{ background:var(--rssc-accent); border-color:var(--rssc-accent); color:white; }

.rssc-tabpanel{ display:none; }
.rssc-tabpanel.active{ display:block; }

.rssc-toolbar{
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
  margin-bottom:1rem;
}
.rssc-search, .rssc-filter{
  padding:.6rem .8rem;
  border:1px solid var(--rssc-border);
  border-radius:.8rem;
  background:var(--rssc-card);
  color:var(--rssc-text);
  min-width:220px;
}

.rssc-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap:1rem;
}

.rssc-card{
  border:1px solid var(--rssc-border);
  background:var(--rssc-card);
  border-radius:1rem;
  padding:1rem;
  display:flex;
  flex-direction:column;
  gap:.75rem;
}
.rssc-card-header{
  display:flex;
  align-items:center;
  gap:.75rem;
  justify-content:space-between;
}
.rssc-title{ font-size:1.05rem; margin:0; }
.rssc-datechip{
  background:var(--rssc-chip);
  color:white;
  font-weight:600;
  padding:.25rem .5rem;
  border-radius:.5rem;
}
.rssc-badge{
  background:var(--rssc-accent-2);
  color:white;
  padding:.15rem .45rem;
  border-radius:.35rem;
  font-size:.8rem;
}
.rssc-meta{
  list-style:none;
  padding:0; margin:0;
  display:grid; gap:.25rem;
}
.rssc-meta li span{ color:var(--rssc-muted); margin-right:.35rem; }

.rssc-card-actions{
  display:flex; gap:.5rem; flex-wrap:wrap;
}
.button{
  display:inline-block;
  text-decoration:none;
  background:var(--rssc-accent);
  color:white; padding:.5rem .75rem;
  border-radius:.6rem;
  transition: transform .05s ease-in-out, filter .15s ease;
}
.button:hover{ filter:brightness(1.05); transform:translateY(-1px); }
.button.button-secondary{ background:var(--rssc-green); }
.button.disabled{ opacity:.5; pointer-events:none; }

.rssc-tags{ display:flex; gap:.35rem; flex-wrap:wrap; }
.rssc-tag{
  border:1px solid var(--rssc-border);
  padding:.15rem .45rem;
  border-radius:.5rem;
  font-size:.8rem;
  color:var(--rssc-muted);
}

.rssc-excerpt{ color:var(--rssc-text); opacity:.9; }

/* Admin meta fields */
.rssc-field-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:1rem;
}
.rssc-field-grid p.wide{ grid-column: span 2 / span 2; }



/* Frontend submission forms */
.rssc-form input[type="text"],
.rssc-form input[type="date"],
.rssc-form input[type="time"],
.rssc-form input[type="url"],
.rssc-form input[type="file"],
.rssc-form textarea,
.rssc-form select{
  width:100%;
  padding:.6rem .8rem;
  border:1px solid var(--rssc-border);
  border-radius:.6rem;
  background:var(--rssc-card);
  color:var(--rssc-text);
}
.rssc-checkboxes{ display:flex; flex-wrap:wrap; gap:.5rem; }
.rssc-check{ display:inline-flex; align-items:center; gap:.35rem; border:1px solid var(--rssc-border); padding:.25rem .5rem; border-radius:.5rem; }
.rssc-alert{ padding:.75rem 1rem; border-radius:.6rem; margin-bottom:.75rem; background:rgba(255,255,255,.06); border:1px solid var(--rssc-border); }
.rssc-alert.rssc-success{ border-color:#15803d; }
.rssc-alert.rssc-error{ border-color:#b91c1c; }


/* Category add block fine-tune */
.rssc-form select[name="new_cat_parent"]{
  max-width:320px;
  margin-top:.35rem;
}


/* Danger button */
.button.button-danger{ background:#ef4444; }
.button.button-danger:hover{ filter:brightness(1.05); transform:translateY(-1px); }