/*!*********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[12].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[12].oneOf[12].use[3]!./src/app/expeditions/JSONDisplay.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************/
.grid-container {
    display: grid;
    grid-template-columns: 4fr 4fr 4fr;
    grid-column-gap: 16px;
}

.grid-left {
    display: grid;
    grid-row-gap: 16px;
    grid-template-rows: min-content;
}

.grid-row {
    /* Add any additional styles for the grid-row, if needed */

}

.MuiInputBase-root {
    height: 36px;
    padding: 0 0 0 6px !important;
}

.MuiInputBase-root {
    height: 36px;
    padding: 0 9px 0 0;
}

.MuiInputBase-root input {
    padding: 0;
}

.MuiAccordion-root {
    background-color: rgba(255, 255, 255, 0.12);
    color: inherit;
}

.MuiInputBase-root {
    color: inherit !important;
    background-color: inherit !important;
    height: 36px;
    padding: 0 0 0 6px !important;
}

.MuiAccordion-root {
    color: inherit !important;
    background-color: rgba(255, 255, 255, 0.12) !important;
}

.MuiOutlinedInput-notchedOutline {
    border-color: gray !important;
}

.MuiSvgIcon-root {
    filter: invert(56%) sepia(0%) saturate(1112%) hue-rotate(144deg) brightness(90%) contrast(88%);
}
/*!*****************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[12].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[12].oneOf[12].use[3]!./src/app/expeditions/PetItem.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************/
.item-tile {
    margin: auto;
}


.item-tile-ground {
    margin: auto auto auto auto;
}


.item-tile-air {
    margin: auto auto auto auto;
}

.static-item-tile .item-image-container {
    max-width: 150px;
    max-height: 150px;
}

.static-item-tile .item-image {
    max-width: 150px;
    max-height: 150px;
}

.item-image-container {
    position: relative;
    max-width: 75px;
    max-height: 75px;
}

.item-image {
    max-width: 75px;
    max-height: 75px;
}

.unselected {
    opacity: 0.4;
}

.tooltip {
    /* display: inline-block; */
    width: 100px;
    height: 100px;
}

.tooltip .tooltip-content {
    background-color: rgba(255, 255, 255, 0.0);
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    min-width: 200px;
    max-width: 400px;
    white-space: nowrap;
}



.item-tile:hover .tooltip {
    visibility: visible;
}

.item-tile-ground:hover .tooltip {
    visibility: visible;
}

.item-tile-air:hover .tooltip {
    visibility: visible;
}

.basicPetTile:hover .tooltip {
    visibility: visible;
}


.petImage {
    max-width: 100%;
    max-height: 100%;
}
/*!****************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[12].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[12].oneOf[12].use[3]!./src/app/util/ItemSelection.css ***!
  \****************************************************************************************************************************************************************************************************************************************************************************/
.item-selection {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-gap: 5px;
}