/*
        * Custom styles to exactly match the Tailwind CSS design.
        * We are overriding some Bootstrap defaults and adding new classes
        * to match colors, border-radius, shadows, and font sizes.
        */
        :root {
            --bs-body-font-family: 'Inter', sans-serif;
            --bs-body-bg: #e5e7eb;
            /* gray-200 */
        }

        body {
            font-family: var(--bs-body-font-family);
            background-color: var(--bs-body-bg);
        }

        /* Custom shadow to match Tailwind's shadow-2xl */
        .shadow-2xl {
            box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
        }

        /* Custom border-radius to match Tailwind's rounded-2xl (1rem) and rounded-xl (0.75rem) */
        .rounded-2xl {
            border-radius: 1rem !important;
        }

        .rounded-xl {
            border-radius: 0.75rem !important;
        }

        /* Matching Tailwind's rounded-lg (0.5rem) for buttons */
        .rounded-lg {
            border-radius: 0.5rem !important;
        }

        /* Custom background colors to match Tailwind's palette */
        .bg-gray-50 {
            background-color: #f9fafb !important;
        }

        .bg-green-50 {
            background-color: #f0fdf4 !important;
        }

        .bg-red-50 {
            background-color: #fef2f2 !important;
        }

        /* Custom border colors */
        .border-gray-200 {
            border-color: #e5e7eb !important;
        }

        .border-green-200 {
            border-color: #bbf7d0 !important;
        }

        .border-red-200 {
            border-color: #fecaca !important;
        }

        /* Custom buttons to match Tailwind's colors */
        .btn-custom-green {
            background-color: #22c55e;
            color: white;
            border: none;
        }

        .btn-custom-green:hover {
            background-color: #16a34a;
            color: white;
        }

        .btn-custom-red {
            background-color: #ef4444;
            color: white;
            border: none;
        }

        .btn-custom-red:hover {
            background-color: #dc2626;
            color: white;
        }

        /* Replicating font sizes */
        .text-2xl {
            font-size: 1.5rem;
            line-height: 2rem;
        }

        .text-xl {
            font-size: 1.25rem;
            line-height: 1.75rem;
        }

        .text-lg {
            font-size: 1.125rem;
            line-height: 1.75rem;
        }

        .text-base {
            font-size: 1rem;
            line-height: 1.5rem;
        }

        .text-sm {
            font-size: 0.875rem;
            line-height: 1.25rem;
        }

        .text-xs {
            font-size: 0.75rem;
            line-height: 1rem;
        }

        /* Text colors */
        .text-gray-400 {
            color: #9ca3af;
        }

        .text-gray-500 {
            color: #6b7280;
        }

        .text-gray-600 {
            color: #4b5563;
        }

        .text-gray-800 {
            color: #1f2937;
        }

        .text-gray-900 {
            color: #111827;
        }

        .text-green-600 {
            color: #16a34a;
        }

        /* Custom text shadow */
        .section-shadow {
            border-bottom: 1px solid rgba(95, 95, 95, 0.162);
            padding-bottom: 0.5rem;
        }
        
        
                /* Custom shadow to match Tailwind's shadow-2xl */
        .shadow-2xl {
            box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
        }

        /* Custom border-radius */
        .rounded-2xl {
            border-radius: 1rem !important;
        }

        .rounded-xl {
            border-radius: 0.75rem !important;
        }

        .rounded-lg {
            border-radius: 0.5rem !important;
        }

        /* Custom background colors */
        .bg-gray-50 {
            background-color: #f9fafb !important;
        }

        /* Custom border colors */
        .border-gray-200 {
            border-color: #e5e7eb !important;
        }

        /* Custom buttons */
        .btn-custom-green {
            background-color: #22c55e;
            color: white;
            border: none;
        }

        .btn-custom-green:hover {
            background-color: #16a34a;
            color: white;
        }

        .btn-outline-custom {
            border: 1px solid #d1d5db;
            color: #374151;
        }

        .btn-outline-custom:hover,
        .btn-outline-custom.active {
            background-color: #f0fdf4;
            border-color: #22c55e;
            color: #16a34a;
        }

        /* Font sizes */
        .text-xl {
            font-size: 1.25rem;
            line-height: 1.75rem;
        }

        .text-lg {
            font-size: 1.125rem;
            line-height: 1.75rem;
        }

        .text-sm {
            font-size: 0.875rem;
            line-height: 1.25rem;
        }

        .text-xs {
            font-size: 0.75rem;
            line-height: 1rem;
        }

        /* Text colors */
        .text-gray-500 {
            color: #6b7280;
        }

        .text-gray-600 {
            color: #4b5563;
        }

        .text-gray-800 {
            color: #1f2937;
        }

        .text-gray-900 {
            color: #111827;
        }

        .text-green-600 {
            color: #16a34a;
        }

        /* Form control overrides */
        .form-control:focus {
            box-shadow: none;
            border-color: #ced4da;
        }

        .form-check-input:checked {
            background-color: #22c55e;
            border-color: #22c55e;
        }

        .form-check-input:focus {
            box-shadow: none;
        }

        .borderless-input {
            border: 0;
            background-color: transparent;
        }

        .borderless-input:focus {
            outline: none;
            box-shadow: none;
        }