/*
 * Datei: /css/canvas.css
 * Version: 1.1.0
 * Zweck: Eigene Shell- und Übersichtsstyles für die Canvas-Welt
 */
.canvas-shell-body{background:#eaf0f7}
.canvas-topbar{background:#0f172a}
.canvas-title-tag{font-size:.78rem;font-weight:600;color:#93c5fd}
.canvas-main{padding:1.25rem}
.canvas-hero{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}
.canvas-hero-copy{max-width:760px}
.canvas-stage{min-height:320px}
.canvas-empty{padding:2rem;border:2px dashed #cbd5e1;border-radius:16px;background:#f8fafc}
.canvas-module-shell{display:flex;flex-direction:column;gap:1rem}
.canvas-module-meta{display:flex;gap:.75rem;flex-wrap:wrap;color:#64748b;font-size:.95rem}
.canvas-list{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.canvas-list .card h3{margin-top:0}
.canvas-admin-link{display:inline-flex;align-items:center;gap:.45rem}
@media (max-width: 900px){
  .canvas-shell{grid-template-columns:1fr}
  .canvas-hero{flex-direction:column}
}

.canvas-status-grid{margin-top:1rem}
.canvas-topbar{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center}
.canvas-topbar-nav{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.canvas-topbar-link{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .7rem;border-radius:999px;color:#dbeafe;text-decoration:none;background:rgba(255,255,255,.04)}
.canvas-topbar-link.active,.canvas-topbar-link:hover{background:#1d4ed8;color:#fff}
.canvas-topbar-auth{justify-self:end;color:#e5e7eb}
.canvas-hero-actions{display:flex;gap:.75rem;align-items:center}
.canvas-badge{display:inline-block;margin-left:.35rem;padding:.05rem .4rem;border-radius:999px;background:#1d4ed8;color:#fff;font-size:.72rem}
@media (max-width: 1100px){
  .canvas-topbar{grid-template-columns:1fr}
  .canvas-topbar-auth{justify-self:start}
}


.canvas-shell{grid-template-columns:1fr}
.canvas-main{padding:1.25rem;max-width:1400px;width:100%;margin:0 auto}
.canvas-topbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:1rem;align-items:center}
.canvas-topbar-tools{display:flex;justify-content:flex-end;align-items:center}
.canvas-surface-details{position:relative}
.canvas-surface-toggle{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .8rem;border-radius:999px;background:rgba(255,255,255,.06);color:#dbeafe;cursor:pointer;list-style:none}
.canvas-surface-toggle::-webkit-details-marker{display:none}
.canvas-surface-details[open] .canvas-surface-toggle,.canvas-surface-toggle:hover{background:#1d4ed8;color:#fff}
.canvas-surface-panel{position:absolute;right:0;top:calc(100% + .5rem);z-index:40;min-width:320px;max-width:460px;display:grid;gap:.55rem;padding:1rem;border-radius:14px;background:#ffffff;color:#111827;border:1px solid #dbe4ee;box-shadow:0 18px 40px rgba(15,23,42,.16)}
.canvas-surface-panel span{font-size:.92rem;color:#334155}
@media (max-width: 1200px){
  .canvas-topbar{grid-template-columns:1fr}
  .canvas-topbar-auth,.canvas-topbar-tools{justify-self:start}
}