/* RESET & BASE TYPOGRAPHY */
body {
    margin: 0;
    font-family: Roboto, Arial, sans-serif;
    background: #ffffff;
    color: #000000;
}

/* ===== HEADER AREA ===== */

.header-wrapper {
    display: flex;
    align-items: center;
    padding: 22px 0 12px 160px;  /* aligns with results just like Google */
    gap: 25px;
}

/* Search Box (fake Google bar at the top) */
.search-box-wrapper {
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #dfe1e5;
    border-radius: 24px;
    width: 600px;
    height: 44px;
    padding: 0 14px;
    box-sizing: border-box;
}

.search-input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 16px;
}

.search-icon {
    font-size: 22px;
    color: #70757a;
    cursor: pointer;
}

/* Enhanced by Google logo */
.enhanced-logo {
    height: 60px;
    width: auto;
    margin-top: 2px;
}

/* ===== TABS ROW (Web / Images / News / Maps / Videos) ===== */

.tabs-row {
    padding-left: 160px;
    margin-bottom: 0;
    border-bottom: 1px solid #dadce0;
}

.tabs {
    display: flex;
    gap: 28px;
    padding-bottom: 6px;
}

.tab {
    text-decoration: none;
    font-size: 14px;
    color: #5f6368;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.tab.active {
    color: #1a73e8;
    font-weight: 500;
}

/* ===== RESULTS WRAPPER ===== */

.results-wrapper {
    padding-left: 160px;
    padding-top: 14px;
    max-width: 680px;
    padding-bottom: 40px;
}

/* Make the CSE container inherit the white background and width */
.results-wrapper .gsc-control-cse {
    background: #ffffff !important;
    border: none !important;
    padding-left: 0 !important;
}

/* Remove any extra border / box around results */
.gsc-control-cse, .gsc-results-wrapper-visible {
    background: #ffffff !important;
    border: none !important;
}

/* Hide Google’s own tab headers (we use our custom tabs) */
.gsc-tabsArea,
.gsc-tabsArea > div,
.gsc-tabHeader {
    display: none !important;
}

/* ===== ORGANIC RESULT TITLES (Google deep blue) ===== */
/* This is the important part that makes titles look like real Google */

.gsc-result .gs-title,
.gsc-result .gs-title * {
    color: #1a0dab !important;   /* Google blue */
    text-decoration: none !important;
}

/* Visited variant – slightly purple (like Google) */
.gsc-result .gs-title:visited,
.gsc-result .gs-title:visited * {
    color: #660099 !important;
}

/* ===== SNIPPETS & META ===== */

.gs-snippet {
    line-height: 1.5;
    font-size: 14px;
    color: #3c4043;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Result URL (green-ish) – optional but close to Google */
.gsc-url-top, .gsc-url-bottom {
    color: #202124;
    font-size: 12px;
}

/* Fix long titles / “Hotel” overflow issues */
.gsc-result-info,
.gsc-above-wrapper-area,
.gsc-resultsbox-visible,
.gs-title,
.gs-bidi-start-align {
    overflow: visible !important;
}

/* Space between top info line and first result */
.gsc-above-wrapper-area {
    margin-bottom: 10px !important;
}

/* Remove extra borders between results */
.gsc-webResult.gsc-result {
    border: none !important;
}

/* Small tweaks to make pagination line up better */
.gsc-cursor-box {
    margin-top: 20px;
}