/*
Theme Name: OFFICI
Theme URI: https://hivepress.io/themes/rentalhive
Template: rentalhive
Author: Valerian
Author URI: https://valerian.studio
Description: A multipurpose WordPress theme that allows you to build a peer-to-peer rental marketplace.
Tags: left-sidebar,custom-colors,custom-menu,custom-logo,custom-header,featured-image-header,featured-images,footer-widgets,theme-options,threaded-comments,translation-ready
Version: 1.0.7.1753767277
Updated: 2025-07-29 05:34:37
*/

/* ---------------- Fonts ---------------- */
@font-face {
  font-family: 'Brunson';
  src: url('fonts/brunson.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'JustSans';
  src: url('fonts/just-regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Oliver';
  src: url('fonts/Oliver-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ---------------- Global ---------------- */
body {
  background-color: #FCFAF6 !important;
  font-family: "JustSans", sans-serif;
}

h1 {
  color: rgb(41, 41, 41) !important;
  font-family: "Brunson", sans-serif;
}

h2 {
  font-family: "Brunson", sans-serif
}

h2.wp-block-post-title {
  margin-top: 0px !important;
}

p {
  line-height: 1.2 !important;
  color: #0F1727A6 !important;
}

p:not(:last-child) .wp-block-tag-cloud {
  margin-bottom: 0px !important;
}

button {
  box-shadow: none !important;
}

.wp-block-button__link.wp-element-button {
  border-radius: 100px !important;
}

.noptin-block-form {
  max-width: 600px;
  margin: auto;
}

.noptin-block-form-header h2 {
  font-size: 36px;
}

/*.noptin-block-form-footer {
  max-width: 500px;
  margin: auto;
}*/

.wp-block-noptin-email-optin h2,
.wp-block-noptin-email-optin p {
  color: white !important;
}

.wp-block-post-featured-image img {
  height: 300px;
}

img.wp-post-image {
  border-radius: 2px !important;
}

.wp-block-post-template {
  margin: 0px !important;
}

.wp-block-noptin-email-optin {
  margin-top: 120px !important;
  margin-bottom: 60px !important;
  text-align: left;
  border-radius: 20px !important;
}

.noptin_form_submit {
  color: white !important;
  background-color: #F11524 !important;
  font-size: 24px !important;
  font-family: "Oliver", sans-serif !important;
}


.noptin-block-form-header .wp-block-heading {
  text-align: center;
}



.wp-block-post-featured-image img {
  filter: brightness(110%); /* plus bas = plus sombre (ex: 50%) */
}


/* ---------------- Bloc Trouver/Proposer ---------------- */

.find-propose-office h2, .find-propose-office p {
  color: white !important; /*#262626;*/
}

.find-propose-office {
  background-color: #262626;
  margin-bottom: 120px !important;
}

.wp-block-cover.alignwide.is-light.content-section.find-propose-office {
  border-radius: 20px !important;
}

.find-propose-office a {
  font-family: "Oliver", "sans-serif";
}

.post__header { 
  padding-top: 0 !important;
}

@media only screen and (min-width: 48em) {
  .content-column:not(:last-child)::after {

    border-right: 1px solid white;
  }
}


/* ---------------- Newsletter ---------------- */
.hero-block h1 {
  font-size: 5em !important;
}


/* ---------------- Buttons ---------------- */
.button {
  background-color: #F11524 !important;
  color: white;
  border-radius: 2px !important;
  padding: 10px 20px;
  font-weight: 600;
  transition: all 0.3s ease;
}

.wp-block-button__link {
  box-shadow: none !important;
  border-radius: 2px !important;
}

.wp-block-button {
  border-radius: 9999px !important;
}

/* ---------------- Forms ---------------- */
input .hp-field {
  height: 2rem !important;
}


.hp-form--primary {
  border-radius: 2px !important;
}

.hp-form--primary .hp-form__field input[type='text'],
.hp-form--primary .hp-form__field input[type='search'] {
  height: 2rem !important;
  font-size: 0.6875rem !important;
}

.hp-form--listing-search {
  padding: 10px !important;
}

/* ---------------- Header Hero ---------------- */
.header-hero,
.header-hero::before {
  background-color: transparent;
  background-image: none !important;
  color: black;
}

.header-hero__content {
  text-align: center !important;
}

.header-hero .wp-block-columns {
  display: flex;
  justify-content: center;
  text-align: center;
}

.footer-flex {
  display: flex;
  flex-direction: column;           /* orientation verticale */
  justify-content: space-between;   /* espace entre desc, links, copyright */
  min-height: 40vh;                 /* utile pour que space-between soit visible */
  align-items: center;
  /* ou: min-height: 100%; selon ta structure de footer */
}

.footer-desc {
  width: 60vw;
  margin-bottom: 40px;
}

/* Colonne centrale de liens en 3 colonnes flex */
.footer-links {
  display: flex;
  flex-direction: row;
  width: 60vw !important;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 40px;/*

  
  align-items: flex-start;          
  gap: 24px;
  flex-wrap: wrap;  */                
}



.footer-middle-menu {
  text-align: left;
}

.footer-right-menu {
  text-align: left;
}

/* Chaque colonne occupe au moins 220px et peut grandir 
.footer-links > div {
  flex: 1 1 220px;
}

.footer-links h4 {
  margin: 0 0 8px 0;
  font-size: 16px;
}*/

.footer-links h4 {
  margin: 0 0 8px 0;
  font-size: 16px;
}

.site-footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.site-footer li {
  margin: 6px 0;
}

.site-footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.site-footer a {
  text-decoration: none;
}

.footer-copyright {
  text-align: center;
  margin-top: 80px;
}

.footer-copyright-text {
  font-size: 0.9em;
}

.footer-copyright-text img {
  width: 48px;
}

@media (max-width: 768px) {
  .footer-links,
  .footer-desc,
  .div-contact {
    width: 80vw !important;
    margin-left: auto;
    margin-right: auto; /* pour centrer */
  }
}


.noptin_form_description {
  color: white !important;
}

.noptin_form_input_email::placeholder {
  color: gray;
  opacity: 1;  /* important pour forcer certains navigateurs */
}

.noptin_form_input_email {
  border-bottom: 1px solid white !important;
  border-radius: 0px !important;
}

@media only screen and (min-width: 48em) {
  .header-hero--large {
    padding-top: 3rem;
    padding-bottom: 4rem;
  }
}

/* ---------------- Layout ---------------- */
@media only screen and (min-width: 75em) {
  .container {
    width: 90vw !important;
  }
}

.tagcloud {
  justify-content: center !important;
  text-align: center !important;
}

.header-navbar:last-child {
  box-shadow: none !important;
}

/* ---------------- Listings ---------------- */
.hp-listing--view-block {
  border-radius: 2px !important;
}

.hp-listing--view-block .hp-listing__categories a {
  background-color: rgba(255, 255, 255, 1);
  color: #101010 !important;
}

.hp-listing--view-block .hp-listing__attributes--primary .hp-listing__attribute {
  font-size: 0.8rem !important;
}

.hp-listing__image {
  border-bottom-left-radius: 2px !important;
  border-bottom-right-radius: 2px !important;
}

.hp-listing__image img {
  box-shadow: none !important;
  background: none !important;
}

.hp-listing__image::before,
.hp-listing__image::after {
  display: none !important;
}

/* Fix margins in Listing pages */
.hp-template--listing-view-page .hp-page__header:not(:last-child) {
  margin-bottom: inherit;
}

.hp-listing--view-page .hp-listing__title:not(:last-child) {
  margin-bottom: inherit;
}

/* ---------------- Vendor Card ---------------- */
.hp-vendor__attribute--languages,
.hp-vendor__attribute--services,
.hp-vendor__attribute--listing-count {
  display: none;
}

/* ---------------- Content ---------------- */
.content-section {
  border-radius: 2px !important;
}

/* ---------------- Articles ---------------- */
.article-card-container {
  border-radius: 2px;
  background-color: white !important;
  min-height: 100px;
  box-shadow: 0 5px 30px rgba(7, 36, 86, 0.075);
}

.article-card-content-container {
  padding: 15px;
}

/* ---------------- Footer ---------------- */
.footer-widgets:not(:last-child) {
  border-bottom: none;
}

.site-footer {
  background-color: #FCFAF6;
  height: 50vh;
}

.site-footer a {
  color: black !important;
}


.site-footer .widget__title,
.site-footer li,
.site-footer a,
.widget_nav_menu li::before,
.widget_categories li::before {
  color: black !important;
}

/* ---------------- Blocks ---------------- */
.wp-block-cover__image-background {
  display: none;
}

/* ---------------- Logo ---------------- */

/* Taille par défaut du logo */
.site-header .custom-logo {
  height: 48px;          /* ajuste la hauteur voulue */
  width: auto;           /* conserve les proportions */
  max-width: 100%;       /* évite les débordements */
}

/* Aligne proprement le lien contenant le logo */
.site-header .custom-logo-link {
  display: inline-flex;
  align-items: center;
  line-height: 0;        /* supprime l’espace vertical */
}

.site-header a {
  font-family: "Brunson", sans-serif;
  font-size: 24px;
}

/* Variante : taille différente sur desktop */
@media (min-width: 1024px) {
  .site-header .custom-logo {
    height: 64px;
  }
}

/*** Page Reveal ***/

#page-reveal{
  position: fixed;
  inset: 0;
  background: #FCFAF6;
  z-index: 9999;
  transform: translateY(0);
  animation: reveal-up 0.9s cubic-bezier(.65,0,.35,1) 2s forwards;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

@keyframes reveal-up {
  to { transform: translateY(-100%); }
}

.typewriter{
  display:inline-block;
  overflow:hidden;
  white-space:nowrap;
  letter-spacing:.05em;
  border-right:.15em solid #000;
  width:0ch;                           /* part de 0 caractère */
  font-variant-ligatures:none;         /* évite les ligatures qui faussent le comptage */
  animation:
    typing 1.5s steps(24, end) forwards, /* 24 = nb de caractères visibles */
    caret-hide 0s linear 6s forwards;  /* cache le curseur à la fin */
}

@keyframes typing{
  from{ width:0ch; }
  to{   width:24ch; }                   /* même valeur que dans steps() */
}


@keyframes caret-hide{
  to{ border-right-color: transparent; }
}


.hero-sentence {
  font-family: "Oliver", sans-serif;
  font-size: 20px;
}

.site-content {
  padding-top: 0px !important;
}

.site-footer h4 {
  font-family: "Oliver", sans-serif;
  font-size: 24px;
}

.hero-p {
  max-width: 45ch;
  text-align: justify !important;
  font-size: 20px !important;
}

.wp-block-cover, .wp-block-cover-image {
  min-height: 0px !important;
}

.post__comments {
  display: none !important;
}

.wp-block-group.has-background {
  padding: 20px !important;
}

.article-card-content-container {
  margin-top: 0px !important;
}

body:not(.home) .page__text {
  text-align: justify !important;     /* texte justifié */
  max-width: 700px !important;        /* largeur max pour ne pas avoir de lignes trop longues */
  margin: 0 auto !important;          /* centre le bloc horizontalement */
}

.post__text {
  text-align: justify !important;     /* texte justifié */
  max-width: 700px !important;        /* largeur max pour ne pas avoir de lignes trop longues */
  margin: 0 auto !important;          /* centre le bloc horizontalement */
}

/* --- Dashboard vendeur HivePress : cacher "Commandes reçues" --- */
/* Le lien lui-même */
a[href*="/account/vendor/orders"],
a[href$="/account/vendor/orders/"] { display: none !important; }

/* Si c’est dans une liste/carte, on masque le parent (Chrome/Edge/Safari supportent :has) */
li:has(> a[href*="/account/vendor/orders"]),
.hp-block:has(> a[href*="/account/vendor/orders"]),
.hp-card:has(> a[href*="/account/vendor/orders"]),
.hp-list__item:has(> a[href*="/account/vendor/orders"]) { display: none !important; }

/* --- Dashboard vendeur HivePress : cacher "Commandes reçues" --- */
/* Le lien lui-même */
a[href*="/mon-compte/orders"],
a[href$="/mon-compte/orders"] { display: none !important; }

.menu-item--user-account,
.menu-item--user-login {
  display: none !important;
}

/* Si c’est dans une liste/carte, on masque le parent (Chrome/Edge/Safari supportent :has) */
li:has(> a[href*="/mon-compte/orders"]),
.hp-block:has(> a[href*="/mon-compte/orders"]),
.hp-card:has(> a[href*="/mon-compte/orders"]),
.hp-list__item:has(> a[href*="/mon-compte/orders"]) { display: none !important; }


.hp-listing .hp-page__content {
  margin-top: 40px !important;
}

.error404 .wp-block-image {
  display: none !important;
}

.account-link, .login-link, .account-link-burger-menu, .login-link-burger-menu {
  color:#F11524;
  transition: color 0.3s ease;
}

.account-link:hover,
.login-link:hover,
.account-link-burger-menu:hover,
.login-link-burger-menu:hover  {
  color: #7994BB; /* couleur au survol */
}


/* Texte masqué par défaut */
.account-link, .login-link {
  display: none;
}

@media (min-width: 1200px) {
  .account-link, .login-link {
    display: inline;
  }
}

/* Supprime les blocs de booking (prix + réserver), sur la page d'une annonce */
.hp-form--booking-make, div.hp-listing__topbar.hp-widget.widget.widget--sidebar {
  display: none;
}

.hp-listing__attribute.hp-listing__attribute--nombre-maximal-personnes {
  display: none;
}

.div-contact {
  width: 60vw;
  margin: 100px auto 40px;
}

.div-contact h1 {
  text-align: center;
}

.div-contact button {
  border-radius: 20px !important;
  font-family: "Oliver", "sans-serif";
}

/* Sur pages Annonce & Vendeur, élargir la modale message mais pas la modale login */
.single-hp_listing .hp-modal:not(#user_login_modal),
.single-hp_vendor  .hp-modal:not(#user_login_modal) {
  width: 760px !important;         /* largeur “cible” */
  max-width: 92vw !important;       /* sécurité sur petits écrans */
}

/* Optionnel : plus grand encore sur grands écrans */
@media (min-width: 1024px) {
  .single-hp_listing .hp-modal:not(#user_login_modal),
  .single-hp_vendor  .hp-modal:not(#user_login_modal) {
    width: 900px !important;
  }
}

/* Optionnel : augmenter la zone scrollable interne si besoin */
.single-hp_listing .hp-modal .hp-form,
.single-hp_vendor  .hp-modal .hp-form {
  max-height: calc(90vh - 80px);
  overflow: auto;
}

/* Optionnel : textarea du message (champ "text") plus haut */
.single-hp_listing .hp-modal textarea[name="text"],
.single-hp_vendor  .hp-modal textarea[name="text"] {
  min-height: 220px;
}