body {
    background-color: #111;
    color: #fff;
    font-family: 'IBM Plex Mono', sans-serif; /* "Michroma", sans-serif; Orbitron Russo One*/
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40 40 40 10;
    margin: 0;
}

.price-history {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
    gap: 6px;
	font-weight: 400;
}

.current-price {
    font-size: 4rem;
    color: #f7931a;
    text-shadow: 0 0 10px #f7931a;
    position: relative;
    margin-bottom: 2px;
	font-weight: 500;
}

.prev-price {
    font-size: 1.8rem;
    color: #cccccc4a;
    text-shadow: 0 0 10px #ffffff6a;
    position: relative;
    margin-bottom: 0px;
	font-weight: 400;
	/*animation: fadeOut 30s forwards;*/
}

@keyframes fadeOut {
  0% { opacity: 1; }
  100% { opacity: 0; }
}

.old-price {
    position: relative;
}

.arrow {
    position: absolute;
    left: -30px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.5rem;
}

.pos {
    color: #00ff00;
}

.neg {
    color: #ff4444;
}

.neutral {
    color: #888888;
}

.error {
    color: red;
    font-size: 1.2rem;
    margin-top: 20px;
}

#overview-box {
    max-width: 600px;
    width: 100%;
    background: rgba(34, 34, 34, 0.9); /* semi-transparent dark background */
    padding: 20px 40px;
    border-radius: 15px;
    box-shadow:
        0 0 20px 6px rgba(247, 147, 26, 0.7), /* strong orange glow */
        inset 0 0 15px rgba(247, 147, 26, 0.4); /* inner glow */
    margin-top: 30px;
    font-family: 'IBM Plex Mono', sans-serif;
	font-weight: 300;
	font-size: 14px;
    color: #ccc;
}

#overview-box h2 {
    margin-top: 0;
    color: #f7931a;
    text-align: center;
    text-shadow: 0 0 8px #f7931a;
	font-weight: 500;
	margin-bottom: auto;
}

.overview-header,
.overview-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    padding: 8px 0;
    border-bottom: 1px solid #333;
}

.overview-header {
    font-weight: bold;
    border-bottom: 2px solid #f7931a;
    color: #f7931a;
    text-shadow: 0 0 6px #f7931a;
}

.overview-row:last-child {
    border-bottom: none;
}

.overview-row div {
    text-align: left;
}

#chart-container {
    width: 100%;
    /*max-width: 600px; /* or whatever fits your layout */
    height: auto; /* match canvas height or more */
    margin: auto;
}

.graphtimes {
	text-align: center;
	font-size: 12px;
	font-weight: 200;
	color: #ccc;
	border-bottom: 0px solid #f7931a;
}

.graphtimes a {
	font-size: 12px;
	color: #ccc;
	text-decoration: none;
}

.graphtimes a:hover {
	color: #f7931a;
	text-decoration-line: underline;
	text-decoration-style: dotted;
}

.linklike {
	cursor:pointer;
	font-size: 12px;
	color: #ccc;
	text-decoration: none;
	
}