/* Copyright (c) 2025 Laurentian Bank. All rights reserved. */
/* CSS for Contact Us section of the dealer-landing pages. */
.contact-us-section {
    padding-bottom: 20px; /* Add some space at the bottom of the section */
}

.contact-us-section h1 {
    font-size: 24px;
    color: #DA9300;
    /*margin-bottom: 15px;*/
    /* If this is inside page-article which centers its children, and you want H1 left: */
    /* width: 100%; */
    /* text-align: left; */
}

.contact-us-section p {
    /*margin-bottom: 25px;*/
    line-height: 1.6;
    /* If this is inside page-article which centers its children, and you want P left: */
    /* width: 100%; */
    /* text-align: left; */
}

.contact-list {
    /* Container for all contact items */
}

.contact-item {
    display: grid;
    /* Define 3 columns:
       1. Category: Takes more space, flexible.
       2. Labels: Narrower, content-based width.
       3. Details: Takes remaining space, flexible.
       Adjust fractions/widths as needed based on content.
    */
    grid-template-columns: 2fr minmax(80px, auto) 3fr;
    gap: 10px 20px; /* row-gap (not used much here) column-gap */
    padding: 15px 0; /* Vertical padding for each item */
    border-bottom: 1px solid #e0e0e0; /* Thin horizontal line */
    align-items: start; /* Align items at the start of the grid cell (top) */
}

.contact-item:first-child {
    border-top: 1px solid #e0e0e0; /* Add top border to the first item */
}

/* Optional: Remove border from last item if preferred */
/* .contact-item:last-child {
    border-bottom: none;
} */

/* Technical Problem page */
.contact-category,
.contact-labels,
.contact-details {
    /*padding: 5px; !* A little internal padding for the cells *!*/
    line-height: 1.5; /* Good for multi-line content */
    font-size: 13px;
}

.contact-category {
    font-weight: 500; /* Slightly bolder for the category name */
    color: #444;
}

.contact-labels {
    color: #555;
    /* text-align: right; */ /* Optional: if you want labels right-aligned next to details */
}

.contact-details {
    color: #333;
    word-break: break-word; /* Prevents long email addresses from breaking layout */
}

/* Specific styling for the GICs email blank space if needed */
.contact-item:nth-child(3) .contact-details br:first-child {
    /* This targets the first <br> in the GICs contact-details,
       which represents the empty email line.
       You could add height to it if you want to ensure consistent spacing,
       but usually a simple <br> is enough if the line-height is consistent.
    */
    /* content: "\00a0"; /* Non-breaking space if you want some content */
    /* display: block;
    height: 1.5em; /* Match line height */
}
