@charset "UTF-8";




/* =============================== 
    FIXED SEARCH BOX below NAVBAR 
    ============================= */

.navbar.fixed-top,
.wc-search-bar {
    left: 0;
    right: 0;
    width: auto; /* important: not 100vw */
}


/* search bar wrapper (the thing with z-index:9999) */
.wc-search-bar-bar,
.wc-search-bar-bar.bg-dark {
    left: 0 !important;
    right: 0 !important;
    width: auto !important; /* NOT 100vw */
    max-width: 100% !important;
    box-sizing: border-box;
}

    /* If the input itself was set to 100vw anywhere, kill it */
    .wc-search-bar-bar input,
    .wc-search-bar-bar .form-control {
        max-width: 100%;
    }

.wc-search-bar {
    width: 100%;
    padding: 10px 0;
    z-index: 9999;
}

/* Inner container */
.wc-search-inner {
    position: relative;
    width: 100%;
    max-width: 90%; /* Desktop width */
    margin: 0 auto;
}

    /* Google input box container */
    .wc-search-inner .gsc-input-box {
        border-radius: 40px !important;
        background: #ebebeb !important;
        height: 45px !important;
        display: flex !important;
        align-items: center !important;
        padding-left: 15px !important;
   
        margin:10px 0px;
    }

    /* The actual text input */
    .wc-search-inner input.gsc-input {
        border-radius: 30px !important;
        height: 40px !important;
     
        background: #ebebeb !important;
        padding: 5px 50px 5px 16px !important;
        box-sizing: border-box !important;
        font-size: 16px !important;
    }

/* Hide Google default button */
.gsc-search-button,
.gsc-search-button-v2,
input.gsc-search-button,
td.gsc-search-button {
    display: none !important;
}

/* Your custom search button (magnifier) */
#wc-search-btn {
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #03a08f;
    color: white;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 10;
}

/* Small devices scaling */
@media (max-width: 768px) {
    .wc-search-inner {
        max-width: 95% !important;
    }
}
/* ================================================== 
    GOOGLE SEARCHBOX: FORCE FULL-WIDTH (fix left-stuck input) 
    ================================================ */
.wc-search-inner .gsc-control-searchbox-only,
.wc-search-inner form.gsc-search-box,
.wc-search-inner table.gsc-search-box,
.wc-search-inner table.gsc-search-box td.gsc-input,
.wc-search-inner .gsc-input-box,
.wc-search-inner .gsc-input-box-hover,
.wc-search-inner .gsc-input-box-focus {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Keep your pill styling even when Google switches classes (hover/focus) */
.wc-search-inner .gsc-input-box,
.wc-search-inner .gsc-input-box-hover,
.wc-search-inner .gsc-input-box-focus {
    border-radius: 40px !important;
    background: #ebebeb !important;
    height: 45px !important;
    display: flex !important;
    align-items: center !important;
    padding-left: 15px !important;
    margin: 10px 0;
}

/* Make sure the actual input stretches */
.wc-search-inner input.gsc-input {
    width: 100% !important;
}
.wc-search-inner table.gsc-search-box {
    table-layout: fixed !important;
}

/* ===== FORCE GOOGLE CSE SEARCHBOX TO STRETCH FULL WIDTH ===== */
.wc-search-inner .gsc-control-searchbox-only {
    display: block !important;
    width: 100% !important;
}

.wc-search-inner form.gsc-search-box {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
}

/* Google still outputs a table — make it behave like a flexible item */
.wc-search-inner table.gsc-search-box {
    width: 100% !important;
    flex: 1 1 auto !important;
    margin: 0 !important;
    table-layout: fixed !important;
}

    .wc-search-inner table.gsc-search-box td.gsc-input {
        width: 100% !important;
    }

.wc-search-inner .gsc-input-box,
.wc-search-inner .gsc-input-box-hover,
.wc-search-inner .gsc-input-box-focus {
    width: 100% !important;
}

/* Google injects max-width + margins on the FORM — kill both */
.wc-search-inner form.gsc-search-box {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important; /* remove 0 24px */
}

/* Keep the table/input stretching */
.wc-search-inner table.gsc-search-box,
.wc-search-inner td.gsc-input,
.wc-search-inner .gsc-input-box,
.wc-search-inner .gsc-input-box-hover,
.wc-search-inner .gsc-input-box-focus {
    width: 100% !important;
}
/* kill Google's layout constraints */
.wc-search-inner form.gsc-search-box {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
}

/* control spacing yourself */
.wc-search-inner {
    padding: 0 10px; /* your preferred spacing */
}
    /* Remove Google's built-in magnifier inside the input */
    .wc-search-inner .gsib_a {
        background-image: none !important;
        background: none !important; /* extra safety */
        padding-left: 16px !important; /* remove the 56px icon space */
    }

    /* (optional) if it still looks too indented, tighten more */
    .wc-search-inner .gsib_a {
        padding-left: 10px !important;
    }






/* ===========================
   WORKCRED – GOOGLE CSE RESULTS (CLEAN)
   Works with BOTH CSE markups
   - Markup A: thumb outside gsc-table-result
   - Markup B: thumb inside gsc-table-result
   =========================== */

/* Container sanity */
.search-results-wrapper {
    max-width: 1900px;
    margin: 0 auto;
    padding: 0 1rem;
}

#___gcse_0,
.gcse-searchresults-only,
.gsc-control-cse {
    width: 100% !important;
    max-width: 100% !important;
}

/* Hide right-side stuff Google sometimes injects */
.gsc-refinementsArea,
.gsc-refinementArea,
.gsc-adBlock,
.gsc-adBlockVertical,
.gsc-adBlockNoHeight,
.gsc-adBlockNoHeightSpacer,
td.gsc-refinementsArea,
td.gsc-refinementArea,
td.gsc-adBlock,
td.gsc-adBlockVertical,
td.gsc-adBlockNoHeight,
td.gsc-adBlockNoHeightSpacer {
    display: none !important;
    width: 0 !important;
}

/* Full-width results area */
.gsc-results-wrapper-visible,
.gsc-resultsbox-visible,
.gsc-resultsRoot,
.gsc-results,
.gsc-expansionArea,
.gsc-webResult,
.gsc-webResult .gsc-table-result {
    width: 100% !important;
    max-width: 100% !important;
}

/* Each result row */
.gsc-control-cse .gsc-webResult.gsc-result {
    background: #fff !important;
    border: 0 !important;
    border-bottom: 1px solid #ccc !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Typography */
.gsc-control-cse .gs-result .gs-title,
.gsc-control-cse .gs-result .gs-title *,
.gsc-control-cse .gs-spelling {
    margin-top: 10px !important;
    font-size: 18px !important;
    color: #0354A5 !important;
    font-weight: 400 !important;
    text-decoration: none !important;
}

.gsc-control-cse .gs-webResult .gs-visibleUrl,
.gsc-control-cse .gs-webResult div.gs-visibleUrl {
    color: #0354A5 !important;
    font-size: 16px !important;
}

.gsc-control-cse .gs-snippet {
    color: #222 !important;
    margin-top: 10px !important;
    font-size: 16px !important;
}

/* Pagination */
.gsc-control-cse .gsc-cursor-box {
    margin: 10px 0 !important;
    font-size: 25px !important;
    color: #000 !important;
}

    .gsc-control-cse .gsc-cursor-box .gsc-cursor-page {
        border-color: #666 !important;
        background: #fff !important;
        color: #666 !important;
        font-size: 20px !important;
    }

    .gsc-control-cse .gsc-cursor-box .gsc-cursor-current-page {
        border-color: #0354A5 !important;
        background: #fff !important;
        color: #0354A5 !important;
    }

/* Find more */
.gsc-control-cse .gcsc-find-more-on-google,
.gsc-control-cse .gcsc-find-more-on-google-text {
    margin-top: 10px !important;
    color: #0354A5 !important;
    font-size: 16px !important;
}

/* Safety: isolate from framework defaults */
.gsc-control-cse,
.gsc-control-cse * {
    box-sizing: border-box;
}

    .gsc-control-cse img {
        max-width: none !important; /* Bootstrap/MDB often sets max-width:100% */
        height: auto !important;
    }

    /* ===========================
   LAYOUT: thumbnail LEFT, text RIGHT
   (Works for both CSE markups)
   =========================== */

    /* Make the "main row" a 2-col grid */
    .gsc-control-cse .gs-webResult.gs-result {
       /* display: grid !important;*/
        grid-template-columns: 130px 1fr !important;
        column-gap: 18px !important;
        align-items: start !important;
    }

        /* LEFT column: thumbnail (wherever Google puts it) */
        .gsc-control-cse .gs-webResult.gs-result .gsc-table-cell-thumbnail.gsc-thumbnail,
        .gsc-control-cse .gs-webResult.gs-result .gs-image-box,
        .gsc-control-cse .gs-webResult.gs-result .gs-web-image-box {
            grid-column: 1 !important;
            margin: 10px 0 0 0 !important;
            padding: 0 !important;
        }

        /* Normalize Google default padding that causes top/bottom whitespace */
        .gsc-control-cse .gs-webResult.gs-result .gs-web-image-box {
            padding: 0 !important;
            margin: 0 !important;
            float: none !important;
            text-align: left !important;
        }

        /* Image itself */
        .gsc-control-cse .gs-webResult.gs-result img.gs-image {
            display: block !important;
            width: 120px !important;
            max-width: 120px !important;
            max-height: 120px !important;
            margin: 0 !important;
            border: 0 !important;
        }

        /* RIGHT column: title/url/snippet blocks */
        .gsc-control-cse .gs-webResult.gs-result > .gsc-thumbnail-inside,
        .gsc-control-cse .gs-webResult.gs-result > .gsc-url-top,
        .gsc-control-cse .gs-webResult.gs-result > .gsc-table-result,
        .gsc-control-cse .gs-webResult.gs-result .gsc-table-cell-snippet-close {
            grid-column: 2 !important;
            margin-left: 0 !important;
        }

    /* Kill the duplicate title inside snippet block */
    .gsc-control-cse .gs-webResult .gsc-table-cell-snippet-close .gsc-thumbnail-left {
        display: none !important;
    }

/*====================== 
    Mobile: stack 
========================*/
/*@media (max-width: 576px) {
    .gsc-control-cse .gs-webResult.gs-result {
        grid-template-columns: 1fr !important;
    }

        .gsc-control-cse .gs-webResult.gs-result > *,
        .gsc-control-cse .gs-webResult.gs-result .gsc-table-cell-thumbnail.gsc-thumbnail,
        .gsc-control-cse .gs-webResult.gs-result .gsc-table-cell-snippet-close {
            grid-column: 1 !important;
        }

        .gsc-control-cse .gs-webResult.gs-result img.gs-image {
            width: 180px !important;
            max-width: 180px !important;
        }
}*/

@media (max-width: 576px) {
    .gsc-control-cse .gs-webResult .gsc-table-result {
        grid-template-columns: 1fr !important;
    }

        .gsc-control-cse .gs-webResult .gsc-table-result > * {
            grid-column: 1 !important;
        }

        .gsc-control-cse .gs-webResult .gsc-table-result img.gs-image {
            width: 180px !important;
            max-width: 180px !important;
        }
}



/* ===== FINAL NORMALIZER (handles both Google markups) ===== */

/* Don’t rely on outer grid */
.gsc-control-cse .gs-webResult.gs-result {
    display: block !important;
}

/* Make the inner "table" area the real 2-column layout */
.gsc-control-cse .gs-webResult .gsc-table-result {
/*    display: grid !important;*/
    grid-template-columns: 130px 1fr !important;
    column-gap: 18px !important;
    align-items: start !important;
    width: 100% !important;
}

    /* Left column: thumbnail cell */
    .gsc-control-cse .gs-webResult .gsc-table-result .gsc-table-cell-thumbnail.gsc-thumbnail,
    .gsc-control-cse .gs-webResult .gsc-table-result .gs-image-box,
    .gsc-control-cse .gs-webResult .gsc-table-result .gs-web-image-box {
        grid-column: 1 !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
        text-align: left !important;
    }

    /* Right column: snippet/title cell */
    .gsc-control-cse .gs-webResult .gsc-table-result .gsc-table-cell-snippet-close {
        grid-column: 2 !important;
        margin: 0 !important;
    }

    /* Image itself */
    .gsc-control-cse .gs-webResult .gsc-table-result img.gs-image {
        display: block !important;
        width: 120px !important;
        max-width: 120px !important;
        max-height: 120px !important;
        margin: 0 !important;
    }

    /* Remove Google’s extra padding that creates “air” above/below thumbnails */
    .gsc-control-cse .gs-webResult .gsc-table-result .gs-web-image-box {
        padding: 0 !important;
    }

/* Kill duplicate title inside snippet block */
.gsc-control-cse .gs-webResult .gsc-table-cell-snippet-close .gsc-thumbnail-left {
    display: none !important;
}

/* ===== CSE FINAL OVERRIDE: grid must be on .gsc-table-result ===== */

html body .gsc-control-cse .gs-webResult .gsc-table-result {
    display: grid !important;
    grid-template-columns: 130px 1fr !important;
    column-gap: 18px !important;
    align-items: start !important;
    width: 100% !important;
}

    /* left column */
    html body .gsc-control-cse .gs-webResult .gsc-table-result .gsc-table-cell-thumbnail.gsc-thumbnail {
        grid-column: 1 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* right column */
    html body .gsc-control-cse .gs-webResult .gsc-table-result .gsc-table-cell-snippet-close {
        grid-column: 2 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* remove the “air” around image-box that you saw in DevTools */
    html body .gsc-control-cse .gs-webResult .gsc-table-result .gs-web-image-box,
    html body .gsc-control-cse .gs-webResult .gsc-table-result .gs-image-box {
        padding: 0 !important;
        margin: 0 !important;
        float: none !important;
    }

    /* image size */
    html body .gsc-control-cse .gs-webResult .gsc-table-result img.gs-image {
        display: block !important;
        width: 120px !important;
        max-width: 120px !important;
        max-height: 120px !important;
    }

/* hide duplicate title inside snippet block */
html body .gsc-control-cse .gs-webResult .gsc-table-cell-snippet-close .gsc-thumbnail-left {
    display: none !important;
}

/* mobile stack */
@media (max-width: 576px) {
    html body .gsc-control-cse .gs-webResult .gsc-table-result {
        grid-template-columns: 1fr !important;
    }

        html body .gsc-control-cse .gs-webResult .gsc-table-result > * {
            grid-column: 1 !important;
        }
}
/* FINAL: force layout on the internal CSE container */
html body #___gcse_0 .gsc-results .gsc-webResult .gsc-table-result {
    display: grid !important;
    grid-template-columns: 130px 1fr !important;
    column-gap: 18px !important;
    align-items: start !important;
    width: 100% !important;
}

    /* column placement */
    html body #___gcse_0 .gsc-results .gsc-webResult .gsc-table-result .gsc-table-cell-thumbnail {
        grid-column: 1 !important;
        margin: 0 !important;
    }

    html body #___gcse_0 .gsc-results .gsc-webResult .gsc-table-result .gsc-table-cell-snippet-close {
        grid-column: 2 !important;
        margin: 0 !important;
    }

/* remove extra padding/margins around image box */
html body #___gcse_0 .gs-web-image-box,
html body #___gcse_0 .gs-image-box {
    padding: 0 !important;
    margin: 0 !important;
}

/* image */
html body #___gcse_0 img.gs-image {
    display: block !important;
    width: 120px !important;
    max-width: 120px !important;
    height: auto !important;
}

/* hide duplicate title inside snippet block */
html body #___gcse_0 .gsc-table-cell-snippet-close .gsc-thumbnail-left {
    display: none !important;
}

.gs-result .gs-image, .gs-result .gs-promotion-image {
    vertical-align: top;
    border: none !important;
    
}
html body .gsc-control-cse .gsc-webResult.gsc-result,
html body .gsc-control-cse .gsc-results .gsc-imageResult {
    padding: 0 0 15px 0 !important;
}

/* === Workcred CSE: stable results, no placeholder thumbnails === */

/* Each result line spacing + divider */
.gsc-control-cse .gsc-webResult.gsc-result {
    padding: 18px 0 !important;
    border-bottom: 1px solid #ddd !important;
}

/* Thumbnail: keep it compact and not add mystery space */
.gsc-control-cse .gs-image-box,
.gsc-control-cse .gs-web-image-box {
    margin: 0 14px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* The actual <img> */
.gsc-control-cse img.gs-image {
    display: block !important;
    margin: 0 !important;
    border: 0 !important;
    max-width: 120px !important;
    height: auto !important;
}

/* Snippet: do NOT hard-indent by default */
.gsc-control-cse .gs-snippet {
    margin: 10px 0 0 0 !important;
}

/* If Google leaves a “thumbnail-left” duplicate title inside snippet area, hide it */
.gsc-control-cse .gsc-table-cell-snippet-close .gsc-thumbnail-left {
    display: none !important;
}