:root {
  --bs-body-bg: transparent;
  --bs-body-bg: #00000044;
}

/* fix transparent bg */
.dropdown-menu, .dropdown-item, select option, .select2-results__options, .select2-container--bootstrap-5 .select2-dropdown {
    background-color: #222;
}
.tooltip-inner {
    color: white;
    background-color: #222;
}

/* Select 2 bootstrap-5 theme override */
html[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection {
    background-color: transparent !important;
    border: 1px solid #495057;
}
html[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection--single {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
html[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
	color: #dee2e6 !important;
}
html[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
	color: #dee2e6 !important;
}
html[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
	border: 1px solid var(--bs-gray-600);
}
html[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered .select2-selection__placeholder {
	color: #dee2e6 !important;
}
html[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field {
    background-color: transparent !important;
    color: #dee2e6 !important;
}
html[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-dropdown {
    color: #dee2e6 !important;
    border: 1px solid #495057 !important;
	background-color: #222;
}
html[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option[role=group] .select2-results__group {
	color: var(--bs-secondary-color)!important;
}

body {
    background-color: #1a1a1b;
}

.background-image {
    position: fixed;
    left: 0;
    right: 0;
    background-image: url(https://cdn.paldb.cc/image/1.0/Palworld_Release.webp);
    background-size: cover;
    background-position: center center;
    height: 100%;
    /*width: 100%;*/
    filter: brightness(20%);
    z-index: -2;
}


#toTop {
    display: none;
    position: fixed;
    bottom: 5px;
    right: 5px;
    opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
}
#toTop:hover {
    opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
}
#toTop .glyphicon {
    font-size: 4em;
}

a.disabled {
  pointer-events: none;
  cursor: default;
}

.bg_rarity1 {
    background-color: #1d431e;
}
.bg_rarity2 {
    background-color: #024760;
}
.bg_rarity3 {
    background-color: #492465;
}
.bg_rarity4 {
    background-color: #7b660b;
}
.bg_Desert02, .bg_Volcano02, .bg_Forest02, .bg_Grass02, .bg_Snow02 {
    filter: drop-shadow(1px 0px 0px #024760) drop-shadow(0px -1px 0px #024760) drop-shadow(-1px 0px 0px #024760) drop-shadow(0px 1px 0px #024760);
}

.banner_rarity0 {
    background-image: linear-gradient(#00000088, #000000ff),linear-gradient(#ffffff00, #ffffffff), url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_menu_iteminfo_head.webp);
    background-size: cover;
}
.hover_bg_rarity0 {
    background-color: #ffffff;
}
.hover_text_rarity0 {
    color: #fff;
}
.banner_rarity1 {
    background-image: linear-gradient(#00000088, #000000ff),linear-gradient(#53ac2900, #53ac29ff), url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_menu_iteminfo_head.webp);
    background-size: cover;
}
.hover_bg_rarity1 {
    background-color: #53ac29;
}
.hover_text_rarity1 {
    color: #53ac29;
}

.banner_rarity2 {
    background-image: linear-gradient(#00000088, #000000ff),linear-gradient(#0495f100, #0495f1ff), url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_menu_iteminfo_head.webp);
    background-size: cover;
}
.hover_bg_rarity2 {
    background-color: #0495f1;
}
.hover_text_rarity2 {
    color: #0495f1;
}

.banner_rarity3 {
    background-image: linear-gradient(#00000088, #000000ff),linear-gradient(#c50cf600, #c50cf6ff), url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_menu_iteminfo_head.webp);
    background-size: cover;
}

.hover_bg_rarity3 {
    background-color: #c50cf6;
}
.hover_text_rarity3 {
    color: #c50cf6;
}
.banner_rarity4 {
    background-image: linear-gradient(#00000088, #000000ff),linear-gradient(#ffaa0080, #ffaa00ff), url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_menu_iteminfo_head.webp);
    background-size: cover;
}
.hover_bg_rarity4 {
    background-color: #ffaa00;
}
.hover_text_rarity4 {
    color: #ffaa00;
}
.passive_banner_rank3,
.passive_banner_rank2 {
    border: solid 1px #ffdd00; border-left: solid 5px #ffdd00;
}
.passive_banner_rank1,
.passive_banner_rank-1,
.passive_banner_rank-2,
.passive_banner_rank-3 {
    border-left: solid 5px var(--bs-border-color);
}
.passive_banner_rank3 .passive_banner_inner_rank,
.passive_banner_rank2 .passive_banner_inner_rank {
    background-image: linear-gradient(#ffdd0020, #ffdd0020),linear-gradient(#11111188, #111111ff),url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_pal_skill_base_02.webp);
    background-size: contain;
}
.passive_banner_rank4 .passive_banner_inner_rank {
    background-image: linear-gradient(to right, #59bb653d, #5958cc7a), linear-gradient(#11111188, #111111ff), url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_pal_skill_base_02.webp);
    background-size: contain;
}
.passive_banner_rank5 .passive_banner_inner_rank {
    background-image: linear-gradient(to right, #59bb653d, #4d09cb7a), linear-gradient(#11111188, #111111ff), url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_pal_skill_base_02.webp);
    background-size: contain;
}
.passive_banner_rank1 .passive_banner_inner_rank,
.passive_banner_rank-1 .passive_banner_inner_rank,
.passive_banner_rank-2 .passive_banner_inner_rank,
.passive_banner_rank-3 .passive_banner_inner_rank
 {
    border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}
.passive_banner_rank3 .passive_img_rank,
.passive_banner_rank2 .passive_img_rank {
    filter: sepia() saturate(10000%) hue-rotate(0deg);
}
.passive_banner_rank-3 .passive_img_rank,
.passive_banner_rank-2 .passive_img_rank,
.passive_banner_rank-1 .passive_img_rank
 {
    filter: invert(80%) sepia(90%) saturate(7456%) hue-rotate(359deg) brightness(95%) contrast(115%);
    transform: scaleY(-1);
}
.passive_banner_rank4 .passive_img_rank,
.passive_banner_rank5 .passive_img_rank {
    /*filter: sepia() saturate(10000%) hue-rotate(75deg);*/
    filter: brightness(0) saturate(100%) invert(92%) sepia(71%) saturate(6307%) hue-rotate(99deg) brightness(108%) contrast(101%);
}

.passive_banner_rank4, .passive_banner_rank5 {
    border: solid 1px #5cf1e2;
    border-left: solid 5px #5cf1e2;
}


.hover_icon_bg {
    height: 144px;
    opacity: 1.0;
    background-color: #3e4750;
    background-image: url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_menu_bg_prt.webp);
    background-size: contain;
    background-repeat: no-repeat;
}

img.HelpGuide {
    max-width: 100%;
}

.tippy-box {
    font-size: initial;
    max-width: 408px !important;
}
.tippy-content {
    padding: 0;
}

.size128 {
    height: 128px;
}
.size96 {
    width: 96px;
    height: 96px;
}
.size64 {
    width: 64px;
    height: 64px;
}
.size32 {
    width: 32px;
    height: 32px;
}
.size30 {
    height: 30px;
}
.size24 {
    width: 24px;
    height: 24px;
}
.palAlpha {
    position: absolute;
    display: inline-block;
    background-size: 37% 37%;
    background-repeat: no-repeat;
    background-image: url(https://cdn.paldb.cc/image/Pal/Texture/UI/InGame/T_icon_enemy_strong.webp);
}
.size32alpha {
    position: absolute;
    display: inline-block;
    width: 32px;
    height: 32px;
    background-size: 37% 37%;
    background-repeat: no-repeat;
    background-image: url(https://cdn.paldb.cc/image/Pal/Texture/UI/InGame/T_icon_enemy_strong.webp);
}
.size64alpha {
    position: absolute;
    display: inline-block;
    width: 64px;
    height: 64px;
    background-size: 37% 37%;
    background-repeat: no-repeat;
    background-image: url(https://cdn.paldb.cc/image/Pal/Texture/UI/InGame/T_icon_enemy_strong.webp);
}
.palRaid {
    position: absolute;
    display: inline-block;
    background-size: 37% 37%;
    background-repeat: no-repeat;
    background-image: url(https://cdn.paldb.cc/image/Pal/Texture/UI/InGame/T_icon_enemy_strong.webp);
    filter: invert(1);
}
.size24raid {
    position: absolute;
    display: inline-block;
    background-size: 37% 37%;
    background-repeat: no-repeat;
    background-image: url(https://cdn.paldb.cc/image/Pal/Texture/UI/InGame/T_icon_enemy_strong.webp);
    filter: invert(1);
    width: 24px;
    height: 24px;
}
.size32raid {
    position: absolute;
    display: inline-block;
    width: 32px;
    height: 32px;
    background-size: 37% 37%;
    background-repeat: no-repeat;
    background-image: url(https://cdn.paldb.cc/image/Pal/Texture/UI/InGame/T_icon_enemy_strong.webp);
    filter: invert(1);
}
.size64raid {
    position: absolute;
    display: inline-block;
    width: 64px;
    height: 64px;
    background-size: 37% 37%;
    background-repeat: no-repeat;
    background-image: url(https://cdn.paldb.cc/image/Pal/Texture/UI/InGame/T_icon_enemy_strong.webp);
    filter: invert(1);
}
.border-radius-32 {
    border-radius: 32px;
}
.hoverIcon {
    height: 128px;
}
.js-modal-btn .fa-youtube {
    position: absolute;
    bottom: 50%;
    left: 50%;
    scale: 3;
    opacity: 0.8;
}
.js-modal-btn {
    position: relative;
    display: inline-block;
    width: 320px;
    height: 180px;
}
.js-modal-btn.card-img-top {
    width: 100%;
    height: auto;
}
.js-modal-btn.card-img-top img {
    width: 100%;
}
.card.mt-3 > .card-body > h5:first-child {
    position: absolute;
    top: -12px;
}
.card-header {
    background: transparent;
    border-bottom: 0;
}
.element_color_00 {
    color: #ffefe9;
    text-decoration: none;
}
.element_color_01 {
    color: #ff714b;
    text-decoration: none;
}
.element_color_02 {
    color: #52c9fe;
    text-decoration: none;
}
.element_color_03 {
    color: #fedb2e;
    text-decoration: none;
}
.element_color_04 {
    color: #b9ff52;
    text-decoration: none;
}
.element_color_05 {
    color: #c11986;
    text-decoration: none;
}
.element_color_06 {
    color: #d978ff;
    text-decoration: none;
}
.element_color_07 {
    color: #e4aa77;
    text-decoration: none;
}
.element_color_08 {
    color: #82f7fc;
    text-decoration: none;
}
.badge.Shot {
    color: #fff!important;
    background-color: RGBA(var(--bs-primary-rgb),var(--bs-bg-opacity, 1))!important;
}
.badge.Melee {
    color: #fff!important;
    background-color: RGBA(var(--bs-danger-rgb),var(--bs-bg-opacity, 1))!important;
}
.hover-tooltip {
    max-width: 400px;
}
.itemname {
    color: white;
    text-decoration: none;
}
.itemPopup {
    max-width: 100%;
}
.onHover {
    width: 408px;
}
.hoverTech {
    width: 128px;
    height: 128px;
    background-position: center;
    background-size: 90px 90px;
    background-repeat: no-repeat;
    position: relative;
    border: solid #789bc9;
    background-color: #1455a4;
}
.hoverTech.BossTechnology, .hoverTech.BossTechnology .hoverTechCost {
    background-color: #7f28c7;
}
.hoverTechHeader {
    position: absolute;
    top: 0;
    text-align: center;
    width: 100%;
    background-color: rgba(0,0,0,0.6)
}
.hoverTechFooter {
    position: absolute;
    bottom: 0;
    text-align: center;
    width: 100%;
    background-color: rgba(0,0,0,0.2);
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    font-size: x-small;
}
.hoverTechCost {
position: absolute;
    right: 2px;
    top: 2px;
    border-radius: 50%;
    background-color: #08c;
    color: white;
    z-index: 100;
    font-size: 10px;
}
.break {
  flex-basis: 100%;
  height: 0;
}
.card img {
    max-width: 100%;
}
.sick {
    background: linear-gradient(-135deg, transparent 8px, #814d97 0) top right;
    width: 100px;
    text-align: center;
}

.nodeExample1 {
    border-radius: 3px;
    //background-color: #222;
    border: 1px solid grey;
    //width: 200px;
    display: flex !important;
}
.nodeExample1 img {
    //margin-right:  10px;
    height: 48px;
    width: 48px;
}
.nodeExample1 p {
    margin: 0px;
    //height: 32px;
}
.nodeExample1 .node-name {
    position: absolute;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

.paltree img {
    height: 48px;
    width: 48px;
    margin-right: 10px;
    float: none !important;
}
.paltree .node-name  {
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    text-align: center;
    position: absolute;
    width: 120px;
    left: -50%;
}

.treelink {
    position: absolute;
    right: 0;
    width: fit-content;
}

.invalid {
    color: grey;
}
.map-crude-oil-icon, .map-antiair-icon {
    filter: drop-shadow(1px 0px 0px white) drop-shadow(0px -1px 0px white) drop-shadow(-1px 0px 0px white) drop-shadow(0px 1px 0px white);
}
.HexoliteQuartz,.Chromite,.map-treasuremap-icon,.map-fishing-spot-icon,.map-shadow-black-icon, .map-junkyard-icon
{
    filter: drop-shadow(1px 0px 0px black) drop-shadow(0px -1px 0px black) drop-shadow(-1px 0px 0px black) drop-shadow(0px 1px 0px black);
}
.map-shadow-gold-icon {
    filter: drop-shadow(1px 0px 0px gold) drop-shadow(0px -1px 0px gold) drop-shadow(-1px 0px 0px gold) drop-shadow(0px 1px 0px gold);
}
.map-fishing-spot-rare-icon {
    filter: drop-shadow(1px 0px 0px red) drop-shadow(0px -1px 0px red) drop-shadow(-1px 0px 0px red) drop-shadow(0px 1px 0px red);
}
.map-rarity1 {
    filter: drop-shadow(1px 0px 0px #1d431e) drop-shadow(0px -1px 0px #1d431e) drop-shadow(-1px 0px 0px #1d431e) drop-shadow(0px 1px 0px #1d431e);
}
.map-rarity2 {
    filter: drop-shadow(1px 0px 0px #024760) drop-shadow(0px -1px 0px #024760) drop-shadow(-1px 0px 0px #024760) drop-shadow(0px 1px 0px #024760);
}
.map-rarity3 {
    filter: drop-shadow(1px 0px 0px #492465) drop-shadow(0px -1px 0px #492465) drop-shadow(-1px 0px 0px #492465) drop-shadow(0px 1px 0px #492465);
}
.map-junk-rank2 {
    filter: drop-shadow(1px 0px 0px gold) drop-shadow(0px -1px 0px gold) drop-shadow(-1px 0px 0px gold) drop-shadow(0px 1px 0px gold);
}
.item_skill_bar {
    border: 1px solid #495057;
    border-left: 4px solid white;
}
.border-purple {
    border: 1px solid purple;
}
.bg-purple {
    background-color: purple;
}
.markdown h1, .markdown h2, .markdown h3, .markdown h4, .markdown h5, h5.card-header {
    color: var(--bs-info);
}
.Aggregate {
    background-color: #28373b;
    font-size: smaller;
}
.itemPopup.activeSkill .itemHead {
    background-image: linear-gradient(#304e5f96, #2f383b), url(https://cdn.paldb.cc/image/Pal/Texture/UI/Main_Menu/T_prt_pal_skill_base_02.webp);
    background-size: contain;
}
.itemPopup.activeSkill .card-body {
    background-color: #162226;
}
.itemQuantity {
    color: deepskyblue;
}
.itemQuantity::before {
    content: "x";
}
.level::before {
    content: "Lv.";
}
.Nocturnal {
    display: inline-block;
    background-color: #493291;
    border: 1px #6741cd solid;
    padding: 1px 7px;
}
.half-bottom-row {
    background-color: #3d4b50;
    position: relative;
    height: 14px;
    margin-top: 1rem;
}
.half-bottom-row > div  {
    position: absolute;
    top: -10px;
}
.tech-lock {
    color: #fc4c4c;
}
a:hover {
    color: revert;
    text-shadow: #ffcc00 2px 0px 5px;
}
.productUiDisplayTitle {
    border-left: solid #6be7ff;
    padding-left: .5rem;
    color: #cbf5ff;
    background: linear-gradient(to left, transparent 0%, #1a3136 100%);
}
ul.leftMenu {
    list-style-type: none;
    margin-bottom: 0;
    padding-left: 0;
}
ul.leftMenu img, ul.dropdown-menu img {
    height: 24px;
}
ul .dropdown-divider {
    height: 1px;
    background-color: grey;
    margin-top: 3px;
    margin-bottom: 3px;
}
ul .dropdown-item {
    background-color: #00000044;
}
ul.leftMenu li {
    padding-bottom: 1px;
}
ul.leftMenu li a.dropdown-item {
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
}
.card-footer {
    border-top: 0;
    background-color: var(--bs-body-bg);
}
.status_keyword {
    color: #e6d27a;
}
.status_up {
    color: #01a4e8;
}
.itemList li:not(:last-child)::after {
    content: "\2022";
    color: var(--default-color);
    padding: 0 3px;
}

.itemList ul {
    margin: 0;
    padding: 0;
    list-style-image: unset;
}
.itemList li {
    display: inline;
}
.card-body>.itemList2:not(:first-child) {
    border-top: 1px solid #333;
}
.progress.pal-stats {
    width: 100px;
}
.bg-day {
    background-color: #ff7800;
}
.bg-night {
    background-color: #593cf2;
}
.text-day {
    color: #ff7800;
}
.text-night {
    color: #593cf2;
}
.fa-tree.passive-desc, img.passive-desc {
    position: absolute;
    right: 10px;
    bottom: 10px;
    height: 24px;
}
.fa-tree.banner-passive-desc, img.banner-passive-desc {
    height: 24px;
}
.Status_Up {
    color: #00B4FF;
}
.Status_Keyword {
    color: #FFE786;
}
.Elem_Neutral {
    color: #E8C0B5;
}
.Elem_Fire {
    color: #E76B50;
}
.Elem_Water {
    color: #3A84EE;
}
.Elem_Electric {
    color: #E7C138;
}
.Elem_Grass {
    color: #83CB30;
}
.Elem_Dark {
    color: #8F69FA;
}
.Elem_Dragon {
    color: #CA67F3;
}
.Elem_Ground {
    color: #D9854A;
}
.Elem_Ice {
    color: #79EAFA;
}
.RequiredSuitability, .MapObjectExtra {
    border: 1px solid #595c64
}
.image-container {
    position: relative;
    display: inline-block; /* Keeps the container wrapped tightly to the image size */
    vertical-align: middle;
}
.image-container img {
    display: block;
    max-width: 100%;
    height: auto;
}
.bottom-right-text {
    position: absolute;
    bottom: 0px;
    right: 0px;
    text-shadow: 1px 1px 0px #000000;
}
.ui-autocomplete {
    z-index: 1030;
}
.passive-rank4, .passive-rank5 {
    color: #68ffd8;
    text-shadow: 1px 1px 0px #000000;
}
.passive-rank3,.passive-rank2,.passive-rank1 {
    color: #ffd83f;
    text-shadow: 1px 1px 0px #000000;
}
.positive {
    color: #117b9c;
}
.negative {
    color: #9c3335;
}
.wInit {
    background-color: #a1c3cb;
}
.wStar {
    background-color: #ffe94b;
}
.wEmpty {
    background-color: #21332e;
}
.work-bar {
    height: 5px;
}
.owned {
    color: #ffe725;
}
.mapObjectsIconBar {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    gap: 5px;
    padding: 5px;
    margin: 0;
}
ul.mapObjectsIconBar span {
    display: none;
}
ul.mapObjectsIconBar img, ul.mapObjectsIconBar svg {
    width: 48px;
    height: 48px;
}
img.pal-awakened {
    --bs-border-opacity: 1;
    border-color: rgba(var(--bs-warning-rgb), var(--bs-border-opacity)) !important;
}
img.map-snap-image {
    width: 400px;
}