/* SYS-SMILE base styles */
:root {
  --primary: #0d6efd;
  --bg-soft: #f8f9fa;
  --dark: #212529;
}

body {
  font-family: system-ui, -apple-system, "Segoe UI", "Noto Sans Thai", "Helvetica Neue", Arial, "Liberation Sans", sans-serif;
  background-color: #f6f7fb;
}

.container { max-width: 1100px; }

h1.h3 { font-weight: 600; }

.card { border-radius: 10px; }
.card-header { background-color: var(--bg-soft); font-weight: 500; }

.form-label { font-weight: 500; }

.btn-primary { background-color: var(--primary); border-color: var(--primary); }
.btn-outline-secondary { border-color: #ced4da; }

.table thead th { background-color: #fafafa; }
.table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0,0,0,.02); }

.text-muted { color: #6c757d !important; }

/* Footer (match index.html style) */
.footer {
  background: linear-gradient(135deg, #1f2a34 0%, #1a252f 100%);
  color: #fff;
  padding: 50px 0 30px;
  margin-top: 60px;
  clip-path: polygon(0 5%, 100% 0, 100% 100%, 0% 100%);
}
.footer h5 { margin-bottom: 20px; font-weight: 600; position: relative; padding-bottom: 10px; }
.footer h5::after { content: ''; position: absolute; bottom: 0; left: 0; width: 50px; height: 2px; background: var(--primary); }
.footer a { color: #bdc3c7; text-decoration: none; transition: color 0.3s ease; display: block; margin-bottom: 10px; }
.footer a:hover { color: #0dcaf0; padding-left: 5px; }
.social-links { display: flex; gap: 15px; margin-top: 20px; }
.social-link { width: 40px; height: 40px; background: rgba(255,255,255,0.1); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; }