/*
Theme Name: Broker Fermieri
Theme URI: https://brokerulfermierilor.cfro.ro
Author: Clubul Fermierilor Romani
Description: Tema custom pentru brokerulfermierilor.cfro.ro, migrata din exportul static al site-ului.
Version: 1.0
Text Domain: broker-fermieri
*/
/* Sticky footer - neither the export nor cfro.css has this (no min-height
rule anywhere on html/body), because every real page on the original
site was tall enough that it never mattered. It shows up now on the
dead-JotForm replacement pages (Asigura-te devreme, Asigura-ti
Utilajele Agricole): swapping a 539px iframe for a couple lines of text
leaves the page shorter than a typical browser window, so the green
footer ends partway down the viewport with plain white page background
below it instead of filling to the bottom. Harmless on every other
page (already taller than 100vh, so this never engages there) - #page-
content is a plain child of here (the fixed-position header
doesn't participate in body's flow), so flexing body works without
touching the header/footer markup. */
body {
display: flex;
flex-direction: column;
min-height: 100vh;
}
#page-content {
flex: 1 0 auto;
}
footer.engage-footer {
flex-shrink: 0;
}
/* Thank You page: the checkmark image and the heading below it wrap into
separate rows purely because their combined column widths exceed 12
(col-md-4 then col-md-6) - Bootstrap doesn't add a gap between wrapped
rows on its own, so the image touches the heading with no breathing room. */
.thank-you-checkmark {
margin-bottom: 24px;
}
/* Category archive pagination - the original site loaded extra articles via
JS infinite-scroll (no static markup to mirror), so this is a plain
WordPress paginate_links() output styled to match the site's brand color. */
.article-pagination {
display: flex;
justify-content: center;
gap: 0.5rem;
margin: 2rem 0 3rem;
}
.article-pagination .page-numbers {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 2.25rem;
height: 2.25rem;
padding: 0 0.5rem;
border-radius: 4px;
color: #202020;
text-decoration: none;
font-weight: 600;
}
.article-pagination a.page-numbers:hover {
background: #f0f0f0;
}
.article-pagination .page-numbers.current {
background: #ea5455;
color: #ffffff;
}
/* The original "Istoric companie" content used a blank
between
each year's block purely for vertical spacing (dropped on import - see
bf_render_pipe_list() in functions.php); restore the gap directly on the
heading instead. */
.pg-istoric-companie_module-years h2 {
margin-top: 2.5rem;
}
.pg-istoric-companie_module-years h2:first-child {
margin-top: 0;
}
/* Video gallery grid (galerie-asigurari-interviuri, galerie-asigurari-video)
- own minimal styling, not ported from the export: the original gallery
was a Vue/Masonry.js widget (visitor upload + moderation) with no static
CSS worth reusing for a plain read-only grid (see .todo). Thumbnails show
at their natural aspect ratio (not cropped) - YouTube's own hqdefault.jpg
already has letterboxing baked in for some of these videos. */
.bf-video-gallery {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 2rem;
margin: 2rem 0;
}
@media (max-width: 768px) {
.bf-video-gallery {
grid-template-columns: 1fr;
}
}
.bf-video-gallery-play {
display: block;
position: relative;
width: 100%;
padding: 0;
border: 0;
background: #000;
cursor: pointer;
}
.bf-video-gallery-play img {
display: block;
width: 100%;
height: auto;
opacity: 0.85;
}
.bf-video-gallery-play-icon {
position: absolute;
top: 50%;
left: 50%;
width: 4.5rem;
height: 4.5rem;
transform: translate(-50%, -50%);
border-radius: 50%;
background: rgba(0, 0, 0, 0.6);
}
.bf-video-gallery-play-icon::after {
content: "";
position: absolute;
top: 50%;
left: 56%;
transform: translate(-50%, -50%);
border-style: solid;
border-width: 0.9rem 0 0.9rem 1.4rem;
border-color: transparent transparent transparent #ffffff;
}
.bf-video-gallery-description {
margin-top: 0.5rem;
font-size: 0.9375rem;
color: #202020;
}
/* Video modal (bf-video-gallery.js) - opens the clicked video large and
centered, rather than inline in its grid cell. */
body.bf-video-modal-open {
overflow: hidden;
}
.bf-video-modal {
position: fixed;
inset: 0;
z-index: 10000;
display: flex;
align-items: center;
justify-content: center;
padding: 2rem;
background: rgba(0, 0, 0, 0.85);
}
.bf-video-modal-dialog {
position: relative;
width: 100%;
max-width: 960px;
}
.bf-video-modal-dialog iframe {
display: block;
width: 100%;
aspect-ratio: 16 / 9;
border: 0;
}
.bf-video-modal-close {
position: absolute;
top: -2.5rem;
right: 0;
padding: 0;
border: 0;
background: none;
color: #ffffff;
font-size: 2rem;
line-height: 1;
cursor: pointer;
}
/* CF7 forms (Home Protect and future ones): two fixes for cfro.css rules
that assume markup CF7 doesn't produce.
1) .contact-asigurari-form .form-input-container:nth-of-type(n) sets
width:49% + margin:1% per pair - which sums to exactly 100%, so any
sub-pixel rounding wraps the pair to two lines instead of one. A hair
of slack fixes it.
2) cfro.css styles a