/* =========================================
   1. Header & Global Styles
   ========================================= */
.Header__globalSearchAlt {
    width: 60%;
    margin: 0 auto;
    display: none;
    border: 0.0625rem solid #e9e9e9;
    border-radius: 0.3125rem;
    margin-right: 15%;
}


.Header__navopen .Header__navbar .Header__tabsTab {
     border-bottom: 0px;
}
.commonStyle__zt3breadCrumbBg {
    background: #6e6d6c;
}

.BreadCrumbs__breadcrumbsView ul li + li:before {
    content: "\A0\A0/\A0\A0";
    color: #fff;
}

.BreadCrumbs__breadcrumbsView ul li:last-child {
    color: #ffffff;
    font-family: 'Latobold', sans-serif;
}

.commonStyle__zt3breadCrumbText {
    color: #fff;
}

.Header__homeContent.Header__homeNavbarFixed .Header__navbar {
    background-color: #3c3c3c;
}

.Header__homeNavbarFixed .Header__menu, .Header__homeNavbarFixed .Header__menu:after, .Header__homeNavbarFixed .Header__menu:before {
    background-color: #ffffff;
}

.Header__menu, .Header__menu:after, .Header__menu:before {
    background-color: #ffffff;
}

.Header__container {
    padding: 0 0.9375rem;
    margin: auto;
    max-width: 80rem;
    transition: all 250ms ease;
}

.Header__logo img {
    max-height: 4.3rem;
    display: block;
}

.Header__homeNavbarFixed .Header__navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    -webkit-box-shadow: 0 .3125rem .625rem 0 rgba(0, 0, 0, .0785);
    box-shadow: 0 .3125rem .625rem 0 rgba(0, 0, 0, .0785);
    line-height: 26.6px;
}

@media only screen and (min-width: 769px) {
    .Header__homeNavbarFixed .Header__navbar .Header__logo img {
        max-height: 4.0rem;
    }
}

.Header__navopen .Header__navbar .Header__menuTab {
    background-color: #3c3c3c;
}

.Header__navopen .Header__navbar .Header__tabsTab {
    border-bottom: 0.0625rem solid #ffffff1c;
}

.Header__homeContent .Header__navbar {
    background-color: #3c3c3c;
}

.Header__defaultContent .Header__navbar {
    background-color: #3c3c3c;
}

.Header__tabs__link {
    color: #fff
}

.Header__tabsTab {
    color: #fff;
}

.LoginDetail__tabLink {
    color: #fff;
    text-decoration: none;
}

.Header__menu, .Header__menu:after, .Header__menu:before {
    background-color: #000;
}

#userPreference, #portal_tabsignup {
    display: none;
}

.Layout__oneColumn, .Layout__twoColumn, .Layout__twoColumn2, .Layout__twoColumnReverse {
    max-width: 80rem;
    min-height: 75vh;
    padding: 2.125rem 0 3.125rem;
    transition: max-width 200ms ease;
    background-color: white;
}

.Layout__oneColumn .Layout__layout1, .Layout__twoColumn .Layout__layout1, .Layout__twoColumn .Layout__layout2, .Layout__twoColumn2 .Layout__layout1, .Layout__twoColumn2 .Layout__layout2, .Layout__twoColumnReverse .Layout__layout1 {
    padding: 0 1.9375rem;
}

.commonStyle__zt3Link {
    color: #000;
}

.Header__tabsTab.Header__active, .Header__homeNavbarFixed .Header__navbar .Header__tabsTab.Header__active {
    border-bottom: 0.1875rem solid #e46317;
    color: #e46317;
    line-height: 2.3rem;
}

.Header__homeContent .Header__searchSection {
    padding: 8.250rem 0;
    display: block;
}

.Button__footerBtn {
    border: 1px solid transparent;
    letter-spacing: normal;
    padding: 0.7rem 1rem;
    font-size: 1.0005rem;
    border-radius: 2rem;
    background: #e46317;
    transition: all .15s ease;
    color: #FFF;
}

.Button__footerBtn:hover {
    background: #636363;
}

.Icon__brand {
    color: #e46317;
}

.commonStyle__zt3Brand {
    color: #e46317;
}

.commonStyle__zt3BrandBg {
    background-color: #e46317;
}

.KbCategory__box {
    background-color: #f3f5f7;
}

/* =========================================
   2. SUITES / PRODUCT CARDS (1-5-1 FIXED)
   ========================================= */

/* Main Wrapper for the Widget */
.displax-widget-wrapper {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 50px auto;
    display: block;
}

/* Heading: "Need Help With?" */
.hz_mainHeading {
    font-size: 38px !important;
    font-weight: 700 !important;
    text-align: center !important;
    margin-bottom: 30px !important;
    color: #333 !important;
    padding-top: 1.5em;
    width: 100%;
    display: block;
}

/* Row Container (Centers items for 1-5-1 Layout) */
.sp_row_center {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    margin-bottom: 20px !important;
}

/* The Card Box Design */
.bundle_div, .sp_gettingstarted {
    display: flex !important;
    flex-direction: column !important; /* Forces vertical stacking */
    align-items: center !important;
    justify-content: center !important;
    
    width: 173px !important;
    height: 160px !important; /* Fixed height ensures uniformity */
    margin: 10px !important;
    padding: 10px !important;
    
    background-color: #fff !important;
    box-shadow: 0 0 1px #bfbfbf !important;
    border-top: 3px solid transparent !important;
    position: relative !important;
    transition: all 0.3s ease !important;
    float: none !important;
}

/* Hover Animation */
.bundle_div:hover {
    box-shadow: 0px 0px 25px #e8e8e8 !important;
    transform: translateY(-5px) !important;
    z-index: 10 !important;
    border-color: #e46317 !important;
}

/* Icon Fix (Stops Overlap) */
.sp_suite_logo {
    display: block !important;
    position: relative !important;
    width: 60px !important;
    height: 60px !important;
    margin: 0 0 15px 0 !important; /* Space below icon */
    background-image: url('https://support.displax.com/galleryDocuments/edbsnc4fb1a302fee8ce5f4a363e5a57267c0c3e024b162b932dbfd89d7467c53aca6dacc369d65e7c8c364cceebe6db51a5288a52f88c9fdcd3d75ae5755475b9df8?inline=true') !important;
    background-size: 500px !important;
    background-repeat: no-repeat !important;
    left: auto !important;
    top: auto !important;
}

/* Title Fix (Prevents Cut Off Text) */
.sp_suites_title {
    display: block !important;
    font-family: 'Latobold', sans-serif !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    color: #333 !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-align: center !important;
    width: 100% !important;
    margin: 0 !important;
}

/* Sprite Positions */
.sp_gettingstarted .sp_suite_logo { background-position: -3px -3px !important; }
.sp_mesh .sp_suite_logo { background-position: -268px -3px !important; }
.sp_tile .sp_suite_logo { background-position: -69px -3px !important; }
.sp_tilepro .sp_suite_logo { background-position: -334px -3px !important; }
.sp_connect .sp_suite_logo { background-position: -134px -3px !important; }
.sp_service .sp_suite_logo { background-position: -201px -3px !important; }
.sp_objectrecognition .sp_suite_logo { background-position: -403px -3px !important; }

/* Link Overlay */
a.bundle_anchor {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: transparent !important;
}

/* =========================================
   3. Footer & Other Site Widgets (RESTORED)
   ========================================= */

.Footer__footerBg {
    background: #363839;
    padding: 1.875rem 0;
}

.Footer__footerQus {
    font-size: 1.875rem;
    color: #fff;
}

.Footer__footerDescription {
    font-size: 1rem;
    color: #fff;
}

.commonStyle__zt3BrandBg {
    background-color: #3c3c3c;
}

/* Sub Menu / Product List Tabs */
.sectionselecttab {
    border-bottom: 2px solid #f8f2ee;
    background-color: #fef3ed;
}

.zc-product-list-tab {
    max-width: 900px;
    margin: 0 auto;
}
.zc-product-list-tab ul {
    list-style: none;
    display: flex;
    justify-content: center;
    margin: 0px;
    padding: 0px;
}
.zc-product-list-tab li {
    text-align: center;
    min-width: 16%;
    position: relative;
    transition: all 0.5s;
    padding-right: 30px;
    padding-left: 30px;
}
.zc-product-list-tab li:before {
    content: '|';
    position: absolute;
    right: 0px;
    top: 10px;
    color: #e5e3e1;
}
.zc-product-list-tab li:last-child:before {
    content: '';
    position: absolute;
    right: 0px;
    top: 10px;
    color: #e5e3e1;
}
.zc-product-list-tab li a {
    padding: 10px 0px;
    display: inline-block;
    color: #555;
    transition: all 0.5s;
}
.zc-product-list-tab li:hover a, .zc-product-list-tab li.tab-active a {
    color: #f25810;
}
.zc-product-list-tab li.tab-active a {
    border-bottom: 3px solid #f25810;
}

/* Home Page Widgets (Hz Rows) */
.hz_row br {
    display: none;
}
.hz_row {
    display: flex;
    flex-wrap: wrap;
    max-width: 1170px;
    margin: 0 auto;
    padding: 3em 0 0;
}
.hz_col1 {
    padding: 0 20px;
    width: 40%;
    box-sizing: border-box;
}
.hz_heading {
    font-size: 38px;
    font-weight: 700;
    line-height: 1.24;
    margin-bottom: 15px;
}
.hz_description {
    line-height: 2;
    margin-top: 18px;
    font-size: 18px;
}
.hz_button {
    margin-top: 35px;
    border: 1px solid #fa6a11;
    padding: 12px 16px;
    display: inline-block;
    border-radius: 3px;
    font-size: 18px;
    cursor: pointer;
    font-weight: 700;
    background-color: #fa6a11;
    color: #fff;
    text-decoration: none;
}
.hz_col2 {
    background-size: 425px;
    width: 60%;
    background-position: center;
    background-repeat: no-repeat;
}

@media only screen and (max-width: 1399px) {
    .hz_col1 { width: 55%; }
    .hz_col2 { width: 45%; background-size: 400px; }
}
@media only screen and (max-width: 1023px) {
    .hz_row { padding: 1em 0; }
    .hz_heading, .hz_mainHeading { font-size: 28px; }
    .hz_mainHeading { margin-bottom: 2.5rem; }
    .hz_col1 { width: 100%; padding: 0 30px; text-align: center; }
    .hz_col2 { min-height: 240px; width: 100%; background-position: center 0; background-size: 250px; margin-bottom: 15px; }
    .hz_colBg3 { background-size: 340px; }
    .hz_rowOdd { flex-direction: column-reverse; }
}

/* Support Container */
.sp_support_container1 {
    padding: 180px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-evenly;
    margin: 0 auto;
}
.sp_support_cell {
    width: 29%;
    display: flex;
    align-items: flex-start;
}
.sp_support_title {
    font-size: 24px;
    font-weight: bold;
}
.sp_support_description {
    line-height: 1.7;
    margin: 15px 0 20px;
    font-size: 18px;
}
.sp_support_link {
    color: #f36523;
    font-size: 16px;
    cursor: pointer;
    text-decoration: underline;
}

/* Knowledge Base Categories (Fixed Syntax) */
.KbCategory__box {
    background-color: #ffff;
    border-radius: 0.4375rem;
    border: 0.0625rem solid rgba(0, 0, 0, 0.07);
    height: 250px;
    padding: 0rem;
}

.KbCategory__topic a {
    font-family: "Latoregular", sans-serif;
    line-height: 70px;
    font-size: 17px;
    padding-left: 15px; /* Fixed: was padding: left */
    background-color: #ffff;
    border-radius: 0.4rem;
}

.KbCategory__topicContent {
    font-weight: 300;
    line-height: 1.23rem;
    max-height: 6.875rem;
    overflow: hidden;
    color: #333;
    margin-left: -65px;
}

.Header__tabsTab {
    line-height: 2.3rem; /* Adjusted for alignment */
}

.Avatar__xmedium {
    width: 4.75rem;
    height: 4.75rem;
    margin-top: -3.25px;
}

.Header__globalSearch {
    width: 60%;
}

code {
    overflow: auto;
    clear: both;
    word-wrap: normal;
    display: block;
    line-height: 1.5em;
    background-color: hsl(0deg 0% 13%);
    padding: 7px 15px 7px 15px;
    border-radius: 7px;
    margin: 0 1px;
    font-family: Menlo, Consolas, Monaco, "Andale Mono", Courier, Verdana, sans-serif;
    color: #ffffff;
}

.normaluserprompt {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: #999;
}

/* =========================================
   SPACING & GEOMETRY FIXES
   ========================================= */

/* 1. Reduce the forced height of the main container */
/* Was 75vh, which forced the footer way down. Now it adapts to content. */
.Layout__oneColumn, 
.Layout__twoColumn, 
.Layout__twoColumn2, 
.Layout__twoColumnReverse {
    min-height: 40vh !important; 
    padding-bottom: 0 !important; /* Remove extra bottom padding */
}

/* 2. Tighten the "Get in Touch" / Support Section */
/* Was 180px padding. Reduced to 50px for a cleaner look. */
.sp_support_container1 {
    padding: 50px 0 80px 0 !important;
    margin-top: 0 !important;
}

/* 3. Balance the "Need Help With?" Heading */
.hz_mainHeading {
    margin-bottom: 20px !important;
    padding-top: 40px !important; /* Adds nice breathing room from the search bar */
}

/* 4. Adjust the Product Widget Wrapper */
.displax-widget-wrapper {
    margin-bottom: 20px !important; /* Reduces gap between buttons and "Get in Touch" */
}

/* 5. Ensure the Support Columns alignment */
.sp_support_cell {
    margin-bottom: 30px; /* Adds breathing room on mobile */
}