/* * Hire Cars Crete — cookie notice skin. * * Replaced public/consent.css (the Klaro consent-WALL skin) on 2026-09-25. The wall's job was to * stop the page: it locked scroll on and dimmed a backdrop over * everything. This has none of that on purpose — no backdrop, no scroll lock, no focus trap. The * page stays fully usable while the notice is on screen, because there is nothing to decide. * * It clears the iOS home indicator via safe-area insets. Sitting ABOVE the homepage's sticky mobile * booking CTA is NOT done here — the bar's height depends on its content and it exists only on some * pages and viewports, so the offset is measured at runtime by public/js/cookie-notice.js * (stackAboveCta). This file must not grow a hard-coded bottom offset that silently disagrees. */ .hcc-cookie-notice { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9000; /* above the page, below any real modal the site opens */ display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; padding: 14px 20px calc(14px + env(safe-area-inset-bottom, 0px)); background: #14161a; color: #f2f3f5; font-size: 13.5px; line-height: 1.5; box-shadow: 0 -2px 14px rgba(0, 0, 0, .28); } .hcc-cookie-notice__text { flex: 1 1 340px; margin: 0; } .hcc-cookie-notice__link { color: #ffd100; /* brand yellow */ text-decoration: underline; } .hcc-cookie-notice__link:hover, .hcc-cookie-notice__link:focus-visible { text-decoration: none; } .hcc-cookie-notice__close { flex: 0 0 auto; min-height: 40px; /* a comfortable tap target on mobile */ padding: 9px 22px; border: 0; border-radius: 6px; background: #ffd100; color: #14161a; font: inherit; font-weight: 600; cursor: pointer; } .hcc-cookie-notice__close:hover { background: #ffdb33; } .hcc-cookie-notice__close:focus-visible { outline: 2px solid #fff; outline-offset: 2px; } @media (max-width: 560px) { .hcc-cookie-notice { font-size: 13px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); } .hcc-cookie-notice__close { width: 100%; } } @media (prefers-reduced-motion: no-preference) { .hcc-cookie-notice { animation: hcc-cookie-notice-in .22s ease-out; } @keyframes hcc-cookie-notice-in { from { transform: translateY(100%); } to { transform: translateY(0); } } }