/* ============================================================================ Athens Party 2026 — search.css Selida /search — Google Programmable Search (CSE), port apo to eRadio _css/search.css prosarmosmeno sto AP design (tokens main.css, Google Sans, electric blue). Fortonetai GLOBAL apo to layout_top (oxi mono sti selida): sto SPA to den allazei sto swap, opote page-specific CSS den ginetai. To layout (2 stiles + sticky ad) einai to koino .ap-cols tou main.css. ========================================================================== */ /* ---------------- search field ---------------- */ .apSearch { display: flex; align-items: center; margin: 18px 0 14px; padding: 5px 5px 5px 18px; max-width: 720px; background: #fff; border: 2px solid #d5d5df; border-radius: 999px; transition: border-color 0.15s, box-shadow 0.15s; } .apSearch:focus-within { border-color: var(--ap-primary); box-shadow: 0 0 0 3px rgba(19, 15, 253, 0.12); } .apSearch .apSearch-glass { flex: 0 0 auto; width: 18px; height: 18px; margin-right: 11px; color: #9aa4ad; } .apSearch:focus-within .apSearch-glass { color: var(--ap-primary); } .apSearch input[type="search"] { flex: 1 1 auto; min-width: 0; margin: 0; padding: 11px 8px 11px 0; border: 0; border-radius: 0; background: transparent; font: inherit; font-size: 17px; color: var(--ap-ink); outline: none; -webkit-appearance: none; appearance: none; } .apSearch input[type="search"]::placeholder { color: #9aa4ad; } .apSearch input[type="search"]::-webkit-search-cancel-button { display: none; } .apSearch .apSearch-clear { flex: 0 0 auto; display: none; align-items: center; justify-content: center; width: 30px; height: 30px; margin: 0 4px 0 0; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #9aa4ad; font-size: 20px; line-height: 1; cursor: pointer; transition: background 0.15s, color 0.15s; } .apSearch .apSearch-clear:hover { background: var(--ap-bg-soft); color: var(--ap-ink); } .apSearch.has-text .apSearch-clear { display: flex; } .apSearch .apSearch-go { flex: 0 0 auto; height: 42px; padding: 0 24px; border: 0; border-radius: 999px; background: var(--ap-primary); color: #fff; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; transition: background 0.15s; } .apSearch .apSearch-go:hover { background: #0c09c9; } .apSearch .apSearch-go .apSearch-goIcon { display: none; width: 16px; height: 16px; } /* ---------------- empty state ---------------- */ .apSearch-intro { max-width: 720px; margin: 0 0 22px; font-size: 14px; line-height: 1.6; color: var(--ap-ink-soft); } .apSearch-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; } .apSearch-chips .apSearch-chipsLabel { width: 100%; margin: 0 0 2px; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #b1b1b1; } .apSearch-chips a { display: inline-block; padding: 7px 14px; background: #fff; border: 1px solid #d5d5df; border-radius: 999px; font-size: 13px; font-weight: 500; color: var(--ap-ink-soft); text-decoration: none; transition: 0.15s; } .apSearch-chips a:hover { border-color: var(--ap-primary); color: var(--ap-primary); } /* ============================================================================ CSE — ta apotelesmata tis Google ntymena sto AP design. Ta !important einai anagkaia: to cse.js fernei diko tou stylesheet. ========================================================================== */ .apSearch-results { margin: 0; } .apSearch-results.has-query { min-height: 520px; } .apSearch-results .gsc-control-cse { margin: 0; padding: 0; border: 0; background: transparent; font-family: 'Google Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size: 14px; line-height: normal; letter-spacing: normal; } .apSearch-results .gsc-control-cse * { box-sizing: border-box; } /* to esoteriko (krymmeno) search box tou CSE — den to theloume katholou */ .apSearch-results form.gsc-search-box, .apSearch-results .gsc-search-box, .apSearch-results .gsc-tabsArea, .apSearch-results .gsc-tabsAreaInvisible, .apSearch-results .gsc-refinementsArea, .apSearch-results .gsc-refinementsAreaInvisible, .apSearch-results .gsc-positioningWrapper { display: none !important; } /* I Google kleidonei to .gsc-wrapper se max-width:700px — to spame edo */ .apSearch-results .gsc-results-wrapper-nooverlay, .apSearch-results .gsc-wrapper, .apSearch-results .gsc-results, .apSearch-results .gsc-expansionArea { background: transparent !important; border: 0 !important; padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: none !important; } /* grammi "Peripou X apotelesmata" */ .apSearch-results .gsc-above-wrapper-area { border: 0 !important; padding: 0 !important; margin: 0 0 16px 0 !important; background: transparent !important; } .apSearch-results .gsc-above-wrapper-area-container { width: 100% !important; } .apSearch-results .gsc-result-info { padding: 0 !important; font-family: inherit !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: #9aa4ad !important; } /* ---------------- result cards ---------------- */ .apSearch-results .gsc-webResult.gsc-result, .apSearch-results .gsc-imageResult { margin: 0 0 12px 0 !important; padding: 16px 18px !important; background: #fff !important; border: 1px solid #e4e4ec !important; border-radius: 12px !important; transition: border-color 0.15s, box-shadow 0.15s; } .apSearch-results .gsc-webResult.gsc-result:hover { border-color: #b9b7fa !important; background: #fff !important; box-shadow: 0 3px 12px rgba(17, 17, 22, 0.08); } .apSearch-results .gsc-webResult.gsc-result:after { content: ''; display: table; clear: both; } .apSearch-results .gs-webResult.gs-result { padding: 0 !important; background: transparent !important; border: 0 !important; } .apSearch-results .gsc-table-result, .apSearch-results .gsc-thumbnail-inside, .apSearch-results .gsc-url-top { padding: 0 !important; } /* titlos */ .apSearch-results .gs-title { height: auto !important; overflow: visible !important; text-decoration: none !important; } .apSearch-results a.gs-title, .apSearch-results a.gs-title b, .apSearch-results a.gs-title:visited, .apSearch-results a.gs-title:visited b { font-family: inherit !important; font-size: 19px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ap-primary) !important; text-decoration: none !important; } .apSearch-results a.gs-title:hover, .apSearch-results a.gs-title:hover b { color: #0c09c9 !important; text-decoration: underline !important; } /* breadcrumb / url */ .apSearch-results .gsc-url-top { margin: 5px 0 7px 0 !important; } .apSearch-results .gs-visibleUrl, .apSearch-results .gs-visibleUrl-breadcrumb span { font-family: inherit !important; font-size: 12px !important; color: #7f8b94 !important; } /* snippet */ .apSearch-results .gs-snippet { font-family: inherit !important; font-size: 14px !important; line-height: 1.55 !important; color: #4a5057 !important; } .apSearch-results .gs-snippet b { color: var(--ap-ink) !important; font-weight: 700 !important; } /* thumbnail */ .apSearch-results .gs-image-box { margin: 2px 16px 2px 0 !important; padding: 0 !important; } .apSearch-results .gs-image-box.gs-web-image-box { width: auto !important; } .apSearch-results img.gs-image { width: 96px !important; height: 96px !important; max-width: none !important; max-height: none !important; object-fit: cover !important; border: 1px solid #e4e4ec !important; border-radius: 8px !important; background: var(--ap-bg-soft) !important; padding: 0 !important; } /* xoris apotelesmata / lathos */ .apSearch-results .gs-no-results-result .gs-snippet, .apSearch-results .gs-error-result .gs-snippet { margin: 0; padding: 26px 20px !important; background: #fff !important; border: 1px dashed #d5d5df !important; border-radius: 12px; font-size: 15px; color: var(--ap-ink-soft); text-align: center; } /* promotions */ .apSearch-results .gs-promotion.gs-result { margin: 0 0 12px 0; padding: 16px 18px; background: #f4f4ff !important; border: 1px solid #cfcefc !important; border-radius: 12px; } .apSearch-results .gs-promotion.gs-result a.gs-title, .apSearch-results .gs-promotion.gs-result a.gs-title b { color: var(--ap-primary) !important; } .apSearch-results .gs-promotion.gs-result .gs-snippet { color: #4a5057; } /* diafimiseis (AdSense for Search) */ .apSearch-results .gsc-adBlock { margin: 0 0 12px 0; } .apSearch-results .gsc-adBlock:empty { display: none; } /* ---------------- pagination ---------------- */ .apSearch-results .gsc-cursor-box { margin: 24px 0 0 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: center !important; } .apSearch-results .gsc-cursor { display: inline-flex !important; flex-wrap: wrap; gap: 6px; justify-content: center; } .apSearch-results .gsc-cursor-page, .apSearch-results .gsc-results .gsc-cursor-box .gsc-cursor-page { display: inline-flex !important; align-items: center; justify-content: center; min-width: 38px !important; height: 38px !important; margin: 0 !important; padding: 0 11px !important; background: #fff !important; border: 1px solid #d5d5df !important; border-radius: 8px !important; font-family: inherit !important; font-size: 14px !important; font-weight: 500 !important; color: var(--ap-ink-soft) !important; text-decoration: none !important; cursor: pointer; transition: 0.15s; } .apSearch-results .gsc-cursor-page:hover, .apSearch-results .gsc-results .gsc-cursor-box .gsc-cursor-page:hover { border-color: var(--ap-primary) !important; color: var(--ap-primary) !important; } .apSearch-results .gsc-cursor-page.gsc-cursor-current-page, .apSearch-results .gsc-results .gsc-cursor-box .gsc-cursor-current-page { background: var(--ap-primary) !important; border-color: var(--ap-primary) !important; color: #fff !important; font-weight: 700 !important; } .apSearch-results a.gsc-trailing-more-results, .apSearch-results a.gsc-trailing-more-results:link { color: var(--ap-primary); } /* ---------------- google branding ---------------- */ .apSearch-results .gcsc-more-maybe-branding-root { margin: 22px 0 0 0; padding: 16px 0 0 0; border-top: 1px solid #e4e4ec; } .apSearch-results .gcsc-find-more-on-google { font-size: 13px; color: #7f8b94; } .apSearch-results .gcsc-find-more-on-google-magnifier { fill: #9aa4ad; } /* ---------------- responsive ---------------- */ @media (max-width: 767px) { .apSearch { margin-top: 14px; padding-left: 15px; } .apSearch .apSearch-glass { margin-right: 9px; } .apSearch input[type="search"] { font-size: 16px; padding: 10px 6px 10px 0; } .apSearch .apSearch-go { width: 40px; height: 40px; padding: 0; } .apSearch .apSearch-go .apSearch-goText { display: none; } .apSearch .apSearch-go .apSearch-goIcon { display: inline-block; vertical-align: middle; } .apSearch-results .gsc-webResult.gsc-result { padding: 14px !important; } .apSearch-results a.gs-title, .apSearch-results a.gs-title b { font-size: 17px !important; } .apSearch-results img.gs-image { width: 72px !important; height: 72px !important; } .apSearch-results .gs-image-box { margin-right: 12px !important; } .apSearch-results .gsc-cursor-page, .apSearch-results .gsc-results .gsc-cursor-box .gsc-cursor-page { min-width: 34px !important; height: 34px !important; font-size: 13px !important; padding: 0 9px !important; } } @media (max-width: 479px) { .apSearch-results .gs-snippet { font-size: 13px !important; } .apSearch-results img.gs-image { width: 62px !important; height: 62px !important; } }