@tailwind base;
@tailwind components;
@tailwind utilities;

/* Animations */
@keyframes fade-in-down {
  0% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fade-out-up {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    transform: translateY(-10px);
  }
}

.animate-fade-in-down {
  animation: fade-in-down 0.3s ease-out;
}

.animate-fade-out-up {
  animation: fade-out-up 0.3s ease-out;
}

.chartkick-download-button {
  background-color: #4a90e2;
  color: white;
  border: none;
  padding: 10px 20px;
  font-size: 10px;
  border-radius: 5px;
  cursor: pointer;
}

.chartkick-download-button:hover {
  background-color: #357ABD;
}

textarea {
  resize: none !important;
}

.message.user-message {
  white-space: pre-wrap;
}


.scroll-sync-container {
  position: relative;
}

.scroll-top {
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
}

.scroll-bottom {
  overflow-x: auto;
  overflow-y: auto;
}

.scroll-top::-webkit-scrollbar {
  height: 8px;
}


/* 1. Base style for all lists (ul and ol) inside the message content */
/* This provides the Level 1 indentation and ensures markers show correctly. */
.llm-message-content ul,
.llm-message-content ol {
    /* CRITICAL: Allows nested lists to indent correctly */
    list-style-position: outside; 
    /* Base indentation for Level 1 */
    padding-left: 2em;           
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

/* Ensure ordered lists use numbers and unordered lists use discs (overriding any base reset) */
.llm-message-content ol {
    list-style-type: decimal;
}

.llm-message-content ul {
    list-style-type: disc;
}

/* 2. Style for List Items (li) */
/* Reset padding on the list items, letting the parent ul/ol handle indentation */
.llm-message-content li {
    padding-left: 0; 
    margin-top: 0.25em;
    margin-bottom: 0.25em;
}

/* 3. Indentation for Nested Lists (Level 2 and deeper) */
/* Target lists inside other lists (e.g., ul inside li inside ul) to create levels */
.llm-message-content ul ul,
.llm-message-content ol ol {
    /* This margin creates the extra visual shift for nesting */
    margin-left: 1.5em;
    padding-left: 0; 
}

/* Optional: Change markers for visual distinction at deeper levels */
.llm-message-content ul ul {
    list-style-type: circle; /* Level 2 bullet style */
}

.llm-message-content ul ul ul {
    list-style-type: square; /* Level 3 bullet style */
}
.chart-container2 {
    position: relative;
    width: 100%; 
    max-width: 1485px; 
    height: 600px; 
    margin: 0 auto;
    display: flex;
    justify-content: center;
}

.center-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.center-text .total-value {
    font-size: 28px;
    font-weight: normal;
    color: #4a4a4a;
}

.center-text .total-label {
	font-size: 22px;
	font-weight: normal;
	color: #4a4a4a;
}

.dataTables_length select{
	padding-right: 30px !important;
	padding-left: 10px !important;
}

.dataTables_length{
	margin-bottom: 30px !important;
}
/*
  
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


*/