th, td {
  text-align: center; /* 수평 중앙 정렬 */
}

th {
  position: sticky;
  top: 0;
  background-color: #f1f1f1; /* 배경색이 없으면 내용이 겹쳐 보일 수 있음 */
  z-index: 10;
  background-clip: padding-box;
}

#itemsTable thead tr:first-child th {
  top: 0;
  z-index: 12;
}

#itemsTable thead tr:nth-child(2) th {
  top: var(--items-header-first-row-height, 28px);
  z-index: 11;
}

#itemsTable tbody tr:hover td,
#itemsTable td.column-hover,
#itemsTable th.column-hover {
  background-color: #e8f6d8;
}

#itemsTable tbody tr:hover td.column-hover {
  background-color: #d9efc2;
}
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  opacity: 1;
}

input[type="number"]:focus {
  outline: 3px solid #e53935;
  outline-offset: 1px;
  border-color: #b71c1c;
  box-shadow: 0 0 0 1px #b71c1c;
}


.table-text-color-red {
  color: red;
}

.table-text-color-blue {
  color: blue;
}

.table-text-color-green {
  color: green;
}

.tooltipNotice {
  color: #d7caee;
}

.tooltiplackoflevel {
  color: red;
}

.tooltiplackof {

}

.tooltiplackof.title {
  color: red;
}
.tooltiplackof.contents {
  color: #b1d8f8;
}


#genderOnly:disabled,
#classOnly:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

#genderOnly:not(.active),
#classOnly:not(.active) {
    background-color: white;
    border-color: #333;
    color: black;
    cursor: pointer;
}

#genderOnly.active,
#classOnly.active {
    background-color: #555;
    border-color: #333;
    color: white;
    cursor: pointer;
}





.filter-group,
#current-status {
  display: grid;
  align-items: center;
  gap: 2px 6px;
}
.filter-gender {
  grid-template-columns: auto repeat(5, max-content);
}
.filter-class {
  grid-template-columns: auto repeat(6, max-content);
}
.filter-MM {
  grid-template-columns: repeat(4, max-content);
}
.filter-title {
  padding: 2px 4px;
  display: flex;
  align-items: center;
}

#filters {
  display: grid;
  gap: 4px;
}

#current-status {
  grid-template-columns: auto repeat(6, max-content);
}

#current-status input,
.filter-MM input {
  width: 56px;
  box-sizing: border-box;
}

#current-status label,
.filter-group label {
  white-space: nowrap;
}







#itemTooltipNotice,
#itemTooltip,
#itemTooltipRequire,
#itemTooltipTogether {
    display: none;
    position: fixed;
    z-index: 9999;

    width: max-content;
    max-width: calc(100vw - 30px);

    padding: 4px;

    background: rgba(0, 0, 0, 0.8);
    border: 2px solid #a58a73;
    
    font-family: "굴림", Gulim, sans-serif;
    font-size: 12px;
    line-height: 1.0;

    text-align: center;
    white-space: nowrap;

    pointer-events: none;
}

/* 클릭 */
#itemTooltipTogether {
    pointer-events: auto;
}

/* 링크 */
.tooltip-together-item {
    cursor: pointer;
}

.tooltip-together-title {
  color: #808080;
}

.tooltip-together-item span {
  color: #cfecbd;
}

.tooltip-together-item:hover span {
  color: #808080;
}

#itemsTable a,
#itemsTable a:visited {
  color: black;
  text-decoration: underline;
}

#itemsTable a:hover {
  color: #808080;
}

#itemsTable a:active {
  color: black;
}

#itemsTable {
  overflow: visible;
}

#itemTooltip .tooltip-name {
    color: #ffffff;
}


#itemTooltip .tooltip-description {
    color: #d7caee;
}


#itemTooltip .tooltip-durability {
    color: #ff0000;
}


#itemTooltip .tooltip-level,
#itemTooltip .tooltip-stats {
    color: #b1d8f8;
}


#itemTooltip .tooltip-ability {
    color: #cfecbd;
}


#itemTooltip .tooltip-price {
    color: #ffff00;
}

#itemTooltip .tooltip-cashprice {
    color: #ff0000;
}