/* Spreadsheet Stars Display Fix */

/* Ensure want-level containers in spreadsheet are visible */
.spreadsheet-table .want-level,
table .want-level {
    min-height: 24px;
    min-width: 80px;
    display: inline-block;
}

/* Style for star displays in spreadsheet */
.spreadsheet-table .star-display,
table .star-display {
    color: #ffd700;
    font-size: 16px;
    letter-spacing: 2px;
}

/* Ensure stars are visible in Want Level column */
.spreadsheet-table td:nth-child(4),
table td:nth-child(4) {
    min-width: 100px;
}

/* Want level cell styling */
.want-level-cell {
    text-align: left;
    vertical-align: middle;
}

.want-level-cell .want-level {
    display: inline-block;
    min-height: 20px;
}

/* Owned indicator */
.want-level-cell .owned-indicator {
    color: #666;
    font-size: 14px;
}

/* Interactive stars in spreadsheet */
.spreadsheet-star-rating {
    display: inline-flex;
    gap: 2px;
}

.spreadsheet-star-rating .clickable-star {
    color: #ccc;
    cursor: pointer;
    font-size: 16px;
    transition: color 0.2s;
}

.spreadsheet-star-rating .clickable-star.filled {
    color: #ffd700;
}

.spreadsheet-star-rating .clickable-star:hover {
    color: #ffed4e;
}

/* Debug styles to make want-level containers visible */
.debug-mode .want-level {
    border: 2px dashed red !important;
    background: rgba(255, 0, 0, 0.1) !important;
    padding: 4px !important;
}

/* Ensure table cells don't collapse */
.spreadsheet-table td,
table td {
    padding: 8px;
    white-space: nowrap;
}

/* Force visibility of star content */
.spreadsheet-table .want-level:not(:empty),
table .want-level:not(:empty) {
    visibility: visible !important;
    opacity: 1 !important;
    display: inline-block !important;
}