@font-face {
    font-family: 'TPLocation';
    src: url(Fonts/TPLocationFont.woff),
         url('Fonts/TPLocationFont.TTF') format('truetype');
}
@font-face {
    font-family: 'TPText';
    src: url("Fonts/TPText.otf");
}

/* Leaflet Modifications */
.leaflet-control-attribution.leaflet-control {
    display: none;
}
.marked {
    filter: brightness(60%)
}
.junked {
    filter: brightness(80%);
}
.unmarked {
    filter: brightness(100%);
}
.unobtainable {
    filter: grayscale(1) contrast(150%);
}
.brightHover {
    filter: brightness(130%);
}
.leaflet-marker-icon:hover {
    filter: brightness(130%);
}
.leaflet-div-icon {
    background: none !important;
    border: none !important;
}
.leaflet-popup-content-wrapper, .leaflet-popup-tip{
    background: #38352e !important;
    color: #d4d4d4 !important;
}
.leaflet-popup-close-button {
    font-size: 24px !important;
    margin-right: 1%;
}
.leaflet-tooltip {
    background-color: rgb(56, 53, 46, 0.95) !important;
    color: #c0c0c0 !important;
    border-radius: 0.25vw !important;
    border: 0 !important;
    font-size: calc(10px + 0.2vw) !important;   
}
.leaflet-tooltip-top:before { 
    border-top-color: #c0c0c0 !important; /* Tooltip arrow color */
}
path.leaflet-interactive:focus {
    outline: none; /* Remove focus square when dragging polygons with tooltip */
}

body {
    overflow: hidden;
    margin: 0;
    font-family: Arial, sans-serif;
    color: #c0c0c0;
    background-color: #1d1a14;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    touch-action: none;
}
body img {
    -webkit-user-drag: none;
}
#map { 
    touch-action: pinch-zoom;
    position: absolute;
    top: 0;
    left: 0;
    height: 100dvh;
    width: 100vw;
    background-color: #1d1a14; 
}
/* Made by DarkZant */
#credit {
    position: absolute;
    top: 0;
    font-size: 1.25vmax;
    font-family: "TPLocation", Arial, sans-serif;
    color: #9f2aff;
    background-color: #141414;
    padding: 1dvh 0.4vw;
    border-radius: 0.35vw;
    margin: 1.2vh 0 0 0.5vw;
    z-index: 1000;
}
#credit hr {
    border-color: #9f2aff;
}
#credit a {
    color: #9f2aff;
}
#credit a:hover {
    color: #7713c9;
}
/* Submap UI */
#submap {
    position: absolute;
    margin-left: 1%;
    margin-top: 1%;
}
#dungeonName {
    display: none;
    place-items: center;
    position: absolute;
    top: 1vh;
    left: 0.5vw;
    width: 35vw;
    max-height: 100%;
    z-index: 900;
}
#dungeonName img {
    max-width: 100%;
    grid-area: 1 / 1;
}
#dungeonName div {
    grid-area: 1 / 1;
    text-align: center;
    color: #c7c4b2;
    text-shadow: #060501 0px 3.5px 2px;
    font-family: 'TPLocation', Arial, sans-serif;
    font-size: 2.1vw;
    letter-spacing: 0.2vw;
    z-index: 925;
}
/* Floor buttons */
.dungeonImg, .floorButton img {
    border-style: solid;
    border-width: 0.2vmax;
    border-color: #38352e;
}
#floors {   
    position: absolute; 
    width: 15vw;
    max-height: 100%;
    top: 20vh;
    left: 2vw;
    display: flex;
    flex-direction: column;
    row-gap: 2px;
    cursor: pointer;
    z-index: 900;
}    
.floorButton {  
    display: none; 
    transition: filter 0.15s, transform 0.05s;
    cursor: pointer;
}
.floorButton:hover {
    filter: brightness(225%) !important;
    transform: scale(1.05) !important;
}
.floorButton img {
    max-width: 100%;
}
.floorButton div {
    position: relative;
    right: 37%;
    color: #a4a192;
    font-size: 2.2vw;
    text-shadow: #101210 1px 3px 1px;
    font-family: 'TPLocation', Arial, sans-serif;
}

/* Submap Names */
#submapName {
    display: none;
    align-items: center;
    width: 35vw;
    position: absolute;
    left: 0.5vw;
    top: 1vh;
    z-index: 900;
}
#submapName img {
    max-width: 100%;
    /* height: 53.5px; */
}
#submapName div {
    position: absolute;
    left: 12%;
    z-index: 925;
    color: #c0bc72;
    text-shadow: #060501 0px 3.5px 2px;
    font-size: 2.25vw;
    font-family: 'TPLocation', Arial, sans-serif;
}


/* Cave of Ordeals UI */
#caveofOrdeals {
    display: none;
    position: absolute;
    left: 3vw;
    top: 12dvh;
    flex-direction: column;
    align-items: center;
    row-gap: 5dvh;
    z-index: 900;
}
#caveofOrdealsControls {
    width: 15.75vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 2.5dvh;
}
#caveofOrdealsButton {
    display: flex;
    filter: brightness(150%);
}
.caveofOrdealsArrows {
    width: 5.5vw;
    cursor: pointer;
    transition: filter 0.1s, transform 0.1s;
}
.caveofOrdealsArrows:hover {
    filter: brightness(125%) !important;
    transform: scale(1.1) !important;
}
#caveofOrdealsFloorText {
    width: 17vw;
    font-size: 1vw;
    background-color: rgb(56, 53, 46, 0.85);
    text-align: center;
    padding: 1vw 0.75vw;
    border-radius: 10px;
}
#caveofOrdealsFloorText img{
    width: 1.1dvw;
    padding: 0 0.2dvw;
}
#caveofOrdealsFloorText ul {
    padding-inline-start: 12.5%;
}
#caveofOrdealsFloorText b {
    text-decoration: underline;
    font-size: 1.1vw;
}
#caveofOrdealsFloorText u {
    font-size: 1.05vw;
}

/* Map Counters */
#counter {
    position: absolute;
    bottom: 0.5dvh;
    left: 0.5dvh;
    visibility: hidden;
    font-size: 1.5vw;
    background-color: #141414;
    padding: 0.5vh 0.4vw;
    border-radius: 0.35vw;
    z-index: 900;
}
.cpt {
    display: inline-block;
    position: absolute;
    top: 50%; 
    left: 50%;  
    transform: translate(-50%, -50%); 
    border-radius: 100vw;
    padding: 0.25dvh 0.25dvw;
}
.subcpt {   
    /* line-height: calc(8px + 0.25vmax); */
    font-size: calc(8px + 0.25vmax);
    background-color: rgb(56, 53, 46, 0.85);   
}
.procpt {
    /* line-height: 3dvh; */
    font-size: calc(8px + 0.5vmax);
    background-color: rgb(56, 53, 46, 0.9);
}
/* Checkmarks */
.checkmark, .junk {
    width: 1.25dvw;
    height: 1.25dvw;
    position: absolute;
    top: 55%;
    left: 55%;
    z-index: 2000;
    filter: brightness(200%);
}