#upgrade-weapon-layout {
    display: flex; /* Keep layout */
    flex-direction: column; /* Keep layout */
    height: calc(100vh - 5rem); /* Keep height */
    padding: 1.5rem; /* Keep padding */
    background-color: var(--clay-darkest); /* Use theme variable */
    color: var(--clay-text-primary); /* Use theme variable */
    gap: 1.5rem; /* Keep spacing */
}

#upgrade-weapon-header {
    display: flex; /* Keep layout */
    align-items: center; /* Keep layout */
    gap: 1.5rem; /* Keep spacing */
    flex-shrink: 0; /* Keep layout */
    padding-bottom: 1rem; /* Add padding */
    border-bottom: 1px solid var(--clay-border); /* Add divider */
}

.view-title {
    font-size: 1.5rem; /* Adjusted size */
    font-weight: 600; /* Adjusted weight */
    color: var(--clay-text-primary); /* Ensure color */
    margin: 0;
}

#upgrade-weapon-content {
    display: grid; /* Keep layout */
    grid-template-columns: 1fr 1fr; /* Keep layout */
    gap: 1.5rem; /* Keep spacing */
    flex-grow: 1; /* Keep layout */
    overflow: hidden; /* Keep layout */
}

#upgrade-weapon-list-column {
    background: var(--gradient-surface); /* Use theme variable */
    border: 1px solid var(--clay-border); /* Use theme variable */
    border-radius: 0.75rem; /* Adjusted rounding */
    box-shadow: var(--clay-shadow); /* Use theme variable */
    overflow-y: auto; /* Keep layout */
    padding: 1rem; /* Keep padding */
    display: grid; /* Keep layout */
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr)); /* Keep layout */
    gap: 0.75rem; /* Adjusted gap */
    align-content: start; /* Keep layout */
}

#upgrade-weapon-details-column {
    background: var(--gradient-surface); /* Use theme variable */
    border: 1px solid var(--clay-border); /* Use theme variable */
    border-radius: 0.75rem; /* Adjusted rounding */
    box-shadow: var(--clay-shadow); /* Use theme variable */
    overflow-y: auto; /* Keep layout */
    padding: 1.5rem; /* Keep padding */
    display: flex; /* Keep layout */
    flex-direction: column; /* Keep layout */
    color: var(--clay-text-primary); /* Ensure text color */
}


/* --- Shared styles from blacksmith-ui.css for consistency --- */
/* Copied and adjusted for theme */
.weapon-details-content { display: flex; flex-direction: column; height: 100%; }
.weapon-header { display: flex; align-items: center; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--clay-border); margin-bottom: 1rem;}
.weapon-detail-image { width: 80px; height: 80px; object-fit: contain; background-color: var(--clay-dark); border-radius: 0.5rem; padding: 0.5rem; flex-shrink: 0; border: 1px solid var(--clay-border); }
.weapon-title h3 { font-size: 1.25rem; font-weight: 600; margin: 0 0 0.5rem 0; color: var(--clay-text-primary); }
.weapon-base-attack { display: flex; align-items: center; gap: 0.5rem; background-color: var(--clay-dark); color: var(--clay-text-primary); padding: 0.4rem 0.8rem; border-radius: 0.375rem; width: fit-content; border: 1px solid var(--clay-border);}
.weapon-base-attack .label { font-weight: 500; font-size: 0.8rem; color: var(--clay-text-secondary);}
.weapon-base-attack .value { font-size: 1rem; font-weight: 700; font-family: monospace;}
.weapon-body { flex-grow: 1; overflow-y: auto; padding-top: 1rem; padding-right: 0.5rem; }
.details-section { margin-bottom: 1rem; }
.details-section h4 { font-size: 1rem; font-weight: 600; margin-bottom: 0.75rem; color: var(--clay-text-tertiary); border-bottom: 1px solid var(--clay-border); padding-bottom: 0.3rem;}
.cost-grid { display: grid; gap: 0.5rem; }
.cost-item { display: flex; align-items: center; background-color: var(--clay-dark); padding: 0.4rem 0.6rem; border-radius: 0.375rem; border: 1px solid var(--clay-border); }
.cost-item img { width: 20px; height: 20px; margin-right: 0.5rem; }
.cost-item .label { font-weight: 500; color: var(--clay-text-secondary); flex-grow: 1; font-size: 0.8rem;}
.cost-item .value { font-weight: 600; color: var(--clay-text-primary); font-size: 0.8rem; font-family: monospace;}
.cost-item .value.insufficient { color: var(--clay-error); } /* Style for insufficient */
.weapon-footer { padding-top: 1rem; margin-top: auto; border-top: 1px solid var(--clay-border); }

.upgrade-button {
    /* Styles handled by theme */
    width: 100%; /* Keep layout */
    padding: 0.75rem; /* Keep padding */
    font-size: 1rem; /* Adjusted size */
    font-weight: 600; /* Keep weight */
}
.upgrade-button:disabled { /* Styles handled by theme */ }


.weapon-details-content .upgrade-arrow {
    font-size: 1.25rem; /* Adjusted size */
    margin: 0 0.5rem; /* Keep spacing */
    color: var(--clay-text-muted); /* Use theme variable */
}

.weapon-details-content .upgraded {
    color: var(--clay-success); /* Use theme variable */
    font-weight: 700; /* Make upgraded value bold */
}

.back-button { /* Styles handled by theme */ }

/* Reusing crafting grid item style */
.crafting-grid-item {
    aspect-ratio: 1 / 1; /* Keep layout */
    padding: 0.5rem; /* Keep padding */
    border-radius: 0.5rem; /* Adjusted rounding */
    cursor: pointer; /* Keep interaction */
    transition: all 0.2s; /* Keep transition */
    border: 1px solid var(--clay-border); /* Use theme variable */
    background-color: var(--clay-dark); /* Use theme variable */
    display: flex; /* Keep layout */
    align-items: center; /* Keep layout */
    justify-content: center; /* Keep layout */
}

/* REMOVED HOVER EFFECT FOR CRAFTING GRID ITEM
.crafting-grid-item:hover {
    background-color: var(--clay-medium);
    transform: scale(1.05);
    border-color: var(--clay-border-light);
} */

.crafting-grid-item.selected {
    background-color: var(--clay-medium); /* Use theme variable */
    border-color: var(--clay-focus); /* Use theme variable */
    transform: scale(1.03); /* Adjusted scale */
    box-shadow: 0 0 10px var(--clay-glow); /* Use theme variable */
}

.crafting-grid-item img {
    width: 100%; /* Keep layout */
    height: 100%; /* Keep layout */
    object-fit: contain; /* Keep layout */
}
/* Stat grid */
.stats-grid { display: grid; gap: 0.5rem; }
.stat-item { /* Styles handled by theme */ }