/*
Theme Name: Blocksy Child
Theme URI: https://kamil.lphost.co.uk
Description: Premium Custom Child Theme for Response Recruitment, matching the high-end Chivo/Hanken Grotesk typography and frosted-glass layout design.
Author: Kamil Nagorski
Author URI: https://kamil.lphost.co.uk
Template: blocksy
Version: 1.0.0
License: GPL2
*/

/* Core Custom Utility Styles matching index.html Design Tokens */
:root {
    --color-primary: #ff5103;
    --color-deep-forest: #144b46;
    --color-background: #f9f9f9;
    --color-surface: #ffffff;
    --color-on-surface: #1a1c1c;
}

/* Snap scroll containers matching premium index.html */
.snap-container {
    scroll-snap-type: y mandatory;
    height: 100vh;
    overflow-y: scroll;
    scrollbar-width: none;
    scroll-behavior: smooth;
}
.snap-container::-webkit-scrollbar {
    display: none;
}
.snap-section {
    scroll-snap-align: start;
    height: 100vh;
    width: 100vw;
    flex-shrink: 0;
    overflow: hidden;
}

/* Frosted glass header */
.frosted-header {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    background: rgba(255, 255, 255, 0.85);
}

/* Hanken Grotesk and Chivo overrides */
body {
    font-family: 'Hanken Grotesk', sans-serif;
    background-color: var(--color-background);
    color: var(--color-on-surface);
}

h1, h2, h3, h4, .font-display-xl {
    font-family: 'Chivo', sans-serif;
}

/* ==========================================================================
   Premium Job Board Specific Form Overrides (Preventing Clipping & Enhancing Readability)
   ========================================================================== */

/* 1. Fix placeholder color so it is a beautiful, highly readable lighter green than the background */
#rr-search-keyword::placeholder,
.rr-job-board-wrapper input::placeholder {
    color: #9cd1c9 !important; /* Lighter green/teal */
    opacity: 0.85 !important;
}

#rr-search-keyword::-webkit-input-placeholder,
.rr-job-board-wrapper input::-webkit-input-placeholder {
    color: #9cd1c9 !important;
    opacity: 0.85 !important;
}

#rr-search-keyword::-moz-placeholder,
.rr-job-board-wrapper input::-moz-placeholder {
    color: #9cd1c9 !important;
    opacity: 0.85 !important;
}

#rr-search-keyword:-ms-input-placeholder,
.rr-job-board-wrapper input:-ms-input-placeholder {
    color: #9cd1c9 !important;
    opacity: 0.85 !important;
}

/* 2. Fix select elements to prevent clipped font text at the bottom */
.rr-job-board-wrapper select {
    height: 48px !important; /* Force a comfortable, uniform height */
    line-height: normal !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    padding-left: 16px !important;
    padding-right: 36px !important; /* Keep room for the arrow */
    background-color: #1b5e58 !important;
    color: #ffffff !important;
    border: 1px solid #2b7e75 !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

/* Ensure the text input has matching height and style to look extremely clean and unified */
.rr-job-board-wrapper input[type="text"] {
    height: 48px !important;
    line-height: normal !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    background-color: #1b5e58 !important;
    color: #ffffff !important;
    border: 1px solid #2b7e75 !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
}

/* Styling reset button height as well */
.rr-job-board-wrapper #rr-reset-filters {
    height: 48px !important;
    line-height: normal !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}