/* Reset default margins and paddings */
body, html {
    margin: 0; /* Reset default margin */
    padding-bottom: 30px; /* Add space at the bottom */
    font-family: Arial, sans-serif;
}

/* Container to center everything */
.container {
    align-items: center;
    justify-content: center;
    text-align: center; /* Center text */
    margin-top: 20px;
    margin-bottom: 20px;
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
    display: grid;
    place-items: center;
    background-color: #f4f4f4;
    border-radius: 15px;
    min-width: 1200px;
}

 /* Custom styles to position the buttons in the top-right corner */
.top-right-buttons {
   padding-left: 750px;
   font-weight: bold;
   transition: background-color 0.3s ease; /* Smooth transition for hover effect */
   box-sizing: border-box;
}

.top-right-buttons a {
    margin-left: 10px;
}

/* Hover effects */
.top-right-buttons a:hover {
    color: #e6844c !important; /* Change to orange on hover */
}

/* Main title datalake */
.cap {
    color: #1a4866;
}

.list-consumer {
    color: #1a4866;
}

.list-consumer:hover {
    color:  #e6844c !important;
}

.list-box {
  width: 30%;
  max-width: 1600px; /* Maximum width of the content box */
  min-width: 1200px; /* Minimum width of the content box */
  margin-top: 10px;
  margin-bottom: 30px;
  padding: 20px;
  background-color: white;
  border: 1px solid #ddd;
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  text-align: left;
}

.custom-button {
    background-color: #1a4866;
}

.custom-button:hover {
    background-color: #e6844c;
}

.button-admin-list {
    margin-bottom: 5px;
    margin-right: 5px;
}

a {
    color: #1a4866; 
}

a:hover {
    color: #e6844c !important; /* Change to orange on hover */
}

i:hover {
    color: #e6844c !important; /* Change to orange on hover */
}

/* Style for the logo */
.logo {
    max-width: 100%;
    height: auto;
    margin-bottom: 20px; /* Space between logo and form */
}

/* Style for the login form */
.login-form {
    width: 300px; /* Set a fixed width for the form */
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #e6844c;
}

/* Style for form elements */
.input-group {
    margin-bottom: 15px;
}

.input-group label {
    display: block;
    margin-bottom: 5px;
}

.input-group input {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* icon prefix focus color */
.input-field .prefix.active {
 color: #e6844c;
}

input:focus {
    border-bottom: 1px solid #e6844c !important;
    box-shadow: 0 1px 0 0 #e6844c !important;
}

label.active {
    color: #1a4866 !important;
}

.select-dropdown {
    background-color: white !important; /* Change this to your custom color */
    color: black !important;
}

/* Customizing the dropdown options */
.dropdown-content li>a, .dropdown-content li>span {
    color: black !important; /* Text color for options */
}

/* Customizing the selected item background color */
.dropdown-content li.selected {
    background-color: #1a4866 !important; /* Change this to your custom color */
}

/* Changing the border color of the input */
.input-field input[type=text].select-dropdown {
    border-bottom: 1px solid #e6844c !important;
    box-shadow: 0 1px 0 0 #e6844c !important;
}

/* Customizing the focus color of the select dropdown */
.input-field input[type=text].select-dropdown:focus {
    border-bottom: 1px solid #e6844c !important;
    box-shadow: 0 1px 0 0 #e6844c !important;
}

textarea.materialize-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #e6844c !important;
    box-shadow: 0 1px 0 0 #e6844c !important;
}

.modal-content {
    text-align: justify;
}

.report-headers {
    font-size: 1.5em; /* Matches the font size of an h2 */
    font-weight: bold; /* Matches the font weight of an h2 */
}

/* table */
table {
    width: 100%;
    border-collapse: collapse;
}
th, td {
    padding: 8px;
    text-align: left;
    border: 1px solid #ddd;
    min-width: 128px; /* Set a fixed width */
    word-wrap: break-word; /* Breaks long words */
    word-break: break-word; /* Breaks long words */
    white-space: normal; /* Ensures text wrapping */
}
th {
    background-color:chocolate;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6); /* Shadow effect */
    border: 2px solid #cc733f; /* Slightly darker border */
    text-transform: uppercase;
    color: #1a4866;
}
/* Default row color */
tr {
    transition: background-color 0.3s ease; /* Smooth transition */
}
/* Hover effect */
tr.hover-effect {
    background-color: #f0f0f0; /* Light gray background */
}

#hidelist {
    display: none;
}

#symbol {
    height: 140px;
    width: 140px;
    transition: transform 0.3s ease;
}

#symbol:hover {
    transform: translate(0px, 2px);	
}

/* avoiding overflow right */
.box-list {
    overflow-x: auto; /* Adds a horizontal scrollbar if needed */
    width: 100%; /* Ensures the container doesn't exceed the parent's width */ 
}

table {
    width: 100%; 
}

/* Italic style for a specific class */
.italic {
    font-style: italic;
}

.bold {
    font-weight: bold;
}

.message-box {
    color: #1a4866;
    font-weight: bold;
    background-color: #ffcccc; /* Light red */
    border-radius: 5px;
    padding: 16px;
    margin: 12px;
    max-width: 1200px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.version-info {
    font-weight: bold;
    font-size: 9px;
    color: #1a4866;;
}

.hash {
    font-family: monospace;
    font-size: 0.85em;       /* slightly smaller than normal text */
    color: #586069;    
    cursor: pointer; /* cursor to indicate a tooltip */
    user-select: all;
}

.hash:hover::after {
    display: inline;
}