/* --- Section Container --- */
.submit-claim-section {
    padding-top: 4rem; /* Equivalent to py-16 */
    padding-bottom: 4rem; /* Equivalent to py-16 */
    background-color: #fff; /* Equivalent to bg-white */
}

/* --- Container for overall content width --- */
.container {
    width: 100%;
    max-width: 72rem; /* Equivalent to mx-auto (assuming default container max-width of 1152px or 72rem) */
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem; /* Equivalent to px-4 */
    padding-right: 1rem;
}

/* Max width wrapper for content inside container */
.submit-claim-inner-wrapper {
    max-width: 64rem; /* Equivalent to max-w-6xl */
    margin-left: auto;
    margin-right: auto;
}

/* --- Section Header --- */
.submit-claim-section .section-header {
    text-align: center;
    margin-bottom: 3rem; /* Equivalent to mb-12 */
}

.submit-claim-section .section-title {
    font-size: 1.875rem; /* Equivalent to text-3xl */
    font-weight: 700; /* Equivalent to font-bold */
    color: #1f2937; /* Equivalent to text-gray-800 */
    margin-bottom: 1rem; /* Equivalent to mb-4 */
}

/* --- Two-Column Grid Layout --- */
.submit-claim-grid {
    display: grid;
    grid-template-columns: 1fr; /* Default to single column on small screens */
    gap: 3rem; /* Equivalent to gap-12 */
    align-items: center; /* Equivalent to items-center */
}

@media (min-width: 768px) { /* md breakpoint */
    .submit-claim-grid {
        grid-template-columns: repeat(2, 1fr); /* Equivalent to md:grid-cols-2 */
    }
}

/* --- Left side: Instructions Column --- */
.instructions-column {
    /* space-y-6 */
}

    .instructions-column > *:not(:last-child) {
        margin-bottom: 1.5rem; /* Equivalent to space-y-6 (6 * 0.25rem = 1.5rem) */
    }

.required-items-title {
    font-size: 1.25rem; /* Equivalent to text-xl */
    font-weight: 600; /* Equivalent to font-semibold */
    color: #1f2937; /* Equivalent to text-gray-800 */
}

/* Required Items List (space-y-4) */
.required-items-list {
    /* Mimics space-y-4 */
}

    .required-items-list > *:not(:last-child) {
        margin-bottom: 1rem; /* Equivalent to space-y-4 */
    }

.item-entry {
    display: flex;
    align-items: flex-start; /* Equivalent to items-start */
    gap: 0.75rem; /* Equivalent to gap-3 */
}

.check-icon {
    height: 1.25rem; /* Equivalent to h-5 */
    width: 1.25rem; /* Equivalent to w-5 */
    color: var(--daikin-blue); /* A representative value for daikin-blue */
    margin-top: 0.125rem; /* Equivalent to mt-0.5 */
    flex-shrink: 0; /* Equivalent to flex-shrink-0 */
    stroke: var(--daikin-blue); /* Ensure icon color applies */
}

.item-text {
    color: #374151; /* Equivalent to text-gray-700 */
}

/* Contact Info Area */
.contact-info-area {
    padding-top: 1.5rem; /* Equivalent to pt-6 */
}

.contact-email-text {
    color: #4b5563; /* Equivalent to text-gray-600 */
    margin-bottom: 1rem; /* Equivalent to mb-4 */
}

.email-link-button {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem; /* Equivalent to gap-3 */
    background-color: var(--daikin-blue); /* A representative value for daikin-blue */
    color: #fff; /* Equivalent to text-white */
    padding: 0.75rem 1.5rem; /* Equivalent to px-6 py-3 */
    border-radius: 0.5rem; /* Equivalent to rounded-lg */
    font-weight: 600; /* Equivalent to font-semibold */
    text-decoration: none; /* Remove underline for links */
    transition: background-color 0.2s ease-in-out; /* Equivalent to transition-colors */
}

    .email-link-button:hover {
        background-color: #001f3f; /* A representative value for daikin-dark-navy */
    }

.mail-icon {
    height: 1rem; /* Equivalent to h-4 */
    width: 1rem; /* Equivalent to w-4 */
    stroke: currentColor; /* Ensure icon color applies */
}

/* --- Right side: Image Column --- */
.image-column {
    /* For md screens and up, this column will implicitly take 1/2 width */
}

.image-frame {
    border-radius: 0.5rem; /* Equivalent to rounded-lg */
    height: 20rem; /* Equivalent to h-80 (80 * 0.25rem = 20rem) */
    overflow: hidden;
    border: 1px solid #e5e7eb; /* Equivalent to border border-gray-200 */
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); /* Equivalent to shadow-sm */
}

.image-frame img {
    width: 100%; /* Equivalent to w-full */
    height: 100%; /* Equivalent to h-full */
    object-fit: cover; /* Equivalent to object-cover */
}


/* MEDIA QUERIES */

@media (max-width: 767px) {

    .email-link-button {
        padding: 0.75rem 1rem;
        word-break: break-all;
        text-wrap: balance;
    }

    .mail-icon {
        min-width: 1rem;
    }
}
/* MEDIA QUERIES END */
