/* Main chat panel */
.cpcs-chat-panel {
    position: fixed !important;
    right: -420px !important;
    top: 60px !important;
    height: calc(100vh - 60px) !important;
    width: 400px !important;
    background: white !important;
    border-left: 1px solid #e9ecef !important;
    transition: right 0.3s ease !important;
    overflow: hidden !important;
    z-index: 1000 !important;
    box-shadow: -2px 0 5px rgba(0,0,0,0.1) !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Open state */
.cpcs-chat-panel.open {
    right: 0 !important;
}

/* Header container */
.cpcs-header-container {
    padding: 16px !important;
    border-bottom: 1px solid #e9ecef !important;
    background: white !important;
}

.cpcs-header-content {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* Chat container */
.cpcs-chat-container {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    height: calc(100% - 60px) !important;
    overflow: hidden !important;
}

/* Messages area */
.cpcs-messages-area {
    flex: 1 !important;
    overflow-y: auto !important;
    padding: 16px !important;
    background-color: #f8f9fa !important;
    margin-bottom: 70px !important;
}

/* Input container */
.cpcs-input-container {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 70px !important;
    padding: 15px !important;
    background: white !important;
    border-top: 1px solid #E5E5E5 !important;
    display: flex !important;
    gap: 10px !important;
    align-items: center !important;
    z-index: 1001 !important;
}

/* Input field */
.cpcs-chat-input {
    flex: 1 !important;
    padding: 8px 12px !important;
    border: 1px solid #E5E5E5 !important;
    border-radius: 4px !important;
    font-size: 14px !important;
}

/* Send button */
.cpcs-send-button {
    padding: 8px 16px !important;
    background-color: #007bff !important;
    border: none !important;
    border-radius: 4px !important;
    color: white !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    height: 40px !important;
}

/* Model selector */
.cpcs-model-selector {
    display: none !important;
}

/* Inner panel wrapper */
.cpcs-chat-panel-inner {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Modal styling */
.modal {
    z-index: 1050 !important;
}

.modal-backdrop {
    z-index: 1040 !important;
} 