/* Minimalist Inventory UI - Dark Mode */
:root { /* Remove this block if vars are only in clay-theme.css */
    /* Keep only layout-specific variables if needed, */
    /* otherwise remove if all colors come from clay-theme.css */
}

#inventory-view { /* Changed from body selector */
    background: var(--clay-darkest); /* Use theme variable */
    min-height: calc(100vh - 5rem); /* Adjust height */
    font-family: 'Inter', sans-serif; /* Consistent font */
    padding: 1.5rem; /* Add padding */
    box-sizing: border-box;
    display: flex; /* Use flex for layout */
    flex-direction: column; /* Stack vertically */
}

#inventory-layout {
    /* Removed max-width, margin, padding as handled by #inventory-view */
    display: flex; /* Keep layout */
    flex-direction: column; /* Keep layout */
    flex-grow: 1; /* Allow content to fill space */
    overflow: hidden; /* Prevent main layout scroll */
}

#inventory-tabs {
    display: flex; /* Keep layout */
    gap: 0.5rem; /* Keep spacing */
    margin-bottom: 1.5rem; /* Adjusted margin */
    background: var(--clay-dark); /* Use theme variable */
    border: 1px solid var(--clay-border); /* Use theme variable */
    border-radius: 0.5rem; /* Adjusted rounding */
    padding: 0.5rem; /* Keep padding */
    box-shadow: var(--clay-shadow); /* Use theme variable */
    flex-shrink: 0; /* Prevent shrinking */
}

.inventory-tab-btn {
    /* Styles handled by clay-theme.css */
    padding: 0.6rem 1.2rem; /* Adjusted padding */
    font-size: 0.85rem; /* Adjusted size */
}
.inventory-tab-btn.active {
    color: var(--clay-secondary); /* Use theme variable */
    background: var(--clay-darker); /* Use theme variable */
    border-bottom: 2px solid var(--clay-secondary); /* Use theme variable */
    font-weight: 600; /* Keep weight */
}
.inventory-tab-btn.active::after { /* Removed underline effect */
    content: none;
}

#weapon-filters-container {
    display: flex; /* Keep layout */
    gap: 1rem; /* Keep spacing */
    margin-bottom: 1.5rem; /* Adjusted margin */
    align-items: center; /* Keep layout */
    flex-wrap: wrap; /* Keep layout */
    background: var(--clay-dark); /* Use theme variable */
    padding: 1rem; /* Keep padding */
    border-radius: 0.5rem; /* Adjusted rounding */
    box-shadow: var(--clay-shadow); /* Use theme variable */
    border: 1px solid var(--clay-border); /* Use theme variable */
    flex-shrink: 0; /* Prevent shrinking */
}

#weapon-filters-container select,
#weapon-filters-container button {
    /* Styles handled by clay-theme.css */
    padding: 0.5rem 0.8rem; /* Adjusted padding */
    font-size: 0.8rem; /* Adjusted size */
}

/* REMOVED HOVER EFFECT FOR FILTERS/BUTTONS
#weapon-filters-container select:hover,
#weapon-filters-container button:hover {
    border-color: var(--clay-focus);
    background: var(--clay-medium);
} */
#weapon-filters-container select:focus,
#weapon-filters-container button:focus {
     border-color: var(--clay-focus); /* Use theme variable */
     box-shadow: 0 0 0 2px var(--clay-glow); /* Use theme variable */
}

#inventory-grid-container {
    flex: 1; /* Keep layout */
    overflow-y: auto; /* Keep layout */
    padding-right: 0.5rem; /* Keep padding */
    /* Add subtle background for scroll area */
    background-color: var(--clay-darker);
    border-radius: 0.5rem;
    border: 1px solid var(--clay-border);
    padding: 1rem; /* Add padding inside scroll container */
}

.inventory-grid {
    display: grid; /* Keep layout */
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); /* Adjusted min size */
    gap: 1rem; /* Adjusted gap */
}

.inventory-grid.dense {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); /* Adjusted min size */
    gap: 0.75rem; /* Adjusted gap */
}

.inventory-item-card {
    background: var(--gradient-surface); /* Use theme variable */
    border: 1px solid var(--clay-border); /* Use theme variable */
    border-radius: 0.5rem; /* Adjusted rounding */
    padding: 1rem; /* Adjusted padding */
    display: flex; /* Keep layout */
    flex-direction: column; /* Keep layout */
    align-items: center; /* Keep layout */
    text-align: center; /* Keep layout */
    transition: all 0.2s ease; /* Keep transition */
    box-shadow: var(--clay-shadow); /* Use theme variable */
    position: relative; /* Keep layout */
    overflow: hidden; /* Keep layout */
}

/* REMOVED HOVER EFFECT FOR INVENTORY ITEM CARD
.inventory-item-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--clay-shadow-heavy);
    border-color: var(--clay-border-light);
} */

.inventory-item-card::before { /* Remove top gradient line effect */
    content: none;
}

.inventory-item-image {
    width: 50px; /* Adjusted size */
    height: 50px; /* Adjusted size */
    object-fit: contain; /* Keep layout */
    margin-bottom: 0.75rem; /* Adjusted margin */
    border-radius: 0.375rem; /* Adjusted rounding */
    background: var(--clay-dark); /* Use theme variable */
    padding: 0.3rem; /* Adjusted padding */
    border: 1px solid var(--clay-border); /* Use theme variable */
}

.inventory-item-name {
    font-weight: 500; /* Adjusted weight */
    font-size: 0.8rem; /* Adjusted size */
    color: var(--clay-text-primary); /* Use theme variable */
    margin-bottom: 0.25rem; /* Adjusted margin */
}

.inventory-item-type { /* Removed, redundant for dense view */
    display: none;
}

.inventory-item-quantity {
    font-family: monospace; /* Keep font */
    font-size: 1rem; /* Adjusted size */
    color: var(--clay-secondary); /* Use theme variable */
    font-weight: 600; /* Adjusted weight */
}

/* Weapon and Armor Cards */
.weapon-card, .armor-card {
    align-items: stretch; /* Keep layout */
    text-align: left; /* Keep layout */
    padding: 1rem; /* Adjusted padding */
}

.weapon-card .inventory-item-name,
.armor-card .inventory-item-name {
    text-align: center; /* Keep layout */
    font-size: 1rem; /* Adjusted size */
    font-weight: 600; /* Keep weight */
    margin-bottom: 0.75rem; /* Adjusted margin */
}

.weapon-card .inventory-item-image,
.armor-card .inventory-item-image {
    width: 60px; /* Adjusted size */
    height: 60px; /* Adjusted size */
    align-self: center; /* Keep layout */
    margin-bottom: 0.75rem; /* Adjusted margin */
}

.weapon-card-attack,
.armor-card-value {
    text-align: center; /* Keep layout */
    font-weight: 600; /* Adjusted weight */
    font-size: 1rem; /* Adjusted size */
    margin-bottom: 0.75rem; /* Adjusted margin */
    padding: 0.3rem 0.6rem; /* Add padding */
    border-radius: 0.375rem; /* Add rounding */
    border: 1px solid var(--clay-border); /* Add border */
}

.weapon-card-attack { background-color: var(--clay-dark); color: var(--clay-error); } /* Use theme variables */
.armor-card-value { background-color: var(--clay-dark); color: var(--clay-secondary); } /* Use theme variables */

.weapon-card-stats,
.armor-card-stats {
    font-size: 0.75rem; /* Adjusted size */
    margin-bottom: 1rem; /* Adjusted margin */
    display: flex; /* Keep layout */
    flex-direction: column; /* Keep layout */
    gap: 0.3rem; /* Adjusted gap */
}

.weapon-card-stat,
.armor-card-stat {
    display: flex; /* Keep layout */
    justify-content: space-between; /* Keep layout */
    align-items: center; /* Keep layout */
    padding: 0.4rem 0.6rem; /* Adjusted padding */
    background: var(--clay-dark); /* Use theme variable */
    border-radius: 0.25rem; /* Adjusted rounding */
    border: 1px solid var(--clay-border); /* Use theme variable */
}

.weapon-card-stat .stat-label,
.armor-card-stat .stat-label {
    /* Styles handled by theme */
}

.weapon-card-stat .stat-value,
.armor-card-stat .stat-value {
     /* Styles handled by theme */
}

.armor-card-skill-list {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    width: 100%;
    margin-top: 0.5rem;
}

.armor-card-skill {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.35rem 0.55rem;
    background: rgba(248, 187, 208, 0.08);
    border: 1px solid rgba(248, 187, 208, 0.4);
    border-radius: 0.25rem;
    color: #f8bbd0;
    font-size: 0.75rem;
    text-transform: none;
}

.armor-card-skill .skill-label {
    font-weight: 600;
}

.armor-card-skill .skill-value {
    font-weight: 700;
}

.weapon-card-actions,
.armor-card-actions {
    display: flex; /* Keep layout */
    gap: 0.5rem; /* Adjusted gap */
    margin-top: auto; /* Push actions to bottom */
}

.weapon-card-actions button,
.armor-card-actions button {
    flex: 1; /* Keep layout */
    padding: 0.5rem; /* Adjusted padding */
    font-size: 0.75rem; /* Adjusted size */
    /* Other button styles handled by theme */
}

.equip-btn { /* Specific styles if needed */ }
.equip-btn:disabled { /* Specific styles if needed */ }
.discard-btn { /* Specific styles if needed */ }

.weapon-card.equipped,
.armor-card.equipped {
    border-color: var(--clay-focus); /* Use theme variable */
    box-shadow: 0 0 10px var(--clay-glow), inset 0 0 10px rgba(136, 136, 136, 0.05); /* Use theme variable */
}

.weapon-card.equipped::after,
.armor-card.equipped::after {
    /* Badge styles handled by theme */
    top: 0.5rem; /* Adjusted position */
    right: 0.5rem; /* Adjusted position */
    font-size: 0.65rem; /* Adjusted size */
    padding: 0.15rem 0.5rem; /* Adjusted padding */
}

.hidden { display: none !important; } /* Keep utility */

/* Scrollbar styling inherits from theme */

/* Responsive design adjustments */
@media (max-width: 768px) {
    #inventory-view { padding: 1rem; } /* Reduce padding */
    .inventory-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; } /* Adjust grid */
    .inventory-grid.dense { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); } /* Adjust dense grid */
    #weapon-filters-container { flex-direction: column; align-items: stretch; } /* Stack filters */
    #weapon-filters-container select, #weapon-filters-container button { width: 100%; } /* Full width filters */
}

/* Sell Crop Modal */
#sell-crop-modal-overlay { /* Inherits from main.css */ }
#sell-crop-modal { /* Inherits from main.css */ }

#sell-crop-modal-title {
    margin-top: 0;
    margin-bottom: 1rem; /* Reduced margin */
    text-align: center;
    color: var(--clay-text-primary);
    font-size: 1.25rem; /* Adjusted size */
}

.sell-crop-info {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem; /* Reduced margin */
    color: var(--clay-text-secondary); /* Use theme variable */
    font-size: 0.85rem; /* Adjusted size */
}

.sell-crop-input-container {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem; /* Reduced margin */
}

#sell-crop-quantity {
    /* Styles handled by theme */
    flex: 1;
    font-size: 0.9rem; /* Adjusted size */
}

.sell-crop-total {
    color: var(--clay-secondary); /* Use theme variable */
    font-weight: 600;
    font-size: 0.9rem; /* Adjusted size */
}

.sell-crop-modal-actions {
    /* Styles handled by main.css */
}

#sell-crop-confirm-btn,
#sell-crop-cancel-btn {
    /* Styles handled by clay-theme.css */
}

.sell-btn {
    /* Styles handled by clay-theme.css */
    padding: 0.5rem; /* Adjusted padding */
    font-size: 0.75rem; /* Adjusted size */
    width: 100%;
    margin-top: 0.75rem; /* Adjusted margin */
}
