View Code - 20260722

employee_register.css | 20260722_120325.php Initial Domain Snapshot

body.page-employee-register {
  background: #f6bfc3;
  min-height: 100vh;
  font-family: 'Inter', 'Roboto', Arial, sans-serif;
  margin: 0;
}

.card {
  max-width: 600px;
  margin: 50px auto;
  background: #374151;
  border-radius: 18px;
  box-shadow: 0 8px 28px rgba(40,40,60,0.16), 0 2px 14px rgba(0,0,0,0.10);
  padding: 38px 40px 28px 40px;
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.card h2,
.card .title {
  font-size: 2rem;
  font-weight: 500;
  text-align: center;
  margin-bottom: 32px;
  letter-spacing: 0.02em;
  color: #fff;
}

label {
  display: block;
  font-size: 1rem;
  color: #d1fae5;
  margin-bottom: 7px;
  letter-spacing: 0.02em;
}

input[type="text"], input[type="number"], input[type="date"], select {
  width: 100%;
  padding: 10px 15px;
  font-size: 1rem;
  border: 1px solid #ced4da;
  background: #fff;
  color: #222;
  border-radius: 10px;
  box-sizing: border-box;
  margin-bottom: 18px;
  outline: none;
  transition: border 0.22s, box-shadow 0.22s;
}

input:focus, select:focus {
  border-color: #36cc9d;
  box-shadow: 0 0 4px 2px #cfffee;
}

.row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  margin-bottom: 0;
}

@media (max-width: 600px) {
  .card {
    padding: 18px 8px;
    max-width: 98vw;
  }
  .row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}

.card .muted {
  font-size: 13px;
  color: #bac5cb;
  margin: 8px 0;
}

.card .sm {
  font-size: 12px;
  color: #cfcfcf;
}

button, .btn {
  background: #37c56f;
  color: #fff;
  border: none;
  border-radius: 9px;
  padding: 10px 22px;
  font-size: 1rem;
  font-weight: 600;
  margin-right: 14px;
  box-shadow: 0 2px 8px rgba(34,139,34,0.05);
  cursor: pointer;
  transition: background 0.18s, color 0.18s;
  margin-top: 8px;
}

button:hover, .btn:hover {
  background: #57e79a;
  color: #18634b;
}

input[type="checkbox"] {
  margin-right: 7px;
  accent-color: #38c57c;
}

.er {
  background: #ffe3e6;
  border: 1px solid #ef989a;
  color: #b71c3c;
  padding: 10px;
  border-radius: 9px;
  margin: 10px 0 18px 0;
}

/* Remove unintentional border or white gaps */
.card form {
  margin: 0;
}

a {
  color: #23936b;
  text-decoration: underline;
  font-size: 15px;
  margin-bottom: 4px;
}

.card .sec, .card .row_machine {
  background: none;
  border: none;
  padding: 0;
}

::-webkit-input-placeholder { color: #bac5cb;}
::-moz-placeholder { color: #bac5cb;}
:-ms-input-placeholder { color: #bac5cb;}
::placeholder { color: #bac5cb;}