/* Ubuntu / Yaru-inspired theme for Blazor WASM */
:root{
  --ubuntu-bg: #2c001e;       /* aubergine */
  --ubuntu-bg-alt:#3d0b2c;
  --ubuntu-fg: #f2f2f2;
  --ubuntu-muted:#c0b3b3;
  --ubuntu-accent:#e95420;    /* orange */
  --ubuntu-accent-2:#f99b11;  /* warm orange */
  --shadow: 0 10px 30px rgba(0,0,0,.35);
}

html, body{
  height:100%;
  background: radial-gradient(1200px 800px at 80% -10%, #77216f 0%, var(--ubuntu-bg) 35%, #1a0013 100%);
  color: var(--ubuntu-fg);
  font-family: "Ubuntu", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
}

a{ color: var(--ubuntu-accent); text-decoration: none; }
a:hover{ text-decoration: underline; }

/* Top bar */
.top-row{
  display:flex; align-items:center; gap:.6rem;
  height:56px; padding:0 1rem;
  background: linear-gradient(0deg, var(--ubuntu-bg-alt), var(--ubuntu-bg));
  border-bottom:1px solid rgba(255,255,255,.08);
  position: sticky; top: 0; z-index: 10;
  box-shadow: var(--shadow);
}
.top-row img{ height:20px; width:20px; filter: drop-shadow(0 0 8px rgba(0,0,0,.3)); }
.top-row .brand{ font-weight:700; letter-spacing:.2px; }

/* Content area */
.content{ padding: 1.25rem; max-width: 920px; margin: 0 auto; }

/* Terminal-style panel (for your command UI) */
.terminal{
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(6px);
  border-radius: 14px;
  box-shadow: var(--shadow);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.terminal .titlebar{
  display:flex; align-items:center; gap:.5rem;
  padding:.6rem .8rem; background: rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.terminal .dots{ display:flex; gap:.4rem; margin-right:.4rem; }
.terminal .dot{ height:.8rem; width:.8rem; border-radius:50%; }
.terminal .dot.red{ background:#ff5f57; }
.terminal .dot.yellow{ background:#ffbd2e; }
.terminal .dot.green{ background:#28c840; }

.terminal .viewport{ padding: 1rem 1rem 1.2rem; font-family: "Ubuntu Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; font-size: 0.98rem; line-height: 1.5; }
.terminal .prompt{ color: var(--ubuntu-accent-2); }
.terminal input[type="text"]{
  width:100%;
  color: var(--ubuntu-fg);
  background: transparent;
  border: none;
  outline: none;
  font-family: inherit;
  font-size: inherit;
  caret-color: var(--ubuntu-accent);
}

/* Small helpers */
.badge{ display:inline-block; padding:.15rem .5rem; border-radius:999px; background: rgba(255,255,255,.1); color: var(--ubuntu-fg); font-size:.75rem; }
.btn{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.55rem .9rem; border-radius:10px; border:1px solid rgba(255,255,255,.12);
  background: linear-gradient(0deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  color: var(--ubuntu-fg); cursor:pointer;
}
.btn:hover{ border-color: rgba(255,255,255,.22); }