.bgblue  {
            /* If you want to use an actual image for the body background, uncomment below: */
            background: url('../../img/Gradient2.png') no-repeat center center fixed; 
             background-size: cover; 
            color: #ffffff;
            min-height: 100vh;
            /* display: flex; */
            align-items: center;
            justify-content: center;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            padding: 20px;
        }

        /* Outer container card */
        .market-card {
            background-color: rgba(217, 217, 217, 0.2);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 16px;
            width: 100%;
        }

        /* Inner boxed area with the blue border */
        .inner-display-box {
            border-radius: 8px;
        }

        /* Bottom stats row container */
        .stats-bar {
            background-color: rgba(217, 217, 217, 0.2);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 12px;
            margin-top:30px;
        }

        /* Custom text colors */
        .text-muted-custom {
            color: #a0aec0;
            font-size: 1.0rem;
        }
        .text-muted-custom1 {
            color: #a0aec0;
            font-size: 1.55rem;
        }
        .text-green {
            color: #4ADE80;
        }

        /* Divider lines for columns */
        .v-divider {
            border-right: 1px solid rgba(255, 255, 255, 0.2);
        }

        /* "View more" button styling */
        .btn-view-more {
            background-color: rgba(255, 255, 255, 0.1);
            color: #ffffff;
            border: 1px solid rgba(255, 255, 255, 0.15);
            font-size: 0.9rem;
            transition: all 0.3s ease;
        }
        .btn-view-more:hover {
            background-color: rgba(255, 255, 255, 0.2);
            color: #ffffff;
        }

        /* Responsive tweak to remove right borders on mobile layout stack */
        @media (max-width: 767.98px) {
            .v-divider {
                border-right: none;
                border-bottom: 1px solid rgba(255, 255, 255, 0.1);
                padding-bottom: 15px;
                margin-bottom: 15px;
            }
            .v-divider:last-child {
                border-bottom: none;
                margin-bottom: 0;
                padding-bottom: 0;
            }
        }

        .feature-card {
            background-color: #f1f3f7;
            border: none;
            border-radius: 12px;
            transition: transform 0.2s ease;
        }
        .feature-card:hover {
            transform: translateY(-3px);
        }
        .icon-circle-purple {
            width: 45px;
            height: 45px;
            background-color: #5046e5;
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            font-size: 1.25rem;
        }

        /* Bottom Grid Cards (Dark Blue) */
        .info-blue-card {
            background-color: #1226AA;
            color: #ffffff;
            border: none;
            border-radius: 16px;
            min-height: 140px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            padding: 1.5rem;
        }
        .info-blue-card .card-title {
            font-size: 1.75rem;
            font-weight: 700;
        }
        .info-blue-card .card-subtitle {
            color: rgba(255, 255, 255, 0.85);
            font-size: 0.9rem;
        }

        /* Blue indicator underline for section title */
        .custom-underline {
            width: 50px;
            height: 4px;
            background-color: #122bb5;
            margin-top: 15px;
            margin-bottom: 20px;
        }

        .bursa-banner {
            /* Replace 'your-image-path.jpg' with your actual image file path */
            background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.5)), url('../../img/Bursa-Announcement.png') no-repeat center center;
            background-size: cover;
            min-height: 320px;
            border-radius: 40px; /* Highly rounded corners matching image_05585c.png design language */
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .bursa-banner h2 {
            font-size: 2.5rem;
            font-weight: 700;
            letter-spacing: -0.5px;
        }

        /* Typography & Custom Accents */
        .section-title {
            color: #1e293b;
            font-weight: 700;
            font-size: 2.2rem;
            letter-spacing: -0.5px;
        }

        .custom-underline {
            width: 60px;
            height: 3px;
            background-color: #3b44a6;
            margin-top: 12px;
            margin-bottom: 30px;
        }

        .report-subtitle {
            color: #4f46e5;
            font-weight: 600;
            font-size: 1.3rem;
        }

        /* Purple Button Styling */
        .btn-coming-soon {
            background-color: #2e3cb4;
            color: #ffffff;
            border: none;
            font-size: 0.85rem;
            font-weight: 500;
            padding: 8px 18px;
            border-radius: 6px;
            box-shadow: 0 4px 6px rgba(46, 60, 180, 0.25);
            transition: all 0.2s ease;
        }

        .btn-coming-soon:hover {
            background-color: #212b94;
            color: #ffffff;
            transform: translateY(-1px);
        }

        /* Banner Section Layout */
.corporate-banner {
    position: relative;
    display: flex;
    align-items: center;
    color: #ffffff;
    padding-top: 3rem;
    padding-bottom: 3rem;
    min-height: 320px;
    /* Replace 'image_10cc29.png' with your image file path */
    background: url('../../img/Sub-Pages-SRKK.png') no-repeat center center / cover; 
}



/* Bringing the container above the overlay */
.corporate-banner .banner-container {
    position: relative;
    z-index: 2;
}

/* Typography styles */
.corporate-banner .banner-title {
    font-weight: 600;
    margin-bottom: 1rem;
    letter-spacing: -0.5px;
    font-size: calc(1.425rem + 2.1vw); /* Fluid responsive font sizing */
}

/* Custom Action Button styling */
.corporate-banner .banner-btn {
    background-color: #2b45cc;
    color: #ffffff;
    border: none;
    border-radius: 5px;
    padding: 0.5rem 1.5rem;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    transition: background-color 0.2s ease, transform 0.2s ease;
}

/* Quick interactive hover effect */
.corporate-banner .banner-btn:hover {
    background-color: #1e33a3;
    color: #ffffff;
    transform: translateY(-1px);
}

.corporate-banner .banner-btn i {
    font-size: 0.8rem;
}

/* Main purple container block */
.contact-section {
    background-color: #503CED; /* Bright, saturated purple-blue */
    padding: 3.5rem 2rem 4.5rem 2rem; /* Increased bottom padding */
    border-radius: 28px; /* Smooth rounded block container edges */
    overflow: hidden;
}

/* Tracking/Letter spacing on the top title */
.contact-section .contact-subtitle {
    font-size: 0.75rem;
    letter-spacing: 5px; /* Wider tracking to match layout */
    font-weight: 700;
    opacity: 0.9;
    display: block;
    margin-bottom: 1.25rem;
}

/* Header style adjusting spacing */
.contact-section .contact-title {
    font-weight: 600;
    font-size: 2.25rem;
    margin-bottom: 2rem;
}

/* Paragraph spacing and dimensions */
.contact-section .contact-description {
    font-size: 0.85rem;
    max-width: 650px;
    line-height: 1.6;
    opacity: 0.85;
}

/* Card placement alignment spacing wrapper */
.contact-section .contact-card-row {
    margin-top: 2rem;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

/* Dark inner cards proportion tweaks */
.contact-section .contact-card {
    background-color: #1B2032; /* Deeper slate dark theme background */
    border-radius: 18px;
    padding: 2.2rem 2.5rem; /* Generous inside padding to give cards height */
    height: 100%;
    transition: background-color 0.2s ease;
}

/* Clean circular badge clip for iconography */
.contact-section .contact-icon-wrapper {
    background-color: #ffffff;
    color: #503CED; 
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* Text properties inside individual options */
.contact-section .card-heading {
    font-size: 1.4rem;
    font-weight: 600;
    margin-bottom: 0.4rem;
}

.contact-section .card-link {
    color: #ffffff;
    text-decoration: none;
    font-size: 0.85rem;
    opacity: 0.75;
    transition: opacity 0.2s ease;
}

.contact-section .card-link:hover {
    opacity: 1;
}
/* Container Elements */
.historical-prices-section {
    font-family: system-ui, -apple-system, sans-serif;
    color: #333333;
}

/* Date Filtering Layout Options */
.historical-prices-section .filter-label {
    font-size: 0.95rem;
    font-weight: 500;
    color: #1a1a1a;
    margin-right: 0.5rem;
}

.historical-prices-section .filter-text {
    font-size: 0.95rem;
    color: #333333;
}

/* Rounded Input Boxes matching image layout */
.historical-prices-section .date-input {
    background-color: #deebff; /* Soft blue-tinted background */
    border: none;
    border-radius: 10px;
    width: 125px;
    height: 42px;
    color: #0e2b9e;
    font-weight: 600;
    font-size: 0.9rem;
}

.historical-prices-section .date-input::placeholder {
    color: #0e2b9e;
    opacity: 0.8;
}

.historical-prices-section .date-input:focus {
    background-color: #d2e4ff;
    box-shadow: 0 0 0 0.25rem rgba(14, 43, 158, 0.15);
}

/* Dark Navy Primary Action Button */
.historical-prices-section .btn-view {
    background-color: #0f2cbd; /* Clean royal dark blue */
    color: #ffffff;
    font-weight: 500;
    font-size: 0.95rem;
    height: 42px;
    min-width: 105px;
    border-radius: 10px;
    border: none;
    transition: background-color 0.2s ease;
}

.historical-prices-section .btn-view:hover {
    background-color: #0a1f87;
    color: #ffffff;
}

/* Header Text Styling Options */
.historical-prices-section .historical-note {
    font-size: 0.85rem;
    color: #888888;
}

/* Precise Table Column Spacing Borders */
.historical-table {
    border-collapse: collapse;
    width: 100%;
}

.historical-table thead th {
    font-size: 1.1rem;
    font-weight: 700;
    color: #000000;
    border-top: none;
    border-bottom: 2px solid #e5e7eb !important;
    padding: 0.75rem;
}

.historical-table tbody td {
    font-size: 0.95rem;
    color: #1a1a1a;
    padding: 0.85rem 0.5rem;
    border-bottom: 1px solid #edf2f7;
}

/* Vertical grid column dividers only between specific data headers */
.historical-table th:not(:last-child),
.historical-table td:not(:last-child) {
    border-right: 1px solid #1a1a1a; /* Distinct black/dark column divider line */
}

/* Distinct color formatting styles for changes */
.historical-table .text-danger-custom {
    color: #eb5757 !important; /* Soft crimson red */
}

.historical-table .text-success-custom {
    color: #27ae60 !important; /* Soft active vibrant green */
}