body{margin:0;font-family:Arial,sans-serif;background-color:#f5f5f5}header{background-color:#036;color:#fff;padding:15px 30px;display:flex;align-items:center;justify-content:space-between}header img{height:40px;margin-right:15px}header h1{font-size:20px;margin:0}.dashboard{padding:30px}button{background-color:#036;color:#fff;padding:10px 20px;margin-right:10px;border:none;border-radius:5px;cursor:pointer}button.logout{background-color:#900}.login-container{display:flex;justify-content:center;align-items:center;height:100vh;background-color:#f5f5f5}.login-box{background:#fff;padding:40px;border-radius:10px;box-shadow:0 4px 10px #0003;text-align:center;width:350px}.login-logo{height:60px;margin-bottom:15px}.login-title{margin:0;font-size:22px;color:#036}.login-subtitle{margin:5px 0 20px;font-size:14px;color:#666}.form-group{margin-bottom:15px;text-align:left}.form-group label{display:block;font-size:14px;margin-bottom:5px;color:#036}.form-group input{width:100%;padding:8px;border:1px solid #ccc;border-radius:5px}.login-button{width:100%;padding:10px;background-color:#036;color:#fff;border:none;border-radius:5px;cursor:pointer}.login-button:hover{background-color:#05a}.dashboard-container{display:flex;min-height:100vh}.sidebar{background-color:#036;color:#fff;width:240px;padding:20px}.sidebar h2{margin-bottom:20px;font-size:18px;border-bottom:1px solid #0055aa;padding-bottom:10px}.sidebar ul{list-style:none;padding:0;margin:0}.sidebar>ul>li>div{padding:10px;background-color:#036;color:#fff;border-radius:5px;cursor:pointer;margin-bottom:5px;font-weight:700;display:flex;justify-content:space-between;align-items:center}.sidebar>ul>li>div:hover{background-color:#05a}.submenu{list-style:none;margin:5px 0 10px 15px;padding:0}.submenu li{background-color:#f0f0f0;padding:8px;margin-bottom:6px;border-radius:4px;cursor:pointer;color:#036}.submenu li:hover{background-color:#e0e0e0}.submenu a{color:#036;text-decoration:none}.submenu a:hover{text-decoration:underline}.main-content{flex:1;padding:20px;background-color:#f5f5f5}.header{background-color:#036;color:#fff;padding:15px;display:flex;align-items:center;justify-content:space-between}.header img{height:40px;margin-right:15px}@media(max-width:768px){.dashboard-container{flex-direction:column}.sidebar{width:100%}.sidebar ul{display:flex;flex-wrap:wrap;justify-content:space-around}.sidebar>ul>li>div{flex:1;text-align:center;justify-content:center}}