/* Styles moved from index.php */
body {
  font-family: system-ui, Arial, sans-serif;
  font-size: 18pt;
  background-color: black;
  color: #00aa1cff;
  margin: 0;
  width: 100%;
  min-height: 100vh;
}

/* Page wrapper for consistent centering */
.container {
  margin: 2rem auto;
  max-width: 900px;
  width: calc(100% - 2rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  padding: 0 1rem;
}

header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 1.5rem;
  gap: 1.5rem;
  width: 100%;
  box-sizing: border-box;
}

nav a {
  margin-right: 1rem;
  color: #FFF;
}

.card {
  border: 1px solid #00aa1cff;
  border-radius: 8px;
  padding: 1rem;
  margin-bottom: 1rem;
}

.err { color: #a00; }

input[type="text"], input[type="password"] {
  padding: .3rem .4rem;
  margin: .2rem 0;
  width: 100%;
  max-width: 220px;
}

button { padding: .3rem .8rem; cursor: pointer; }

.layout {
  display: flex;
  gap: 1.5rem;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.main { flex: 1 }
.sidebar { width: 280px; flex-shrink: 0 }

/* Make images responsive by default */
img { max-width: 100%; height: auto; }