/* ============================================================
   PADUR additive stylesheet — DO NOT edit theme CSS files.
   Loaded AFTER style.css / responsive.css on every page.
   ============================================================ */

/* ---------- Bilingual visibility (default lang = fr) ---------- */
html[data-lang="fr"] .lang-en { display: none !important; }
html[data-lang="en"] .lang-fr { display: none !important; }

/* .lang spans are plain inline spans so they inherit heading/button
   typography naturally. Never set display:inherit on them. */
.lang { }

/* ---------- Logo sizing (owner asked for a larger logo, x3) ---------- */
.main-header .logo-box img {
    max-height: 120px;
    width: auto;
}

.stricky-header .logo-box img {
    max-height: 90px;
    width: auto;
}

/* narrower desktops: slightly smaller so the header row never wraps */
@media (min-width: 1200px) and (max-width: 1449.98px) {
    .main-header .logo-box img {
        max-height: 90px;
    }
}

.footer-widget__logo img {
    max-height: 92px;
    width: auto;
}

.mobile-nav__content .logo-box img {
    max-height: 72px;
    width: auto;
}

/* ---------- Language switch (header) ---------- */
.lang-switch {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-right: 14px;
}

.lang-switch button {
    background: transparent;
    border: 1px solid rgba(18, 47, 42, 0.25);
    border-radius: 6px;
    color: var(--donatix-color-1, #122F2A);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    padding: 6px 9px;
    cursor: pointer;
    transition: all .2s ease;
}

.lang-switch button.active {
    background: var(--donatix-base, #FF5528);
    border-color: var(--donatix-base, #FF5528);
    color: #fff;
}

.lang-switch .lang-sep {
    color: rgba(18, 47, 42, 0.4);
    font-size: 12px;
}

/* Login link next to the Donate button */
.main-header__login-box {
    margin-right: 18px;
}

.main-header__login-box a {
    color: var(--donatix-color-1, #122F2A);
    font-size: 15px;
    font-weight: 700;
    transition: color .2s ease;
}

.main-header__login-box a:hover {
    color: var(--donatix-base, #FF5528);
}

/* Language switch inside the mobile nav panel */
.mobile-nav__content .lang-switch {
    margin: 18px 0 0;
}

.mobile-nav__content .lang-switch button {
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
}

.mobile-nav__content .lang-switch button.active {
    background: var(--donatix-base, #FF5528);
    border-color: var(--donatix-base, #FF5528);
}

/* ============================================================
   FUNCTIONAL GLUE ONLY — the theme design itself is untouched.
   The FR|EN switch and Login link live in the dark TOP BAR
   (the theme's main header row keeps its original layout:
   logo + menu + donate button, default sizes).
   ============================================================ */
.main-header__one-top-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.main-header__top-lang {
    display: flex;
    align-items: center;
    gap: 14px;
}

.main-header__one-top .lang-switch {
    margin-right: 0;
}

.main-header__one-top .lang-switch button {
    border-color: rgba(255, 255, 255, 0.35);
    color: #fff;
}

.main-header__one-top .lang-switch button.active {
    background: var(--donatix-base, #FF5528);
    border-color: var(--donatix-base, #FF5528);
    color: #fff;
}

.main-header__one-top .lang-switch .lang-sep {
    color: rgba(255, 255, 255, 0.4);
}

.main-header__top-login {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    transition: color .2s ease;
}

.main-header__top-login:hover {
    color: var(--donatix-base, #FF5528);
}

/* PADUR's menu has 9 items (the demo had 6) — only the gap
   between items is narrowed so the theme's own font size,
   button and heights fit on one row. No other change. */
@media (min-width: 1200px) {
    .main-menu .main-menu__list > li + li,
    .stricky-header .main-menu__list > li + li {
        margin-left: 24px;
    }
}

@media (min-width: 1200px) and (max-width: 1449.98px) {
    .main-menu .main-menu__list > li + li,
    .stricky-header .main-menu__list > li + li {
        margin-left: 15px;
    }

    .main-menu .main-menu__list > li > a,
    .stricky-header .main-menu__list > li > a {
        font-size: 17px;
    }
}

/* ---------- Impact counters: never wrap mid-number ---------- */
.funfact-one__single h2 {
    white-space: nowrap;
}

.funfact-one__single h2 .odometer {
    white-space: nowrap;
}

/* ---------- Footer logo: white plate so the wordmark stays
   readable on the dark footer background ---------- */
.footer-widget__logo img,
.site-footer .logo-box img {
    background: #fff;
    padding: 8px 12px;
    border-radius: 10px;
}

/* ---------- Form success message (padurFormSuccess helper) ---------- */
.form-success {
    display: none;
    background: rgba(26, 104, 91, 0.08);
    border: 1px solid #1A685B;
    border-radius: 12px;
    color: #122F2A;
    font-weight: 600;
    padding: 16px 20px;
    margin-top: 10px;
}

.form-success.is-visible {
    display: block;
}

/* Footer newsletter success reads on dark background */
.site-footer .form-success {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.35);
    color: #fff;
}

/* ============================================================
   PADUR — Projects / News / Gallery / Live additions
   (theme JS already powers ul.post-filter + .filter-layout
   isotope filtering and .img-popup magnific lightbox)
   ============================================================ */

/* Filter pills (gallery) */
ul.post-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 0 45px;
    padding: 0;
    list-style: none;
}

ul.post-filter li {
    cursor: pointer;
    border: 1px solid rgba(18, 47, 42, 0.2);
    border-radius: 30px;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 700;
    color: #122F2A;
    background: #fff;
    transition: all .25s ease;
}

ul.post-filter li:hover,
ul.post-filter li.active {
    background: var(--donatix-color-2, #1A685B);
    border-color: var(--donatix-color-2, #1A685B);
    color: #fff;
}

/* Status badges (project cards) */
.padur-status {
    display: inline-block;
    border-radius: 20px;
    padding: 5px 14px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.padur-status--ongoing {
    background: rgba(255, 85, 40, 0.12);
    color: var(--donatix-base, #FF5528);
}

.padur-status--completed {
    background: rgba(26, 104, 91, 0.12);
    color: var(--donatix-color-2, #1A685B);
}

/* Card blurbs (projects & news) */
.padur-card-blurb {
    margin: 14px 0 0;
}

/* Gallery captions */
.padur-gallery-caption {
    margin: 14px 6px 0;
    font-size: 15px;
    font-weight: 600;
    color: #122F2A;
}

/* Live page */
.padur-live-group {
    margin-bottom: 70px;
}

.padur-live-group:last-child {
    margin-bottom: 0;
}

.padur-live-empty {
    border: 2px dashed rgba(18, 47, 42, 0.2);
    border-radius: 20px;
    background: #F6F3EE;
    padding: 50px 30px;
    text-align: center;
}

.padur-live-empty .icon {
    display: block;
    font-size: 34px;
    color: var(--donatix-base, #FF5528);
    margin-bottom: 12px;
}

.padur-live-empty h3 {
    margin-bottom: 8px;
}

.padur-live-empty p {
    margin: 0;
}

.padur-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 85, 40, 0.12);
    color: var(--donatix-base, #FF5528);
    border-radius: 20px;
    padding: 6px 16px;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-bottom: 16px;
}

/* ============================================================
   PADUR — MOBILE UX LAYER (additive only, ≤991px; the desktop
   design ≥992px is untouched by every rule below)
   ============================================================ */
@media (max-width: 991px) {

    /* Header hamburger: the icon glyph is only 22x27px. Grow the
       tap area to ~46x47px with padding and cancel the layout
       shift with an equal negative margin — the icon does not
       move visually. */
    .main-menu .mobile-nav__toggler {
        padding: 10px 12px;
        margin: -10px -12px;
    }

    /* Mobile drawer close (X): 12x26px glyph. Pad to a 40x46px
       tap box and re-anchor so the glyph stays in the same spot
       (theme places it at top:20px / right:15px). */
    .mobile-nav__wrapper .mobile-nav__close {
        padding: 10px 14px;
        top: 10px;
        right: 1px;
    }

    /* FR|EN buttons inside the drawer were 27px tall — bring the
       tap height to ~43px. */
    .mobile-nav__content .lang-switch button {
        padding: 14px 16px;
    }

    /* iOS-zoom guard: every input a phone visitor can reach must
       be >=16px. The chat pop-up form is 13px and the off-canvas
       sidebar form is 15px in the theme. */
    .chat-popup .chat-form .form-group input[type='text'],
    .chat-popup .chat-form .form-group input[type='email'],
    .chat-popup .chat-form .form-group textarea,
    .xs-sidebar-group .content-inner .form-inner .form-group input[type='text'],
    .xs-sidebar-group .content-inner .form-inner .form-group input[type='email'],
    .xs-sidebar-group .content-inner .form-inner .form-group textarea {
        font-size: 16px;
    }
}


/* Tablet-landscape band (992-1199px): theme also shows the hamburger
   there; same tap-target fix, still invisible at >=1200 desktop. */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .main-menu .mobile-nav__toggler {
        padding: 10px 12px;
        margin: -10px -12px;
    }
}
/* ============================================================
   FORM FIELD VISIBILITY FIX (owner: "typing boxes blend with the
   picture"). The Donatix theme sets inputs to background:transparent
   with a faint 1px border, so any field over a photo/colored section
   becomes invisible. Force a solid white fill + dark text + a clear
   border on every public form control. Dashboards keep their own
   look (restored below).
   ============================================================ */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="date"],
textarea,
select,
.nice-select {
    background-color: #ffffff !important;
    color: #1F1F1F !important;
    border: 1.5px solid #c3cbcf !important;
    -webkit-text-fill-color: #1F1F1F;
}

input::placeholder,
textarea::placeholder {
    color: #6f777c !important;
    opacity: 1 !important;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #6f777c !important;
    opacity: 1 !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus,
.nice-select.open,
.nice-select:focus {
    border-color: #FF5528 !important;
    box-shadow: 0 0 0 3px rgba(255, 85, 40, 0.14) !important;
}

/* custom dropdown (nice-select.js) — used for topic / member-type / donate selects */
.nice-select .list {
    background-color: #ffffff !important;
    border: 1px solid #c3cbcf !important;
}
.nice-select .option {
    color: #1F1F1F !important;
    background-color: #ffffff !important;
}
.nice-select .option:hover,
.nice-select .option.focus,
.nice-select .option.selected.focus {
    background-color: #F6F3EE !important;
}
.nice-select::after {
    border-bottom-color: #1F1F1F !important;
    border-right-color: #1F1F1F !important;
}

/* Dashboards already ship their own visible fields — restore them so
   the global fix above doesn't flatten the disabled/settings look. */
.pd-field input,
.pd-field textarea,
.pd-field select {
    border: 1px solid #e3ded4 !important;
    border-radius: 10px !important;
    color: #122F2A !important;
}
.pd-field input:disabled,
.pd-field textarea:disabled {
    background-color: #faf8f3 !important;
    color: #6b7a77 !important;
}


/* ============================================================
   GLOBAL 80% ZOOM (owner request). The whole site renders uniformly
   at 80% for a tighter, more professional density — identical to a
   browser Ctrl-minus. Applied uniformly so every layout stays intact
   (counter-scaling only the small text overflowed narrow cards).
   ============================================================ */
/* zoom removed 2026-07-18: html{zoom} renders unreliably in Chrome (white strip, overlap, shrunken paint) — site runs at theme-native 100% */


/* ============================================================
   HERO & CURSOR CLEANUP (owner request): remove the cursor-follower
   animation, lighten the heavy dark hero/banner overlay so the photo
   shows (text stays readable), and strip the abstract splash/brush
   shapes on the hero for a clean look.
   ============================================================ */

/* 1) Kill the custom cursor-follower dots; restore the normal cursor */
.custom-cursor__cursor,
.custom-cursor__cursor-two { display: none !important; }
body.custom-cursor,
body.custom-cursor * { cursor: auto !important; }

/* 2) Lighten the HOME hero overlay — was solid dark on the left (opacity 1).
   Keep the left third dark enough for the white headline, clear on the right. */
.main-slider-one--two .main-slider-one__bg::before {
    background: linear-gradient(90deg, rgba(18,47,42,0.76) 0%, rgba(18,47,42,0.34) 46%, rgba(18,47,42,0.04) 85%) !important;
    mix-blend-mode: normal !important;
}

/* 3) Lighten the INNER-PAGE banner overlay (was flat 0.84 dark) */
.page-header__bg::before {
    background: rgba(18,47,42,0.50) !important;
    mix-blend-mode: normal !important;
}

/* 4) Remove the abstract splash / brush / floating shapes on the home hero */
/* hero shapes RESTORED per owner 2026-07-18 (were hidden by earlier cleanup) */

/* Clean inner-page banners too — hide the decorative squiggle/line shapes
   (matches the cleaned home hero; the page title + breadcrumb stay). */
.page-header [class*="shape"] { display: none !important; }
