/* General Styles */
body {
    font-family: Arial, sans-serif;
    margin: 20px;
    background-color: #f5f5f5;
}

.container {
    margin: 0 auto;
    /* Removed max-width here to allow flexibility */
}

.container-narrow {
    max-width: 800px;
}

.container-wide {
    max-width: 1500px;
}

h1 {
    font-size: 1.8em;
    color: #333;
}

h1 a {
    color: #0066cc;
    text-decoration: none;
    margin-left: 10px;
    font-size: 0.9em;
}

h1 a:hover {
    text-decoration: underline;
}

h2 {
    font-size: 1.5em;
    color: #333;
    margin-bottom: 10px;
}

h2 a {
    color: #0066cc;
    text-decoration: none;
    margin-left: 10px;
    font-size: 0.9em;
}

h2 a:hover {
    text-decoration: underline;
}

/* Form Styles */
.intro-text {
    font-size: 1em;
    color: #666;
    margin-bottom: 20px;
    line-height: 1.5;
}

.form-group {
    margin-bottom: 15px;
}

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

input[type="text"],
select {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
}

input[type="file"] {
    margin-top: 5px;
}

button {
    background-color: #4CAF50;
    color: white;
    padding: 10px 15px;
    border: none;
    cursor: pointer;
}

button:hover {
    background-color: #45a049;
}

/* Table Styles */
.details {
    margin-bottom: 20px;
    font-size: 1em;
    color: #666;
}

.table-wrapper {
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
    background-color: white;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

th, td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}

th {
    background-color: #b0c4de;
    color: black;
    cursor: pointer;
}

th:hover {
    background-color: #a0b4ce;
}

tr:hover {
    background-color: #f9f9f9;
}

.group {
    min-width: 100px;
}

.commodity {
    min-width: 120px;
}

.inputs {
    min-width: 150px;
}

/* Sorting Styles */
th.asc .sort-icon::after {
    content: "▲";
}
th.desc .sort-icon::after {
    content: "▼";
}
th .sort-icon::after {
    content: "▲▼";
}
th .sort-icon {
    display: inline-block;
    margin-left: 4px;
    font-size: 0.6em;
    color: #666;
}

/* New Styles for index.php */
.planet-index h1 {
    margin-bottom: 20px;
}

.planet-index .controls {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.planet-index .controls .add-planet {
    margin: 0;
}

.planet-index .controls .add-planet a {
    background-color: #4CAF50;
    color: white;
    padding: 10px 15px;
    border-radius: 4px;
    text-decoration: none;
    display: inline-block;
}

.planet-index .controls .add-planet a:hover {
    background-color: #45a049;
}

.planet-index .controls input[type="text"],
.planet-index .controls select {
    width: 200px;
    padding: 8px;
    font-size: 1em;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

.planet-index th {
    cursor: pointer;
    user-select: none;
}

.planet-index th:hover {
    background-color: #9ab8d8;
}

.planet-index a {
    color: #0066cc;
    text-decoration: none;
}

.planet-index a:hover {
    text-decoration: underline;
}

/* New Styles for deficit_analyzer.php and production_analyzer.php */
.deficit-analyzer h1 a,
.production-analyzer h1 a {
    margin-left: 10px;
    font-size: 0.9em;
}

.deficit-analyzer .controls,
.production-analyzer .controls {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.deficit-analyzer .controls select,
.production-analyzer .controls select {
    width: 200px;
    padding: 8px;
    font-size: 1em;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

.deficit-analyzer .subheading,
.production-analyzer .subheading {
    font-size: 1.2em;
    color: #333;
    margin-bottom: 10px;
    margin-top: 20px;
}

.deficit-analyzer .export-link,
.production-analyzer .export-link {
    display: inline-block;
    margin-top: 10px;
    background-color: #4CAF50;
    color: white;
    padding: 8px 12px;
    border-radius: 4px;
    text-decoration: none;
}

.deficit-analyzer .export-link:hover,
.production-analyzer .export-link:hover {
    background-color: #45a049;
}

/* Update this in styles.css */
.submit-planet {
    background-color: #4CAF50;
    color: white;
    padding: 10px 15px;
    border-radius: 4px;
    text-decoration: none;
    display: inline-block;
    border: none;
    cursor: pointer;
    font-size: 1em; /* Matches typical default body text size, adjust if needed */
}

.submit-planet:hover {
    background-color: #45a049;
}

/* New Styles for cartel_analyzer.php (Updated) */
.cartel-analyzer-container {
    max-width: 1500px; /* Matches maximum table width */
}

.cartel-controls {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.cartel-controls select {
    width: 200px;
    padding: 8px;
    font-size: 1em;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

.cartel-controls .cartel-view-toggle {
    background-color: #ddd;
    color: #333;
    padding: 8px 12px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.cartel-controls .cartel-view-toggle.cartel-view-toggle-active {
    background-color: #4CAF50; /* Green highlight like export button */
    color: white;
}

.cartel-controls .cartel-view-toggle:hover {
    background-color: #ccc;
}

.cartel-controls .cartel-view-toggle-active:hover {
    background-color: #45a049; /* Darker green on hover */
}

.cartel-subheading {
    font-size: 1.2em;
    color: #333;
    margin-bottom: 10px;
    margin-top: 20px;
}

.cartel-table-wrapper {
    position: relative;
    width: auto; /* Allow wrapper to fit content */
    max-width: 1500px; /* Limit wrapper width */
    overflow-x: auto; /* Enable horizontal scrolling */
    box-sizing: border-box; /* Ensure padding/border don’t affect width */
}

#cartelTable {
    width: auto; /* Allow table to size based on content */
    border-collapse: separate; /* Allows border spacing for visual separation */
    border-spacing: 0; /* Reset default spacing */
}

.cartel-planet-header,
.cartel-planet-cell {
    position: sticky;
    left: 0;
    background-color: #b0c4de; /* Matches th background */
    z-index: 1; /* Keeps it above scrolling content */
    width: 200px; /* Fixed width for planet column */
    min-width: 200px; /* Ensure it doesn’t shrink */
    padding: 8px; /* Consistent padding */
    text-align: left; /* Left justify */
}

.cartel-planet-cell {
    background-color: white; /* Matches td background */
    z-index: 0; /* Below header */
    padding: 8px; /* Consistent padding */
}

.cartel-commodity-header,
.cartel-commodity-cell {
    position: sticky;
    left: 0;
    background-color: #b0c4de; /* Matches th background */
    z-index: 1; /* Keeps it above scrolling content */
    width: 200px; /* Fixed width for commodity column */
    min-width: 200px; /* Ensure it doesn’t shrink */
    padding: 8px; /* Consistent padding */
    text-align: left; /* Left justify */
}

.cartel-commodity-cell {
    background-color: white; /* Matches td background */
    z-index: 0; /* Below header */
    padding: 8px; /* Consistent padding */
}

#cartelTable th:not(.cartel-planet-header):not(.cartel-commodity-header) {
    padding: 8px; /* Consistent padding */
    white-space: nowrap; /* Prevents text wrapping */
    overflow: hidden; /* Hides overflow */
    text-overflow: ellipsis; /* Adds ellipsis if content overflows */
    text-align: center; /* Center align */
}

#cartelTable td:not(.cartel-planet-cell):not(.cartel-commodity-cell) {
    padding: 8px; /* Consistent padding */
    white-space: nowrap; /* Prevents wrapping */
    overflow: hidden; /* Hides overflow */
    text-overflow: ellipsis; /* Adds ellipsis if needed */
    text-align: center; /* Center align */
}

#cartelTable th {
    cursor: pointer; /* Indicate clickable headers */
}

.sort-icon {
    display: inline-block;
    margin-left: 5px;
    font-size: 0.8em;
    vertical-align: middle;
}

/* Dynamic column width adjustment via JavaScript will set exact widths */
#cartelTable th,
#cartelTable td {
    box-sizing: border-box; /* Ensures padding doesn’t affect width */
}

/* Alternating row colors */
#cartelTable tbody tr:nth-child(even) {
    background-color: #f0f8ff; /* Light blue for even rows */
}

#cartelTable tbody tr:nth-child(odd) {
    background-color: white; /* White for odd rows */
}

.cartel-export-link {
    display: inline-block;
    margin-top: 10px;
    background-color: #4CAF50;
    color: white;
    padding: 8px 12px;
    border-radius: 4px;
    text-decoration: none;
}

.cartel-export-link:hover {
    background-color: #45a049;
}