/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */
 .addborder {
    -webkit-border-radius: 50px;
    border-radius: 50px;
 }
 .thermometer-container {
    text-align: center;
    margin: 20px auto;
    margin-bottom: 40px;
    padding: 20px;
    max-width: 77vw; /* Constrain the thermometer width */
    background-color: #f9f9f9; /* Subtle background color for the container */
    border-radius: 20px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Light shadow for depth */
}

.thermometer-bar {
    background-color: #e0e0e0;
    border-radius: 15px;
    height: 30px;
    position: relative;
    overflow: hidden;
    margin: 20px 0; /* Add space around the bar */
}

.thermometer-progress {
    background: linear-gradient(90deg, #007aff, #00c6ff); /* Blue gradient */
    height: 100%;
    border-radius: 15px;
    transition: width 1.5s ease; /* Slower animation */
    position: relative;
}

.thermometer-progress span {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    color: white;
}

.thermometer-goal {
    font-size: 20px; /* Increase font size slightly */
    font-weight: bold;
    color: #333; /* Darker text for contrast */
}

.thermometer-total {
    font-size: 18px; /* Make the total more prominent */
    margin-bottom: 10px;
    color: #666; /* Softer color for better readability */
}

/* Subtle glow effect on bar */
.thermometer-bar::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: 0.1;
    background-image: radial-gradient(circle, rgba(255, 255, 255, 0.3), transparent);
    pointer-events: none;
}
.hidden {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}
