/* 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; }