body {
            margin: 0;
            padding: 0;
            font-family: 'Arial', sans-serif;
            background-color: #f4f4f7;
            color: #333333;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        .email-container {
            max-width: 600px;
            margin: 20px auto;
            background-color: #ffffff;
            border: 1px solid #e0e0e0;
            border-radius: 8px;
            overflow: hidden;
        }

        .header {
            padding: 12px 18px;
            background-color: #ffffff; /* Ledger dark gray/black */
            text-align: left;
        }

        .logo img {
            height: 55px;
            width: 33%;
            vertical-align: middle;
        }

        .content-wrapper {
            padding: 12px 18px;
        }

        .title {
            font-size: 28px;
            font-weight: bold;
            color: #1a1a1a;
            margin-bottom: 25px;
        }

        .illustration-placeholder {
            width: 100%;
            height: 150px; /* Fixed height for the card */
            background-color: #e9ecef; /* Background color for placeholder */
            border-radius: 6px;
            margin-bottom: 30px;
            overflow: hidden; /* Crucial for image to respect border-radius */
            position: relative; /* Needed for absolute positioning of image */
        }
        .illustration-placeholder img {
            position: absolute; /* Position image to fill parent */
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover; /* Ensures image covers the area without distortion */
            display: block;
        }


        .paragraph {
            font-size: 16px;
            line-height: 1.6;
            color: #555555;
            margin-bottom: 20px;
        }

        .details-card {
            background-color: #f8f9fa;
            border-radius: 6px;
            padding: 20px;
            margin-bottom: 30px;
            border: 1px solid #e0e0e0;
        }

        .main-table {
            display: inline-block;
            background-color: #000000 !important;
            color: #ffffff !important;
            padding: 20px 60px;
            border-radius: 8px;
            text-decoration: none;
            font-weight: 600;
            font-size: 16px;
            margin-bottom: 50px;
            /* margin-top: 0; Removed margin-top as padding on .table-box handles spacing */
        }

        .detail-row {
            display: flex;
            justify-content: space-between;
            padding: 12px 0;
            font-size: 15px;
            color: #333333;
        }

        .detail-row + .detail-row {
            border-top: 1px solid #e0e0e0;
        }

        .detail-label {
            color: #555555;
        }

        .detail-value {
            font-weight: 500;
            color: #1a1a1a;
        }

        .table-text {
            border: 1px solid #007bff; /* Ledger-esque cool blue accent for notice */
            border-radius: 8px;
            padding: 20px;
            display: flex;
            align-items: flex-start;
            background-color: rgba(139, 92, 246, 0.5); /* Light blue background */
        }

        .title-main-wrapper {
            margin-right: 15px;
            flex-shrink: 0;
        }

        .title-main {
            width: 24px;
            height: 24px;
            background-color: #8B5CF6;
            color: #ffffff;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            font-size: 16px;
        }

        .text-main .text-title {
            font-size: 17px;
            font-weight: bold;
            color: #000000; /* Darker blue for title */
            margin-bottom: 8px;
        }

        .text-main .main-text {
            font-size: 14px;
            line-height: 1.5;
            color: #333333;
        }
        .text-main .main-text strong {
            color: #0056b3;
        }

        .footer {
            padding: 30px 40px;
            background-color: #f8f9fa;
            text-align: center;
            font-size: 13px;
            color: #6c757d;
            border-top: 1px solid #e0e0e0;
        }

        .footer p {
            margin: 5px 0;
        }

        .footer a {
            color: #007bff; /* Blue for links */
            text-decoration: underline;
        }
        .footer a:hover {
            text-decoration: none;
        }

        /* Responsive adjustments */
        @media screen and (max-width: 600px) {
            .header, .content-wrapper, .footer {
                padding: 20px;
            }
            .title {
                font-size: 24px;
            }
            .paragraph, .detail-row, .text-main .main-text {
                font-size: 14px;
            }
            .text-main .text-title {
                font-size: 16px;
            }
        }