/* General Styling */
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: #f4f7f6; margin: 0; color: #333; }
.container { max-width: 960px; margin: 20px auto; padding: 20px; background-color: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
.container-fluid { width: 95%; margin: 20px auto; padding: 20px; background-color: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }

/* Header and Navigation */
header { border-bottom: 2px solid #eee; padding-bottom: 15px; margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center; }
header h1 { margin: 0; color: #0056b3; }
nav a { margin-left: 15px; text-decoration: none; color: #007bff; font-weight: 500; transition: color 0.3s; }
nav a:hover { color: #0056b3; }
nav a.logout { color: #dc3545; }

/* Login Container */
.login-container { max-width: 400px; margin: 100px auto; padding: 30px; background-color: #fff; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); text-align: center; }
.login-container h2 { margin-bottom: 20px; }
.login-container input { width: 100%; padding: 12px; margin-bottom: 15px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; }
.login-container button { width: 100%; padding: 12px; background-color: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 16px; }
.login-container button:hover { background-color: #0056b3; }

/* Forms */
form { margin-bottom: 20px; }
form.filter-form { background-color: #e9ecef; padding: 15px; border-radius: 5px; display: flex; align-items: center; gap: 10px; }
form label { font-weight: bold; }
input[type="text"], input[type="time"], select { padding: 8px; border: 1px solid #ccc; border-radius: 4px; width: 250px; }
button[type="submit"] { padding: 8px 15px; background-color: #28a745; color: white; border: none; border-radius: 4px; cursor: pointer; }
button[type="submit"]:hover { background-color: #218838; }
.crud-form { border: 1px solid #ddd; padding: 20px; border-radius: 5px; margin-bottom: 20px; }

/* Tables */
table { width: 100%; border-collapse: collapse; margin-top: 10px; }
th, td { padding: 12px; border: 1px solid #ddd; text-align: left; }
thead { background-color: #007bff; color: white; }
tbody tr:nth-child(even) { background-color: #f2f2f2; }
tbody tr:hover { background-color: #e9ecef; }
td a { text-decoration: none; margin-right: 10px; }
td a.edit { color: #ffc107; }
td a.delete { color: #dc3545; }

/* Schedule Grid */
.schedule-grid-user, .schedule-grid-admin { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
.day-column { border: 1px solid #ddd; border-radius: 5px; padding: 10px; background-color: #fafafa; }
.day-column h3 { text-align: center; margin-top: 0; background-color: #343a40; color: white; padding: 10px; border-radius: 5px 5px 0 0; }
.table-wrapper { max-height: 400px; overflow-y: auto; }
.schedule-title { text-align: center; color: #0056b3; }

/* Admin Schedule Input */
.schedule-grid-admin table select { width: 100%; padding: 5px; border-radius: 3px; }

/* Messages */
.error { color: #dc3545; background-color: #f8d7da; padding: 10px; border: 1px solid #f5c6cb; border-radius: 4px; margin-bottom: 15px; }
.success { color: #155724; background-color: #d4edda; padding: 10px; border: 1px solid #c3e6cb; border-radius: 4px; margin-bottom: 15px; }
.info-text { text-align: center; font-size: 1.1em; color: #666; margin-top: 40px; }

/* Welcome User */
.welcome-user { font-weight: bold; color: #555; }