/* Site-wide overrides for legacy common.css (loaded after common.css) */

/* common.css forces body{min-width:992px!important} which breaks mobile.
   Override to allow body to shrink to viewport width. */
body {
    min-width: 0 !important;
}

/* Free Quote form fade transitions (used by /js/free-quote.js) */
#freeQuoteFormArea {
    transition: opacity 250ms ease, transform 250ms ease;
}
#freeQuoteFormArea.fq-fade-out {
    opacity: 0;
    transform: translateY(-8px);
}
#freeQuoteFormArea.fq-fade-in {
    opacity: 0;
    transform: translateY(8px);
}

/* Free Quote modal title — marketing-site styling (Muli, bold) */
#freeQuoteModal .modal-title {
    font-family: Muli, sans-serif;
    font-weight: 800;
    font-size: 24px;
    color: #222;
}
#freeQuoteModal .modal-header {
    padding: 1.25rem 1.5rem 1rem;
    border-bottom: 1px solid #eee;
}
#freeQuoteModal .modal-body {
    padding: 1.5rem;
}
/* Inside modal, the "Send us a message" subtitle is redundant — title in header is enough */
#freeQuoteModal #freeQuoteFormArea > .contact-us-form-title:first-child {
    display: none;
}

/* FAQ accordion — minimalist style matching .product-details .accordion */
.faq-accordion .card {
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #dde5ee;
    background: transparent;
}
.faq-accordion .card .card-header {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 1.25rem 0;
    margin: 0;
    user-select: none;
    cursor: pointer;
}
.faq-accordion .card .card-header.caret {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: .5rem;
}
.faq-accordion .card .card-header.caret .card-title {
    line-height: 1.3;
    user-select: none;
}
.faq-accordion .card .card-header.caret:before {
    display: none;
}
.faq-accordion .card .card-header.caret:after {
    position: static;
    display: block;
    border: .125rem solid #ccc;
    border-top: none;
    border-left: none;
    width: .875rem;
    height: .875rem;
    margin: 0;
    transition: transform .2s ease-in, border-color .2s ease-in;
    transform: rotate(45deg) translateY(-5px);
    transform-origin: center center;
    flex-shrink: 0;
}
.faq-accordion .card .card-header.caret[aria-expanded="true"]:after {
    transform: rotate(225deg) translateY(0) translateX(-5px);
}
.faq-accordion .card .card-header a.card-title {
    font-weight: 500;
    font-size: 18px;
    display: inline-block;
    max-width: 90%;
    margin: 0;
    transition: color .2s ease-in;
}
.faq-accordion .card .card-header:hover .card-title {
    color: #0d44db;
}
.faq-accordion .card .card-header:hover.caret:after {
    border-color: #0d44db;
}
.faq-accordion .card .card-body {
    padding: 0;
    background: transparent;
}
.faq-accordion .card .card-body .faq-answer {
    padding: 0 0 1.25rem;
}
.faq-accordion .card .card-body .faq-answer p:last-child {
    margin-bottom: 0;
}

/* Products dropdown spacing.
   common.css gives items padding:3px 40px 15px (18px gap between items) and
   the section header padding:0 (~3px to its first item) — so the header looks
   glued to its group while items sit far apart. Rebalance: even, moderate gap
   between items; a little breathing room below the header; clear separation
   above each header so groups read as groups. */
.navbar-default .navbar-nav .dropdown-menu.product-dropdown-menu .dropdown-item {
    padding: 4px 40px;
}
.navbar-default .navbar-nav .dropdown-menu.product-dropdown-menu .dropdown-text-divider {
    margin: 16px 0 3px;
}
.navbar-default .navbar-nav .dropdown-menu.product-dropdown-menu .dropdown-text-divider:first-child {
    margin-top: 0;
}


