:root {
  --color-primary: #333;
  --back-primary: #fff;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; color: #fff; background-color: #333; font: normal 1rem sans-serif; }
view { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; width: 100%; max-width: 490px; min-height: 100vh; height: 100vh; margin: 0 auto; padding: 0; background-color: #00f; color: #fff; }
view { background: linear-gradient(180deg, #0066ff 0%, #000088 100%); }

a { color: #fff; text-decoration: none; }
a:visited { color: #fff; }
li { list-style: none; }
button { margin: 10px; padding: 10px 20px; color: #fff; background-color: transparent; border: 1px solid #ccc; border-radius: 8px; font-size: 1.2rem; cursor: pointer; }
button:disabled { color: #aaa; background-color: #666; }
#submit { width: 200px; margin-top: 20px; background-color: #f40; color: #fff; border: none; }
#submit:disabled { color: #aaa; background-color: #666; }

forma { width: 90% }
forma li { margin: 10px 0; }
forma label { display: block; }
input[type="text"], input[type="number"], input[type="date"], input[type="time"] { width: 100%; padding: 10px; font-size: 1.2rem; border-radius: 8px; border: none; }

table { width: 100%; border-collapse: collapse; }

header { display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; padding: 10px 20px; }
user, logout { display: block; width: 100%; }
user   { text-align: left; }
logout { text-align: right; }