/* Global Styles
---------------------------------------------*/

/* Prevent content overlap with fixed navbar and set default font */
body {
    overflow: hidden; /* Hide overflow for the body */
    padding-top: 64px; /* Prevent content overlap with fixed navbar */
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    font-family: 'Ubuntu Sans', sans-serif; /* Default font for the whole app */
}

/* Set the font for all headers */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Ubuntu', sans-serif;
}

/* Remove default padding */
.container-fluid {
    padding-right: 0;
}


/* Modals
---------------------------------------------*/

/* Move modals down to avoid navbar overlap */
.modal-dialog {
    margin-top: 60px;
}

/* Position elements inside the citation modal */
.citation-modal .input-download-wrapper {
    display: flex;
    align-items: center;
    gap: 25px;
}

.citation-modal #downloadCitation {
    margin-top: -13px; /* Adjust position of the download button */
}

/* Adjust the modal title position */
.modal-title {
    font-size: 24px;
}

.advanced-text-block {
    margin-top: 0px;
    margin-bottom: 30px;
}



/* Tab Content Styling
---------------------------------------------*/

/* Common styles for tab content */
.tab-content {
    margin: 0 auto; /* Center content horizontally */
    padding: 20px;  /* Add padding around the text */
}

/* Specific max-width for each tab */
.thick-tab-content {
    max-width: 1400px;
}
.skinny-boi-tab-content {
    max-width: 750px;
}



/* Sidebars and Panels
---------------------------------------------*/

/* Toggle button for the right panel */
.toggle-panel-container {
    position: relative;
}

.toggle-panel-button {
    position: absolute;
    top: 0;
    right: 10px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
}

/* Main panel padding */
.main-panel {
    padding-top: 10px; /* Add padding to the top of the center panel */
}



/* Sidebar background color */
.well {
    background-color: #d3d3d3; /* Light gray */
}

.well h3 {
    margin-top: 0; /* Reduce the top margin for headers in wellPanels */
}

/* Remove extra padding/margin from the left sidebar column */
#leftSidebarColumn .well {
    margin-left: 0;
    padding-left: 10px; /* Adjust this value as needed */
}

/* Remove extra padding or margin around the left column */
#leftSidebarColumn {
    padding-left: 0;
    margin-left: 0;
}

/* Reduce gap between main panel and right sidebar */
#rightSidebarColumn {
    padding-left: 0;
    margin-left: 0;
}

/* Common styles for sidebars and main panel */
#leftSidebarColumn,
#mainPanelColumn,
#rightSidebarColumn {
    overflow-y: auto;           /* Enable vertical scrolling */
    padding-bottom: 0; /* Ensure no padding at the bottom of the columns */
    margin: 0; /* Ensure no margin is added */
}
/* Different padding for main panel */
#mainPanelColumn {
    padding-right: 15px;
}
#leftSidebarColumn,
#rightSidebarColumn {
    padding-right: 5px;
}

/* Additional styling for smooth scrolling, optional */
#leftSidebarColumn::-webkit-scrollbar,
#mainPanelColumn::-webkit-scrollbar,
#rightSidebarColumn::-webkit-scrollbar {
    width: 8px; /* Customize scrollbar width */
}
#leftSidebarColumn::-webkit-scrollbar-thumb,
#mainPanelColumn::-webkit-scrollbar-thumb,
#rightSidebarColumn::-webkit-scrollbar-thumb {
    background-color: #888; /* Scrollbar thumb color */
    border-radius: 4px; /* Rounded corners for the scrollbar */
}
#leftSidebarColumn::-webkit-scrollbar-thumb:hover,
#mainPanelColumn::-webkit-scrollbar-thumb:hover,
#rightSidebarColumn::-webkit-scrollbar-thumb:hover {
    background-color: #555; /* Change color on hover */
}

/* Enable vertical scrolling for the specified tab contents */
.data-tab-content,
.help-tab-content,
.results-tab-content {
    overflow-y: auto; /* Allow vertical scrolling */
    height: calc(100vh - 90px);
}

/* Custom scrollbar styling for tab contents */
.data-tab-content::-webkit-scrollbar,
.help-tab-content::-webkit-scrollbar,
.results-tab-content::-webkit-scrollbar {
    width: 8px; /* Customize scrollbar width */
}

.data-tab-content::-webkit-scrollbar-thumb,
.help-tab-content::-webkit-scrollbar-thumb,
.results-tab-content::-webkit-scrollbar-thumb {
    background-color: #888; /* Scrollbar thumb color */
    border-radius: 4px; /* Rounded corners for the scrollbar */
}

.data-tab-content::-webkit-scrollbar-thumb:hover,
.help-tab-content::-webkit-scrollbar-thumb:hover,
.results-tab-content::-webkit-scrollbar-thumb:hover {
    background-color: #555; /* Change color on hover */
}

.flex-container-fit {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%; /* Full width for the container */
  margin-bottom: 10px;
}

.fit-method-wrapper {
  display: flex;
  align-items: center;
}

.conf-level-wrapper {
  margin-left: auto;
  margin-right: 10px;
}

.flex-container {
  display: flex;
  align-items: center;
  gap: 5px; 
  width: 100%;
}

.centered-checkbox {
  margin-left: auto;
  margin-right: 10px;
}

.fit-model-btn-wrapper {
  display: flex;
  align-items: center;
  margin-top: -16px; /* Center the button vertically */
}

.horizontal-radio .shiny-input-radiogroup-inline {
  display: flex;
  gap: 15px; /* Adjust the gap between radio buttons as needed */
}


/* Navbar adjustments */

/* Restore padding for the navbar */
.navbar .container-fluid {
    padding-right: 15px;
}
.navbar-fixed-top {
    margin-bottom: 0;
}
/* Increase navbar height */
.navbar {
    min-height: 70px;
    padding-top: 14px;
    padding-bottom: 8px;
}

/* Adjust navbar-brand (title/logo) alignment */
.navbar-brand img {
    max-height: 55px;
    margin-top: -15px;
    padding-left: 14px;
}

/* Ensure navbar items align properly */
.navbar-nav > li > a {
    padding-top: 20px;
    padding-bottom: 20px;
    font-size: 18px;
}

/* Make icons bigger */
.navbar-nav.navbar-right li a i {
    font-size: 21px;
}

/* Adjust spacing between buttons */
.navbar-nav.navbar-right li {
    margin-right: 12px;
}



/* Plot and Button Section
---------------------------------------------*/

/* Flex container for the plot and buttons */
.plot-container {
    display: flex;
    align-items: flex-start;
    max-width: 100%;
    min-width: 0;
}

/* Make the plot area flexible */
.plot-area {
    flex-grow: 1;
    flex-shrink: 1; 
    min-width: 0; 
}

/* Styling for the button column */
.button-column {
    width: 80px;
    padding-left: 10px;
    margin-right: 10px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* Spacing for download buttons */
.download-button {
    margin-bottom: 10px;
}

.download-button:last-child {
    margin-bottom: 0;
}


/* Remove padding from the columns */
.latex-container {
    padding-left: 15px;
    padding-right: 15px;
}

/* Center the content vertically within the column */
.latex-content {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    overflow: auto;
    word-wrap: break-word;
    font-size: calc(0.3em + 0.5vw); /* Responsive font size */
}



/* Messages and Buttons
---------------------------------------------*/

/* Error message styling */
.error-message {
    color: red;
    font-weight: bold;
}

/* Special message and button styling */
.special-message,
.fit-results-msg {
    color: #608AC8;
    font-weight: bold;
}

.fit-results-msg {
    margin-top: 6px;
    margin-bottom: 6px;
}

.special-button {
    color: white;
    background-color: #608AC8;
}

#uploadPanel div {
    margin-bottom: 0;
    padding-bottom: 0;
}


.selectize-dropdown-content {
    max-height: 420px;  /* Adjust this value as needed */
    overflow-y: auto;
}

.export-enzml-fit-results-text {
    padding-top: 10px; /* Add padding to the top */
}