/* ==========================
   CHART CONTAINER
========================== */
.chart-box {
    width: 100%;
    height: 340px;
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

/* ==========================
   RANGE BUTTONS
========================== */
.range-buttons {
    display: flex;
    gap: 6px;
    margin: 10px 0 8px;
}

.range-buttons button {
    flex: 1;
    padding: 7px 6px;
    border: none;
    background: #edf2f7;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    color: #4a5568;
    transition: all 0.15s ease;
    cursor: pointer;
}

/* Hover (desktop) */
.range-buttons button:hover {
    background: #e2e8f0;
}

/* Active */
.range-buttons button.active {
    background: #3182ce;
    color: #ffffff;
    box-shadow: 0 2px 6px rgba(49,130,206,0.25);
}

/* Touch feedback */
.range-buttons button:active {
    transform: scale(0.96);
}

/* ==========================
   HIGHCHARTS OVERRIDES
========================== */

/* 🔥 FJERN RESET ZOOM (100% sikkert) */
.highcharts-reset-zoom {
    display: none !important;
}

/* Font */
.highcharts-container {
    font-family: system-ui, -apple-system, sans-serif !important;
}

/* Axis labels */
.highcharts-axis-labels text {
    fill: #4a5568 !important;
    font-size: 11px !important;
}

/* Grid lines */
.highcharts-grid-line {
    stroke: #e6edf3 !important;
    stroke-width: 1 !important;
}

/* Axis lines */
.highcharts-axis-line {
    stroke: #ccd6e0 !important;
}

/* Tooltip */
.highcharts-tooltip text {
    fill: #1a1a1a !important;
}

/* Tooltip box (litt penere) */
.highcharts-tooltip-box {
    fill: #ffffff !important;
    stroke: #d6dee6 !important;
    stroke-width: 1 !important;
}

/* Crosshair */
.highcharts-crosshair {
    stroke: #3182ce !important;
    stroke-dasharray: 3,3;
}

/* Series hover (litt mer respons) */
.highcharts-series:hover {
    opacity: 1 !important;
}

/* Litt demping av ikke-hover */
.highcharts-series {
    transition: opacity 0.15s ease;
}