/* Apply box-sizing globally */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Prevent horizontal overflow */
html, body {
	font-family: 'Verdana', sans-serif;  /* Replace 'Roboto' with your desired font */
    overflow-x: hidden; /* Prevent any horizontal scroll */
    margin: 0; /* Remove default margins */
    padding: 0; /* Remove default padding */
}

/* Main container */
.container, .elementor-container {
    width: 100%; /* Ensure the container takes the full width */
    max-width: 100%; /* Avoid accidental overflow */
    padding: 0 15px; /* Optional padding for spacing */
}

/* Prevent any elements from spilling outside */
.elementor-section {
    position: relative;
    width: 100%; /* Ensure sections take full width */
    box-sizing: border-box;
}

/* Center and constrain the container */
.container {
    max-width: 1280px;
    margin: 0 auto; /* Center the container */
}

/* Adjust for smaller screen sizes */
@media (max-width: 960px) {
    .container {
        padding: 0 15px; /* Ensure there's always a little padding */
    }
}

/* For very small screens */
@media (max-width: 600px) {
    .container {
        padding: 0 10px; /* Adjust padding for smaller screens */
    }
}

/* Ensure chart fits within its container */
#QGL_Chart {
    width: 100% !important;
    height: auto !important;
}

/* Marquee animation styles */
div#marquee {
    overflow: hidden;
    animation: marquee 30s linear infinite;
}

@keyframes marquee {
    from {
        transform: translateX(100%);
    }
    to {
        transform: translateX(-100%);
    }
}

/* Styling for specific elements */
strong {
    font-weight: 200;
    color: white;
    display: block;
}

.wdt-column-avg .wdt-column-sum {
    font-weight: 600;
    color: white;
    font-size: 25px;
}

#peak-920, #peak-920-mobile, #base-124, #base-124-mobile, #off-peak, #off-peak-mobile {
    font-weight: 400;
    font-size: 16px;
	text-align: center;
}

#peak-920::before, #peak-920-mobile::before,
#base-124::before, #base-124-mobile::before,
#off-peak::before, #off-peak-mobile::before {
    font-weight: 600;
    color: #AD3865;
    display: block;
    font-size: 15px;
}

#peak-920::before {
    content: 'Peak (9-20)';
}

#base-124::before {
    content: 'Base (1-24)';
}

#off-peak::before {
    content: 'Off-Peak (1-8; 21-24)';
}

/* Adjust table column styling */
.wdt-column-avg .wdt-column-sum {
    text-align: center;
}

.wdt-column-avg strong {
    font-weight: 200;
}

/* This is the label before the value */
.wdt-column-avg-value::before { 
    content: 'Средна цена';
    font-weight: 200;
    color: white;
    font-size: 15px;
    display: block; /* Ensures the label is on its own line */
	margin-top: 10px; /* Space between the label and the number */
}

/* This is the actual value */
.wdt-column-avg-value {
    font-weight: bold;
    font-size: 20px; /* Adjust this value as needed */
    color: white;
    display: block; /* Ensure value is displayed on its own line */
	padding-left: 10px; /* Padding around the value to make the box bigger */
	border-radius: 5px; /* Optional: Rounded corners */
	margin-bottom: 10px; /* Space below the value */
}

/* This is the text that will show up after the value */
.wdt-column-avg-value::after {
    content: 'BGN/MWh';
    font-weight: 200;
    font-size: 12px;
    padding-left: 2px;
    margin-top: 5px; /* Space between the value and the unit */
}

.wdt-column-sum strong {
    display: none;
}

.wdt-column-sum::before {
    content: 'Общо Количество';
    font-weight: 200;
    color: white;
    font-size: 15px;
    display: block; /* Ensures the label is on its own line */
    margin-left: 10px; /* Space between the label and the number */
	margin-top: 10px; /* Space between the label and the number */

}

/* This is the actual value */
.wdt-column-sum-value {
    font-weight: bold;
    font-size: 20px; /* Adjust this value as needed */
    color: white;
    display: block; /* Ensure value is displayed on its own line */
	padding-left: 10px; /* Padding around the value to make the box bigger */
	border-radius: 5px; /* Optional: Rounded corners */
	margin-bottom: 10px; /* Space below the value */
}

.wdt-column-sum-value::after {
    content: 'MWh';
    font-weight: 200;
    font-size: 12px;
    padding-left: 12px;
    padding-left: 2px;
    margin-top: 5px; /* Space between the value and the unit */
}

#dam-delivery-day, #idm-delivery-date {
    margin-top: 5px;
	text-align: center;
}

/* Remove unnecessary margin for specific widget */
#vat-id.elementor-widget {
	margin-top: 5px;
    position: relative;
    left: -50px; /* Adjust as needed */
    }

.elementor-heading-title {
    font-size: 18px; /* Adjust the size as needed */
    font-weight: bold; /* Make the font bold */
    letter-spacing: 1px; /* Optional: Adjust letter spacing for style */
}
}