static/style.css

/* GENERAL STYLING */
body { font-family: sans-serif; background: #eceff1; margin: 0; padding: 10px; }
.tab-container { display: flex; background: #263238; border-radius: 5px; padding: 5px; margin-bottom: 10px; }
.tab-link { flex: 1; background: none; border: none; color: white; padding: 15px; cursor: pointer; }
.tab-link.active { background: #37474f; border-bottom: 3px solid #00e5ff; font-weight: bold; }
.tab-content { background: white; padding: 20px; border-radius: 5px; display: none; min-height: 600px; box-shadow: 0 2px 5px rgba(0,0,0,0.2); }

/* CHAT INTERFACE */
.scroll-area { background: #fdfdfd; border: 1px solid #ddd; border-radius: 5px; overflow-y: auto; display: flex; flex-direction: column; padding: 10px; }
.user-bubble { background: #e3f2fd; align-self: flex-end; padding: 10px; border-radius: 10px; margin: 5px; border: 1px solid #bbdefb; max-width: 80%; }
.ai-bubble { background: #f5f5f5; align-self: flex-start; padding: 10px; border-radius: 10px; margin: 5px; border: 1px solid #e0e0e0; max-width: 80%; }
.emergency-btn { background: #d32f2f; color: white; border: none; padding: 15px 30px; border-radius: 5px; cursor: pointer; font-weight: bold; }
.emergency-btn:disabled { background: #9e9e9e; }

/* INVENTORY & CREW */
table { width: 100%; border-collapse: collapse; margin-top: 20px; }
th, td { border: 1px solid #ddd; padding: 12px; text-align: left; }
th { background: #f1f1f1; }
.form-group { display: flex; flex-direction: column; gap: 10px; max-width: 500px; margin-bottom: 20px; }
textarea { height: 100px; padding: 10px; }
input[type="text"] { padding: 10px; }
.card { border-left: 5px solid #00e5ff; background: #f9f9f9; padding: 10px; margin: 10px 0; }