#chatbot-container {
    /* --- Core Positioning --- */
    position: fixed;   /* Position relative to the viewport */
    /* left, top, bottom, right are now controlled by JS */
    z-index: 1050;     /* Ensure it's on top */
  
    /* --- Sizing --- */
    width: 360px;
    max-height: 80vh;
    min-height: 200px;
  
    /* --- Appearance (Updated) --- */
    background-color: #e7f1ff; /* Light blue background - kept for now */
    border: 1px solid #b8d6ff; /* Border to match blue - kept for now */
    border-radius: 10px; /* Increased rounding */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Added subtle shadow */
  
    /* --- Internal Layout (Flexbox) --- */
    display: flex;
    flex-direction: column;
    font-size: 0.9rem;
    overflow: hidden;
  }
  /* Header Styling (Updated) */
  #chatbot-header {
    padding: 10px 15px;      /* Adjusted padding */
    background-color: #002245;  /* Match navbar color */
    color: white;               /* White text */
    border-bottom: 1px solid #dee2e6; /* Separator line - kept for now */
    border-top-left-radius: 10px;  /* Match container rounding */
    border-top-right-radius: 10px; /* Match container rounding */
  
    /* --- Flexbox for Title and Close Button --- */
    display: flex;              /* Use flexbox */
    justify-content: space-between; /* Title left, button right */
    align-items: center;        /* Vertically center items */
    flex-shrink: 0;             /* Prevent header from shrinking */
  }
  #chatbot-header span { /* Target the title span specifically */
     font-weight: bold;
  }

  /* Style for the image icon in the header */
  .chatbot-header-icon {
    height: 40px; /* Increased height */
    width: auto; /* Maintain aspect ratio */
    margin-right: 8px; /* Space between icon and text */
    vertical-align: middle; /* Align icon nicely with text */
  }

  /* Close Button Styling (Updated) */
  #chatbot-close-button {
    background: none;
    border: none;
    font-size: 1.5em;   /* Adjusted size */
    font-weight: normal; /* Removed bold */
    line-height: 1;     /* Prevent extra spacing */
    color: white;       /* White color */
    cursor: pointer;
    padding: 0 0.25rem; /* Keep slight padding */
    margin: 0;          /* Reset margin */
  }
  #chatbot-close-button:hover {
    color: #adb5bd; /* Lighten on hover */
  }
  
  /* Body (contains history and input area) */
  #chatbot-body {
    flex-grow: 1;          /* Takes up remaining vertical space */
    display: flex;
    flex-direction: column;
    min-height: 0;         /* Important for flex-grow to work correctly */
  }
  
  /* Chat History Area */
  #chatbot-history {
    flex-grow: 1;          /* Takes available space */
    overflow-y: auto;      /* Scrollbar if needed */
    padding: 10px;
    background-color: #ffffff; /* White background */
    border-bottom: 1px solid #dee2e6;
    word-wrap: break-word; /* Wrap long lines */
  }
  
  #chatbot-input-area {
    padding: 10px;
    background-color: #e7f1ff; /* Light blue background */
    flex-shrink: 0;
    border-top: 1px solid #b8d6ff; /* Match border */
  }
  
  #chatbot-form {
    display: flex;
    margin-bottom: 5px;
  }
  
  #chatbot-input {
    flex-grow: 1;
    padding: 8px;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    font-size: 0.9rem;
  }
  
  #chatbot-submit {
    margin-left: 5px;
    padding: 8px 12px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
  }
  #chatbot-submit:hover {
    background-color: #0056b3;
  }
  #chatbot-submit:disabled {
    background-color: #6c757d;
    cursor: not-allowed;
  }
  
  /* Status/Error Messages */
  #chatbot-status, #chatbot-error {
    font-size: 0.8em;
    margin-top: 5px;
    display: none; /* Hidden by default */
  }
  #chatbot-status { color: #6c757d; }
  #chatbot-error { color: #dc3545; } /* Danger red */
  
  /* Clear Button */
  #chatbot-clear {
    margin-top: 5px;
    font-size: 0.8em;
    padding: 3px 6px;
    cursor: pointer;
    background-color: #6c757d;
    color: white;
    border: none;
    border-radius: 0.2rem;
    float: right; /* Position clear button to the right */
  }
  #chatbot-clear:hover {
    background-color: #5a6268;
  }
  
  /* Chat Message Styles (Unchanged - for Phase 2) */
  .chatbot-message { padding: 8px 12px; border-radius: 0.5rem; margin-bottom: 8px; max-width: 85%; word-wrap: break-word; line-height: 1.4; }
  .user-message { background-color: #007bff; color: white; margin-left: auto; border-bottom-right-radius: 0; }
  .ai-message { background-color: #e9ecef; color: #212529; margin-right: auto; border-bottom-left-radius: 0; }
  .thinking-message { font-style: italic; color: #6c757d; margin-right: auto; background-color: #e9ecef; padding: 8px 12px; border-radius: 0.5rem; margin-bottom: 8px; }
  
  /* Minimize Button Styling */
  #chatbot-minimize-button {
    background: none;
    border: none;
    font-size: 1.2em; /* Slightly smaller than close */
    line-height: 1;
    color: white;
    cursor: pointer;
    padding: 0 0.5rem; /* Add some padding */
    margin: 0;
    vertical-align: middle; /* Align with close button */
  }
  #chatbot-minimize-button:hover {
    color: #adb5bd; /* Lighten on hover */
  }

  /* Styling for Minimized State */
  #chatbot-container.minimized #chatbot-body {
    display: none; /* Hide the body */
  }

  #chatbot-container.minimized {
    min-height: 0; /* Allow shrinking */
    height: auto; /* Adjust height to content (header only) */
  }