/* Global reset */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
body {
  font-family: 'Montserrat', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  background: #F3F5F9;
  font-size: 11px; 
}

p, select, input, button {
  color: #2c3e50;
  font-size: 11px; 
}

h6 {
  color: #2c3e50;
  font-size: 11px;
}

h5 {
  color: #2c3e50;
  font-size: 13px;
}

h4 {
  color: #2c3e50;
  font-size: 15px;
}

h3 {
  color: #2c3e50;
  font-size: 17px;
}

h2 {
  color: #2c3e50;
  font-size: 19px;
  padding: 10px 0 10px 0;
}

h1 {
  color: #2c3e50;
  font-size: 21px;
}

input, textarea, select {
  padding: 0.5rem;
  border-radius: 4px;
  background:#f5f5f5; 
  border:1px solid #ccc;
}

/* Login Page */
.login-page {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #F3F5F9;
}
.login-card {
  background: #FFFFFF;
  border-radius: 8px;
  padding: 2rem;
  width: 360px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
  text-align: center;
}

.login-logo {
  max-width: 120px;
  margin-bottom: 1rem;
}

.login-input {
  width: 100%;
  padding: 0.75rem;
  margin-bottom: 1rem;
  border: 1px solid #CCD0D5;
  border-radius: 4px;
  background-color: #FEFCD7;
}
.login-button {
  width: 100%;
  padding: 0.75rem;
  border: none;
  border-radius: 4px;
  background-color: #4A7CDE;
  color: #FFFFFF;
  cursor: pointer;
}
.login-button:hover {
  background-color: #3B6CC2;
}

/* Register Page */
.register-page {
  height: 130vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #F3F5F9;
}

.register-card {
  background: #FFFFFF;
  border-radius: 8px;
  padding: 2rem;
  width: 500px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
  text-align: center;
}


/* Welcome Bar */
#welcome-bar    {
    background-color: #f5f5f5; padding: 5px; color: #1349a1; text-align: right;font-weight: bold;
}

#welcome-bar a {
  color: #1349a1;
  text-decoration: none;
}

/* Hover effect for links */
#welcome-bar a:hover {
  color: #a8ce34;
  text-decoration: underline;
}

#logout {
    color: #f0ad4e;
    text-decoration:none; 
}

#logout:hover {
    color: #a8ce34;
    text-decoration:underline; 
}

.error {
  background: #FFE5E5;
  color: #D32F2F;
  padding: 0.5rem;
  border-radius: 4px;
  margin-bottom: 1rem;
  /* font-size: 0.9rem;*/
  text-align: left;
}

/* Dashboard-specific styles */
.dashboard {
  display: flex;
  height: 100vh;
}
.dashboard .sidebar {
  width: 220px;
  background: #dddddd;
  display: flex;
  flex-direction: column;
  padding: 1rem 0;
}
.dashboard .sidebar .logo {
  text-align: center;
  margin-bottom: 2rem;
}
.dashboard .sidebar .logo img {
  max-width: 50px;
  display: block;
  margin: 0 auto 0.5rem;
}
.dashboard .sidebar .logo .sidebar-title {
  /*font-size: 1.25rem;*/
  font-weight: bold;
  color: #333333;
  margin: 0;
}
.dashboard .sidebar nav {
  flex: 1;
}
.dashboard .sidebar nav a {
  display: block;
  padding: 0.75rem 1rem;
  color: #333333;
  text-decoration: none;
  /*font-size: 0.95rem;*/
}
.dashboard .sidebar nav a.active,
.dashboard .sidebar nav a:hover {
  background: #16a085;
  color: #ffffff;
}
.dashboard .sidebar .signout {
  text-align: center;
  padding: 1rem;
}
.dashboard .sidebar .signout button {
  background: #007bff;
  color: #ffffff;
  border: none;
  padding: 0.5rem 1rem;
  border-radius: 4px;
  cursor: pointer;
  /*font-size: 0.9rem;*/
  transition: background 0.2s;
}
.dashboard .sidebar .signout button:hover {
  background: #0056b3;
}

.dashboard .main {
  flex: 1;
  overflow-y: auto;
  background: #ffffff;
  display: flex;
  flex-direction: column;
}
.dashboard .header-banner {
  background: #ffffff;
  padding: 1rem;
  text-align: center;
  margin-bottom: 1rem;
}

.dashboard .metrics {
  display: flex;
  gap: 1rem;
  padding: 1rem;
}
.dashboard .panel {
  flex: 1;
  padding: 1.25rem;
  border-radius: 6px;
  color: #ffffff;
  text-align: center;
}
.dashboard .panel.blue   { background: #3498db; }
.dashboard .panel.green  { background: #2ecc71; }
.dashboard .panel.red    { background: #e74c3c; }
.dashboard .panel.orange { background: #e67e22; }

.dashboard .controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 1rem 1rem;
}
.dashboard .search-group,
.dashboard .export-group {
  display: flex;
  align-items: center;
}
.dashboard .search-group h2 {
  margin-right: 1rem;
 /* font-size: 1rem;*/
  color: #2c3e50;
}
.dashboard .search-bar {
  display: flex;
  gap: 0.5rem;
}
.dashboard .search-bar input {
  padding: 0.5rem;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.dashboard .export-group button {
  margin-left: 0.5rem;
}

.dashboard .btn {
  padding: 0.6rem 1rem;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  /*font-size: 0.9rem;*/
}
.dashboard .btn-primary {
  background: #4A7CDE;
  color: #ffffff;
  text-decoration: none;
}
.dashboard .btn-primary:hover {
  background: #3B6CC2;
}
.dashboard .btn-secondary {
  background: #16a085;
  color: #ffffff;
  text-decoration: none;
}
.dashboard .btn-secondary:hover {
  background: #138d75;
}

.dashboard .table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 1rem 1rem;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.dashboard .table thead {
  background: #3498db;
  color: #ffffff;
}
.dashboard .table th,
.dashboard .table td {
  padding: 0.75rem;
  border-bottom: 1px solid #eee;
  text-align: left;
}
.dashboard .table th:first-child,
.dashboard .table td:first-child {
  width: 40px;
}

.success {
  color: #FF0000;
  padding: 0.75rem;
}

.error {
  color: #FF0000;
}

.btn-warning {
  background: #f0ad4e;
  color: white;
  border: none;
}
/*
.disabled {
  color: #999;
  pointer-events: none;
  text-decoration: none;
}*/

.link-no-style {
    color: #333333;
    text-decoration: none;
}

.registration-form { width:90%; max-width:900px; margin:1rem; }
.registration-form fieldset { border:none; padding:1rem 0; }
.registration-form legend { font-weight:bold; margin-bottom:0.5rem; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.registration-form label { display:block; margin-bottom:0.5rem; }
.registration-form input,
.registration-form textarea { 
  width:100%; padding:8px; margin-top:4px; 
  box-sizing:border-box; background:#f5f5f5; border:1px solid #ccc;
}
.registration-form input[disabled],
.registration-form textarea[disabled] {
  color:#333;
}
.btn { padding:8px 15px; text-decoration:none; display:inline-block; margin-right:10px; }
.btn-secondary { background:#ccc; color:#000; border:none; }
.doc-list { list-style:none; padding:0; }
.doc-list li { margin-bottom:0.5rem; }

.space {
    padding: 15px 0 15px 0;
}

#backToTop {
  display: none;
  position: fixed;
  bottom: 40px;
  right: 30px;
  z-index: 100;
  border: none;
  outline: none;
  background-color: #444;
  color: white;
  cursor: pointer;
  padding: 12px 16px;
  border-radius: 50%;
  font-size: 18px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}

#backToTop:hover {
  background-color: #222;
}

.footer-copyright {
    text-align:center;
    padding:5px;
}