/* ===========================================================================
 * jobsearch-taiara.css
 * Harmonisation visuelle WP JobSearch <> charte Ta'iara
 * Charge apres plugin.css / dashboard-main-page.css du plugin pour override.
 * --------------------------------------------------------------------------- */

:root {
  --tp-navy: #16315c;
  --tp-navy-deep: #0d2046;
  --tp-accent: #2ea6a0;
  --tp-accent-deep: #1f7d78;
  --tp-warm: #e7b647;
  --tp-bg-soft: #f7f5ee;
  --tp-border: #e5e1d4;
  --tp-text-muted: #6b7790;
  --tp-danger: #b1311f;
  --tp-danger-soft: #f6e6e3;
}

/* ===========================================================================
 * 1. DASHBOARD KPIs : couleurs uniformes navy + accent gold
 * (avant : vert / violet / cyan, illisible vs charte)
 * --------------------------------------------------------------------------- */
.jobsearch-stats-list-wrap {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 12px !important;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.jobsearch-stats-list-wrap:hover {
  border-color: var(--tp-navy) !important;
  transform: translateY(-2px);
}
.jobsearch-stats-list-wrap h6,
.jobsearch-stats-list-wrap.green h6,
.jobsearch-stats-list-wrap.light-blue h6,
.jobsearch-stats-list-wrap.dark-blue h6 {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
}
.jobsearch-stats-list-wrap span,
.jobsearch-stats-list-wrap.green span,
.jobsearch-stats-list-wrap.light-blue span,
.jobsearch-stats-list-wrap.dark-blue span {
  color: var(--tp-navy) !important;
  font-weight: 800 !important;
}
.jobsearch-stats-list-wrap small {
  color: var(--tp-text-muted) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}
/* Toutes les valeurs KPI en navy pour une lecture homogene (avant : melange
   navy/accent/muted/gold qui parasitait la hierarchie visuelle) */
.jobsearch-stats-list-wrap.dark-blue span {
  color: var(--tp-navy) !important;
}

/* Carte "Nombre total de candidatures" : icone bleue native -> cercle accent
   Ta'iara, layout aere */
.jobsearch-applicants-stats-wrap {
  background: var(--tp-bg-soft) !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 12px !important;
  padding: 18px 16px !important;
}
.jobsearch-applicants-stats-wrap > i.fa-users,
.jobsearch-applicants-stats-wrap > i.fa {
  background: var(--tp-accent) !important;
  color: #fff !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 20px !important;
  margin: 0 auto 10px !important;
  box-shadow: 0 4px 12px rgba(46, 166, 160, 0.22) !important;
}
.jobsearch-applicants-stats-wrap > small {
  display: block !important;
  color: var(--tp-text-muted) !important;
  font-size: 12px !important;
  text-align: center !important;
  margin: 4px 0 !important;
  line-height: 1.35 !important;
}
.jobsearch-applicants-stats-wrap > span {
  display: block !important;
  color: var(--tp-navy) !important;
  font-weight: 800 !important;
  font-size: 28px !important;
  text-align: center !important;
}

/* Legende sous la carte : pastilles colorees harmonisees charte */
.jobsearch-applicants-stats ul {
  list-style: none !important;
  padding: 10px 0 0 0 !important;
  margin: 0 !important;
}
.jobsearch-applicants-stats ul li {
  font-size: 12.5px !important;
  color: var(--tp-navy) !important;
  margin: 5px 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.jobsearch-applicants-stats ul li i.fa-circle {
  font-size: 10px !important;
  width: 10px !important;
  height: 10px !important;
  background: none !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}
/* Couleurs des pastilles selon position (charte : navy / accent / warm / muted) */
.jobsearch-applicants-stats ul li:nth-child(1) i.fa-circle { color: var(--tp-navy) !important; }
.jobsearch-applicants-stats ul li:nth-child(2) i.fa-circle { color: var(--tp-accent) !important; }
.jobsearch-applicants-stats ul li:nth-child(3) i.fa-circle,
.jobsearch-applicants-stats ul li i.fa-circle.light-blue { color: var(--tp-warm) !important; }
.jobsearch-applicants-stats ul li:nth-child(4) i.fa-circle,
.jobsearch-applicants-stats ul li i.fa-circle.dark-blue { color: var(--tp-text-muted) !important; }

/* ===========================================================================
 * 2. GRAPHIQUE DU DASHBOARD : forcer palette discrete (la lib affiche les
 * couleurs via inline-style sur les <path> SVG. On peut tinter les .legends-couleur
 * via les selecteurs de classe genere par Morris/Chart.js)
 * --------------------------------------------------------------------------- */
.jobsearch-stats-graph-keys ul li:nth-child(1) span { background: var(--tp-navy) !important; }
.jobsearch-stats-graph-keys ul li:nth-child(2) span { background: var(--tp-accent) !important; }
.jobsearch-stats-graph-keys ul li:nth-child(3) span { background: var(--tp-warm) !important; }
.jobsearch-stats-graph-keys ul li:nth-child(4) span { background: var(--tp-text-muted) !important; }

/* ===========================================================================
 * 3. BOUTONS "DANGER" (Supprimer le compte, Reinitialiser filtres, Annuler, etc.)
 * Avant : fonds rouges vifs (#fb353f, #e0325f, #ed777d)
 * Apres : ghost / outline subtle
 * --------------------------------------------------------------------------- */
.jobsearch-applyjob-google-btn,
.subs-det-val a.cancel,
.opts-plusminus-sec a.questopt-item-remove,
.short-lidown-icons li.down-cand-dtrash:hover a,
.short-lidown-icons li.down-cand-rejct:hover a {
  background-color: var(--tp-danger-soft) !important;
  color: var(--tp-danger) !important;
  border: 1px solid var(--tp-danger) !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.jobsearch-applyjob-google-btn:hover,
.subs-det-val a.cancel:hover,
.opts-plusminus-sec a.questopt-item-remove:hover {
  background-color: var(--tp-danger) !important;
  color: #fff !important;
}

/* Bouton "Supprimer le compte" dans la sidebar dashboard */
.jobsearch-dashboard-menu-list li.delete-account-list a,
.jobsearch-dashboard-menu-list li a[href*="delete-account"],
.jobsearch-dashboard-menu-list li a[href*="delete_account"],
.jobsearch-dashboard-menu-list li.delete-account a {
  background: var(--tp-danger-soft) !important;
  color: var(--tp-danger) !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
}
.jobsearch-dashboard-menu-list li.delete-account-list a:hover,
.jobsearch-dashboard-menu-list li.delete-account a:hover {
  background: var(--tp-danger) !important;
  color: #fff !important;
}

/* Bouton "Reinitialisez les filtres" */
.jobsearch-reset-filter,
.jobsearch-reset-filters,
.jobsearch-filter-reset,
.jobsearch-search-reset,
input[type="submit"].jobsearch-reset-btn,
.jobsearch-row .jobsearch-rest-search,
.jobsearch-no-listing-found a.jobsearch-rest-search,
.jobsearch-no-result-section .jobsearch-rest-search {
  background: var(--tp-danger-soft) !important;
  color: var(--tp-danger) !important;
  border: 1px solid var(--tp-danger) !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  padding: 10px 18px !important;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.jobsearch-reset-filter:hover,
.jobsearch-reset-filters:hover,
.jobsearch-filter-reset:hover,
.jobsearch-search-reset:hover,
.jobsearch-no-listing-found a.jobsearch-rest-search:hover,
.jobsearch-no-result-section .jobsearch-rest-search:hover {
  background: var(--tp-danger) !important;
  color: #fff !important;
}

/* ===========================================================================
 * 4. TAGS (Secteurs professionnels, Skills, etc.)
 * Avant : tags bleu vif jQuery TagIt default
 * Apres : navy soft, charte respectee
 * --------------------------------------------------------------------------- */
ul.tagit li.tagit-choice {
  background: rgba(22, 49, 92, 0.10) !important;
  background-image: none !important;
  border: 1px solid rgba(22, 49, 92, 0.20) !important;
  color: var(--tp-navy) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  font-weight: 600 !important;
}
ul.tagit li.tagit-choice a.tagit-label {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
}
ul.tagit li.tagit-choice .tagit-close {
  color: var(--tp-navy) !important;
}
ul.tagit li.tagit-choice .tagit-close:hover {
  color: var(--tp-danger) !important;
}
.jobseach-job-skills .tagit-label,
.jobsearch-skill-list li {
  background: rgba(46, 166, 160, 0.12) !important;
  color: var(--tp-accent-deep) !important;
  border: 1px solid rgba(46, 166, 160, 0.30) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
}

/* ===========================================================================
 * 5. CHECKBOXES (modal Gestionnaire, formulaires)
 * Avant : checkboxes vertes/saturees
 * Apres : checkboxes accent navy
 * --------------------------------------------------------------------------- */
.jobsearch-modal input[type="checkbox"],
.jobsearch-modal input[type="radio"],
.user-dashboard-content input[type="checkbox"],
.user-dashboard-content input[type="radio"],
.jobsearch-form input[type="checkbox"],
.jobsearch-form input[type="radio"],
.dashboard-stats-side input[type="checkbox"] {
  accent-color: var(--tp-navy) !important;
}

/* Custom checkbox JobSearch (s'il y en a un style label-checked) */
.jobsearch-checkbox-list label.checked,
.jobsearch-checkbox-list .checked + label,
.jobsearch-permissions-list li.checked,
.jobsearch-permissions-list li input:checked + label {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
}

/* ===========================================================================
 * 6. BOUTONS PRIMAIRES JobSearch (homogeneise tous les boutons en navy)
 * Y compris : "+ Ajouter un gestionnaire", "Paramètres", "Localiser sur la
 * carte", "+ Telecharger une image de banniere"
 * --------------------------------------------------------------------------- */
.jobsearch-button,
.jobsearch-btn,
.jobsearch-blue-btn,
.jobsearch-themecolor-btn,
.jobsearch-themebgcolor,
.jobsearch-button-primary,
.user-dashboard-content .jobsearch-btn-primary,
input[type="submit"].jobsearch-btn,
button.jobsearch-btn,
.jobsearch_apply_job ul li a.jobsearch-applyjob-btn:not(.jobsearch-applyjob-google-btn),
.jobsearch-add-manager-btn,
.jobsearch-locate-map-btn,
.jobsearch-add-package-btn {
  background: var(--tp-navy) !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid var(--tp-navy) !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  padding: 10px 18px !important;
  transition: background 0.15s ease, transform 0.15s ease;
}
.jobsearch-button:hover,
.jobsearch-btn:hover,
.jobsearch-blue-btn:hover,
.jobsearch-themecolor-btn:hover,
.jobsearch-button-primary:hover,
button.jobsearch-btn:hover {
  background: var(--tp-navy-deep) !important;
  transform: translateY(-1px);
  color: #fff !important;
}

/* Boutons "ghost" / "outline" (Telecharger logo, Telecharger image, etc.) */
.jobsearch-upload-banner-btn,
.jobsearch-upload-logo-btn,
.jobsearch-add-media-btn,
.careerfy-userprof-imgupload a,
.jobsearch-add-media-button,
.jobsearch-locate-map-btn.outline,
.jobsearch-typo-wrap .careerfy-add-media-btn {
  background: #fff !important;
  color: var(--tp-navy) !important;
  border: 1px solid var(--tp-navy) !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
  padding: 10px 22px !important;
}
.jobsearch-upload-banner-btn:hover,
.jobsearch-upload-logo-btn:hover,
.jobsearch-add-media-btn:hover {
  background: var(--tp-navy) !important;
  color: #fff !important;
}

/* Icone "+" colore turquoise/teal incoherente dans le bouton "Ajouter un media" */
.jobsearch-add-media-btn i,
.jobsearch-typo-wrap .careerfy-add-media-btn i,
.dashboard-add-media i {
  color: var(--tp-navy) !important;
}

/* ===========================================================================
 * 7. SIDEBAR DASHBOARD (menu navigation utilisateur)
 * --------------------------------------------------------------------------- */
.jobsearch-dashboard-menu,
.jobsearch-dashboard-menu-list,
.jobsearch-employer-dashboard-nav,
.dashboard-side-nav {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 12px !important;
}
.jobsearch-dashboard-menu-list li a,
.jobsearch-employer-dashboard-nav ul li a,
.dashboard-side-nav ul li a {
  color: var(--tp-text-muted) !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
  transition: background 0.15s ease, color 0.15s ease;
}
.jobsearch-dashboard-menu-list li a:hover,
.jobsearch-employer-dashboard-nav ul li a:hover,
.dashboard-side-nav ul li a:hover {
  background: rgba(22, 49, 92, 0.06) !important;
  color: var(--tp-navy) !important;
}
.jobsearch-dashboard-menu-list li.active a,
.jobsearch-dashboard-menu-list li.current a,
.jobsearch-employer-dashboard-nav ul li.active a,
.jobsearch-employer-dashboard-nav ul li.current-menu-item a,
.dashboard-side-nav ul li.active a {
  background: var(--tp-bg-soft) !important;
  color: var(--tp-navy) !important;
  font-weight: 700 !important;
  border-left: 3px solid var(--tp-navy) !important;
}
.jobsearch-dashboard-menu-list li a i,
.jobsearch-employer-dashboard-nav ul li a i {
  color: inherit !important;
}

/* ===========================================================================
 * 8. ONGLETS DE NAVIGATION (l'onglet "Offres de stage" pastille teal)
 * --------------------------------------------------------------------------- */
.careerfy-page-tabs li.active a,
.careerfy-page-tabs li.current a,
.jobsearch-tabs li.active a,
.jobsearch-typo-wrap .careerfy-nav-tabs li.active a {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border-color: var(--tp-navy) !important;
}

/* ===========================================================================
 * 9. CARTES (offre, recruteur, dashboard items)
 * --------------------------------------------------------------------------- */
.jobsearch-employer-grid-wrap,
.jobsearch-job-grid-wrap,
.jobsearch-candidate-grid,
.jobsearch-job-listing,
.jobsearch-employer-listing,
.careerfy-table-layer,
.careerfy-joblisting-plain-wrap,
.careerfy-candidate-grid figure,
.jobsearch_candidate_info,
.jobsearch-stats-graph-wrap {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.jobsearch-employer-grid-wrap:hover,
.jobsearch-job-grid-wrap:hover {
  border-color: var(--tp-navy) !important;
}

/* ===========================================================================
 * 10. FILTRES SIDEBAR (Categorie offre, Profil, Etudes actuelles, etc.)
 * --------------------------------------------------------------------------- */
.jobsearch-filter-options,
.jobsearch-search-aside,
.jobsearch-filter-wrap,
.jobsearch-filter-box,
.jobsearch-list-filter {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 12px !important;
}
.jobsearch-filter-options h4,
.jobsearch-filter-options .filter-title,
.jobsearch-filter-wrap h4,
.jobsearch-search-aside h4 {
  color: var(--tp-navy) !important;
  font-weight: 700 !important;
}

/* Pastilles "0" a droite des labels (compteurs filtres) */
.jobsearch-filter-options li span.count,
.jobsearch-filter-options li .filter-count,
.jobsearch-filter-wrap .count {
  background: rgba(22, 49, 92, 0.08) !important;
  color: var(--tp-text-muted) !important;
  border-radius: 999px !important;
  padding: 2px 10px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

/* Liens "voir +" */
.jobsearch-filter-options .view-more,
.jobsearch-filter-options .show-more,
.jobsearch-show-all,
a.see-more-filter {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.jobsearch-filter-options .view-more:hover,
.jobsearch-filter-options .show-more:hover,
a.see-more-filter:hover {
  color: var(--tp-accent-deep) !important;
}

/* ===========================================================================
 * 11. SELECTS / DROPDOWNS HEADER ("Les plus recents", "20 Par page")
 * --------------------------------------------------------------------------- */
.jobsearch-shortby,
.jobsearch-perpage,
.jobsearch-sort-options,
.jobsearch-list-sort {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 8px !important;
}
.jobsearch-shortby select,
.jobsearch-perpage select {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
}

/* ===========================================================================
 * 12. ICONES "?" D'AIDE (tooltips champs formulaire)
 * Bug observe : pictogramme bleu carre cassé sous "Secteur(s) professionnel(s)"
 * --------------------------------------------------------------------------- */
.jobsearch-tooltip-icon,
.jobsearch-help-icon,
i.fa-question-circle,
i.fa-question,
.jobsearch-icon-question-mark,
.jobsearch-typo-wrap label .icon-question {
  background: transparent !important;
  color: var(--tp-text-muted) !important;
  font-size: 14px !important;
  border: none !important;
  border-radius: 0 !important;
  width: auto !important;
  height: auto !important;
}
/* Si l'icone "?" rouge/bleue casse persiste, force le caractere de fallback */
.jobsearch-tooltip-icon:before {
  content: "?" !important;
  font-family: inherit !important;
  color: var(--tp-text-muted) !important;
  display: inline-block !important;
  width: 18px !important;
  height: 18px !important;
  background: rgba(22, 49, 92, 0.10) !important;
  border-radius: 50% !important;
  text-align: center !important;
  line-height: 18px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

/* ===========================================================================
 * 13. SECTIONS DASHBOARD (cards blanches avec titres en navy)
 * --------------------------------------------------------------------------- */
.jobsearch-typo-wrap .dashboard-main-page-section,
.jobsearch-dashboard-section,
.user-dashboard-content section,
.user-dashboard-content .section-box,
.dashboard-stats-side,
.jobsearch-section-title,
.dashboard-typo-section {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.jobsearch-typo-wrap .dashboard-main-page-section h2,
.jobsearch-typo-wrap .dashboard-main-page-section h3,
.user-dashboard-content section h2,
.user-dashboard-content section h3,
.dashboard-typo-section h2,
.dashboard-typo-section h3,
.jobsearch-section-title h2 {
  color: var(--tp-navy) !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-weight: 700 !important;
}

/* Bandeau "Votre compte est actif" : passer navy au lieu de violet */
.jobsearch-account-status-bar,
.user-account-status,
.dashboard-account-status-bar,
.jobsearch-typo-wrap .alert-info,
.jobsearch-info-banner {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border-radius: 12px !important;
  border: none !important;
}
.jobsearch-account-status-bar a,
.user-account-status a,
.dashboard-account-status-bar a {
  color: var(--tp-warm) !important;
  font-weight: 700 !important;
}

/* ===========================================================================
 * 14. CHAMPS FORMULAIRE (inputs, textarea, select)
 * --------------------------------------------------------------------------- */
.jobsearch-typo-wrap input[type="text"],
.jobsearch-typo-wrap input[type="email"],
.jobsearch-typo-wrap input[type="password"],
.jobsearch-typo-wrap input[type="tel"],
.jobsearch-typo-wrap input[type="number"],
.jobsearch-typo-wrap input[type="url"],
.jobsearch-typo-wrap textarea,
.jobsearch-typo-wrap select,
.user-dashboard-content input[type="text"],
.user-dashboard-content input[type="email"],
.user-dashboard-content input[type="password"],
.user-dashboard-content textarea,
.user-dashboard-content select,
.jobsearch-modal input[type="text"],
.jobsearch-modal input[type="email"],
.jobsearch-modal input[type="password"],
.jobsearch-modal select {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 8px !important;
  color: var(--tp-navy) !important;
  font-size: 14px !important;
  padding: 10px 14px !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* Champ telephone : intl-tel-input (drapeau + indicatif) supprime cote JS via
   stripIntlTelInput(). Fallback CSS si la lib se reinitialise plus vite que
   le MutationObserver : on masque le wrapper drapeau et on reset le padding
   gauche de l'input. */
.iti__flag-container,
.intl-tel-input .flag-container {
  display: none !important;
}
.iti,
.intl-tel-input {
  display: block !important;
  width: 100% !important;
  position: static !important;
}
.iti input[type="tel"],
.intl-tel-input input[type="tel"] {
  padding-left: 14px !important;
  width: 100% !important;
}
.jobsearch-typo-wrap input:focus,
.jobsearch-typo-wrap textarea:focus,
.jobsearch-typo-wrap select:focus,
.user-dashboard-content input:focus,
.user-dashboard-content textarea:focus,
.user-dashboard-content select:focus,
.jobsearch-modal input:focus,
.jobsearch-modal select:focus {
  border-color: var(--tp-navy) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(22, 49, 92, 0.12) !important;
}

/* Labels au-dessus des champs */
.jobsearch-typo-wrap .field-label,
.user-dashboard-content .field-label,
.jobsearch-modal label,
.jobsearch-typo-wrap label {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

/* ===========================================================================
 * 15. PAGINATION & ELEMENTS DE NAVIGATION
 * --------------------------------------------------------------------------- */
.jobsearch-pagination ul li a,
.jobsearch-pagination ul li span {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  color: var(--tp-navy) !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
}
.jobsearch-pagination ul li.active a,
.jobsearch-pagination ul li.current span,
.jobsearch-pagination ul li a:hover {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border-color: var(--tp-navy) !important;
}

/* ===========================================================================
 * 16. CARTE GOOGLE MAPS : conteneur (centrage / hauteur, pas les tiles)
 * --------------------------------------------------------------------------- */
.jobsearch-map-section,
.jobsearch-listing-google-map,
.jobsearch-google-map,
.dashboard-locate-map,
.jobsearch-jobs-map-wrap {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid var(--tp-border) !important;
  background: var(--tp-bg-soft) !important;
}

/* Marker JobSearch dans la map : harmonise le cercle */
.jobsearch-map-marker,
.jobsearch-map-marker-icon {
  background: var(--tp-navy) !important;
  border: 2px solid #fff !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

/* ===========================================================================
 * 17. MODAL (modal "Ajouter un gestionnaire", "Confirmer suppression")
 * --------------------------------------------------------------------------- */
/* NOTE : ne PAS styler .modal-inner-area (display:none plugin) ni
   .modal-content-area (wrapper plein hauteur). Tout le visuel doit aller sur
   .modal-box-area. Voir section 25.2 pour les overrides actifs. */
.jobsearch-modal .modal-header,
.jobsearch-modal .modal-title {
  border-bottom: 1px solid var(--tp-border) !important;
  padding: 18px 24px !important;
  color: var(--tp-navy) !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-weight: 700 !important;
  background: transparent !important;
}
.jobsearch-modal .close,
.jobsearch-modal button.close {
  color: var(--tp-text-muted) !important;
  opacity: 1 !important;
  transition: color 0.15s ease;
}
.jobsearch-modal .close:hover {
  color: var(--tp-navy) !important;
}

/* Submit du modal (ex: "Ajouter un gestionnaire") */
.jobsearch-modal button[type="submit"],
.jobsearch-modal input[type="submit"],
.jobsearch-modal .jobsearch-btn-primary {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  padding: 12px 24px !important;
  width: auto !important;
}
.jobsearch-modal button[type="submit"]:hover {
  background: var(--tp-navy-deep) !important;
}

/* ===========================================================================
 * 18. HEADER DE PAGE (hero "Offres de stage", "Recruteurs")
 * Le hero existant est OK (navy bold), juste s'assurer fond bg-soft uniforme
 * --------------------------------------------------------------------------- */
.jobsearch-page-banner,
.jobsearch-pages-banner,
.careerfy-pagebanner {
  background: var(--tp-bg-soft) !important;
  border-bottom: 1px solid var(--tp-border);
}
.jobsearch-page-banner h1,
.jobsearch-pages-banner h1,
.careerfy-pagebanner h1 {
  color: var(--tp-navy) !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-weight: 700 !important;
}

/* ===========================================================================
 * 19. EDITEUR TINY MCE (Presentation de l'entite)
 * --------------------------------------------------------------------------- */
.wp-editor-container,
.jobsearch-typo-wrap .wp-editor-wrap {
  border: 1px solid var(--tp-border) !important;
  border-radius: 8px !important;
  overflow: hidden;
}
.wp-editor-tabs .wp-switch-editor,
.wp-editor-tabs .wp-switch-editor.switch-html,
.wp-editor-tabs .wp-switch-editor.switch-tmce {
  background: var(--tp-bg-soft) !important;
  color: var(--tp-text-muted) !important;
  border-color: var(--tp-border) !important;
}
.wp-editor-tabs .wp-switch-editor:hover,
.wp-editor-tabs .wp-switch-editor.active {
  color: var(--tp-navy) !important;
  background: #fff !important;
}

/* ===========================================================================
 * 20. ALERTES / MESSAGES / NOTIFICATIONS
 * --------------------------------------------------------------------------- */
.jobsearch-typo-wrap .alert-success,
.jobsearch-typo-wrap .notice-success {
  background: rgba(46, 166, 160, 0.10) !important;
  border: 1px solid rgba(46, 166, 160, 0.30) !important;
  color: var(--tp-accent-deep) !important;
  border-radius: 8px !important;
}
.jobsearch-typo-wrap .alert-warning,
.jobsearch-typo-wrap .notice-warning {
  background: rgba(231, 182, 71, 0.12) !important;
  border: 1px solid rgba(231, 182, 71, 0.30) !important;
  color: #8c6817 !important;
  border-radius: 8px !important;
}
.jobsearch-typo-wrap .alert-danger,
.jobsearch-typo-wrap .notice-error {
  background: var(--tp-danger-soft) !important;
  border: 1px solid rgba(177, 49, 31, 0.30) !important;
  color: var(--tp-danger) !important;
  border-radius: 8px !important;
}

/* ===========================================================================
 * 21. LOADER (user-dashboard-loader)
 * Le plugin gere display:none/block en inline. On NE force PAS display: ici,
 * sinon le loader reste visible en plein ecran et cache tout le dashboard.
 * On style juste l'apparence quand JobSearch decide de l'afficher.
 * --------------------------------------------------------------------------- */
.user-dashboard-loader {
  position: fixed;
  inset: 0;
  background: rgba(255, 255, 255, 0.92);
  z-index: 99999;
  align-items: center;
  justify-content: center;
  pointer-events: all;
}
.user-dashboard-loader:before {
  content: "";
  width: 48px;
  height: 48px;
  border: 4px solid var(--tp-bg-soft);
  border-top-color: var(--tp-navy);
  border-radius: 50%;
  animation: tpJobLoaderSpin 0.8s linear infinite;
}
@keyframes tpJobLoaderSpin {
  to { transform: rotate(360deg); }
}

/* ===========================================================================
 * 22. DASHBOARD : pleine largeur
 * Vire le max-width du conteneur sur la page dashboard pour utiliser
 * toute la largeur disponible (utile sur grands ecrans).
 * --------------------------------------------------------------------------- */
.page-template-user-dashboard-template .jobsearch-plugin-default-container,
.page-template-user-dashboard-template .jobsearch-container,
.page-template-user-dashboard-template .careerfy-wrapper > .container,
.page-template-user-dashboard-template .careerfy-typo-wrap > .container,
body.page-template-user-dashboard-template .jobsearch-typo-wrap .container {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 40px !important;
  padding-right: 40px !important;
}

/* NB : l'espace en haut du dashboard (padding-top) est gere de facon
 * centralisee en section 31.1 (source unique de verite), pas ici. */

/* Repartition sidebar/contenu : sidebar fixe ~280px, contenu prend le reste */
.page-template-user-dashboard-template .jobsearch-column-3 {
  width: 22% !important;
  max-width: 320px !important;
  padding-right: 24px !important;
}
.page-template-user-dashboard-template .jobsearch-column-9 {
  width: 78% !important;
  max-width: calc(100% - 320px) !important;
  flex: 1 !important;
}

@media (max-width: 1024px) {
  .page-template-user-dashboard-template .jobsearch-plugin-default-container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .page-template-user-dashboard-template .jobsearch-column-3,
  .page-template-user-dashboard-template .jobsearch-column-9 {
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 0 !important;
  }
}

/* ===========================================================================
 * 23. MODERN DASHBOARD : refonte visuelle complete (Phase 2)
 * Transforme l'apparence du dashboard sans toucher au PHP/HTML.
 * Cible : look SaaS moderne (cards elevees, typo claire, micro-interactions,
 * spacing genereux, hierarchie visuelle nette).
 * --------------------------------------------------------------------------- */

/* --- 23.1 LAYOUT DE FOND ---------------------------------------------------- */
body.page-template-user-dashboard-template {
  background: #fafaf6 !important;
}
body.page-template-user-dashboard-template .careerfy-wrapper,
body.page-template-user-dashboard-template .jobsearch-typo-wrap {
  background: transparent !important;
}

/* --- 23.2 SIDEBAR : carte blanche elevee avec avatar circulaire --------------- */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav {
  background: #fff !important;
  border-radius: 18px !important;
  border: 1px solid var(--tp-border) !important;
  padding: 28px 20px !important;
  box-shadow: 0 1px 3px rgba(10, 31, 68, 0.04) !important;
  position: sticky;
  top: 100px;
}

/* Avatar : la <figure> reste un simple conteneur en flow normal pour que
 * .jobsearch-saved-img-holder et .jobsearch-fileUpload s'empilent
 * verticalement comme prevu par le markup natif. */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .user_img_skillid,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > figure {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
  border-radius: 0 !important;
  position: relative !important;
  text-align: center !important;
}

/* Le visuel rond (placeholder ou photo uploadee) : 120x120 circle */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-saved-img-holder {
  width: 120px !important;
  height: 120px !important;
  margin: 0 auto !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  position: relative !important;
  background: var(--tp-bg-soft) !important;
  box-shadow: 0 4px 16px rgba(10, 31, 68, 0.10) !important;
  border: 4px solid #fff !important;
  outline: 2px solid var(--tp-bg-soft);
  outline-offset: 0;
  display: block !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .employer-dashboard-thumb {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-saved-img-holder img,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .employer-dashboard-thumb img {
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Bouton "supprimer photo" : au-dessus, en haut a droite du holder rond.
 * outline:2px sur le holder donc on positionne pour rester dans le viewport. */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .user-dashthumb-remove {
  position: absolute !important;
  top: -4px !important;
  right: -4px !important;
  width: 26px !important;
  height: 26px !important;
  background: var(--tp-danger) !important;
  color: #fff !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  z-index: 10 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18) !important;
  transition: transform 0.15s ease !important;
  text-decoration: none !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .user-dashthumb-remove:hover {
  transform: scale(1.08) !important;
  background: #8a2517 !important;
}

/* Widget upload : en bloc, SOUS le holder, centre, dans le flow naturel */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload {
  position: relative !important;
  display: block !important;
  text-align: center !important;
  margin: 14px auto 0 !important;
  padding: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  overflow: visible !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload .fileUpLoader {
  position: relative !important;
  display: block !important;
  margin: 0 !important;
}

/* Bouton telecharger logo */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload {
  text-align: center !important;
  margin: 0 auto 18px !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 16px !important;
  background: #fff !important;
  color: var(--tp-navy) !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.18s ease !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload:hover span {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border-color: var(--tp-navy) !important;
}

/* Nom de l'entite */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav h2,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav h2 a {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--tp-navy) !important;
  text-align: center !important;
  margin: 0 0 4px !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-dashboard-subtitle {
  display: block !important;
  text-align: center !important;
  font-size: 12.5px !important;
  color: var(--tp-text-muted) !important;
  margin: 0 0 22px !important;
}

/* --- 23.3 NAV ITEMS : design moderne avec icones --------------------------- */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-top: 1px solid var(--tp-border);
  padding-top: 16px !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li {
  margin: 0 0 4px !important;
  padding: 0 !important;
  list-style: none !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 11px 14px !important;
  border-radius: 10px !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: var(--tp-text-muted) !important;
  background: transparent !important;
  border: none !important;
  transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease !important;
  text-decoration: none !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a i {
  font-size: 16px !important;
  color: var(--tp-text-muted) !important;
  width: 20px !important;
  text-align: center !important;
  transition: color 0.15s ease !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a:hover {
  background: rgba(22, 49, 92, 0.06) !important;
  color: var(--tp-navy) !important;
  transform: translateX(2px);
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a:hover i {
  color: var(--tp-navy) !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.current-menu-item > a,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.active > a,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.jobsearch-current-tab > a {
  background: var(--tp-navy) !important;
  color: #fff !important;
  font-weight: 600 !important;
  border-left: none !important;
  box-shadow: 0 4px 12px rgba(22, 49, 92, 0.22);
  transform: translateX(2px);
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.current-menu-item > a i,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.active > a i {
  color: var(--tp-warm) !important;
}

/* Lien "Supprimer le compte" : a part visuellement */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li:last-child {
  margin-top: 8px !important;
  padding-top: 12px !important;
  border-top: 1px solid var(--tp-border);
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a[href*="delete"],
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.delete-account a,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.delete-account-list a {
  background: var(--tp-danger-soft) !important;
  color: var(--tp-danger) !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a[href*="delete"]:hover,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.delete-account a:hover {
  background: var(--tp-danger) !important;
  color: #fff !important;
}

/* --- 23.4 SECTIONS DU CONTENU PRINCIPAL : cards elevees ---------------------- */
.page-template-user-dashboard-template .jobsearch-typo-wrap .dashboard-main-page-section,
.page-template-user-dashboard-template .jobsearch-dashboard-section,
.page-template-user-dashboard-template .user-dashboard-content section,
.page-template-user-dashboard-template .user-dashboard-content .section-box,
.page-template-user-dashboard-template .jobsearch-employer-box-section,
.page-template-user-dashboard-template .jobsearch-applicants-graph,
.page-template-user-dashboard-template .jobsearch-typo-wrap > .jobsearch-typo-wrap > div {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 18px !important;
  padding: 28px 32px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 1px 3px rgba(10, 31, 68, 0.04) !important;
  position: relative;
}

/* Titres de section (Notifications, Recapitulatif, etc.) */
.page-template-user-dashboard-template .jobsearch-profile-title,
.page-template-user-dashboard-template .jobsearch-section-title,
.page-template-user-dashboard-template .dashboard-typo-section h2:first-child,
.page-template-user-dashboard-template .jobsearch-typo-wrap h2.jobsearch-section-title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 0 0 22px !important;
  padding-bottom: 18px !important;
  border-bottom: 1px solid var(--tp-border) !important;
}
.page-template-user-dashboard-template .jobsearch-profile-title h2,
.page-template-user-dashboard-template .jobsearch-section-title h2,
.page-template-user-dashboard-template .dashboard-typo-section h2,
.page-template-user-dashboard-template .jobsearch-employer-box-section > h2:first-child {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--tp-navy) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  letter-spacing: -0.3px;
}

/* --- 23.5 BANDEAU STATUT COMPTE : look notification moderne ----------------- */
.page-template-user-dashboard-template .jobsearch-account-status-bar,
.page-template-user-dashboard-template .user-account-status,
.page-template-user-dashboard-template .dashboard-account-status-bar,
.page-template-user-dashboard-template .jobsearch-typo-wrap .alert-info,
.page-template-user-dashboard-template .jobsearch-info-banner,
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-alert,
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-success-alert {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  background: rgba(46, 166, 160, 0.06) !important;
  border: 1px solid rgba(46, 166, 160, 0.22) !important;
  border-left: 4px solid var(--tp-accent) !important;
  color: var(--tp-navy) !important;
  border-radius: 12px !important;
  padding: 16px 20px !important;
  margin-bottom: 24px !important;
  font-size: 14.5px !important;
  line-height: 1.55 !important;
}
/* Force la couleur navy lisible sur les enfants (spans, liens) qui sinon
   heritent d'une couleur grise pale appliquee par le plugin */
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-alert > *,
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-success-alert > *,
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-alert span,
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-success-alert span,
.page-template-user-dashboard-template .jobsearch-typo-wrap .alert-info span {
  color: var(--tp-navy) !important;
}
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-success-alert a,
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-alert a {
  color: var(--tp-accent) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  border-bottom: 1px solid currentColor !important;
}

/* Boutons "Paramètres / Liste" dans le titre de la section Notifications.
   Le plugin les rend par defaut en violet vif Bootstrap, on veut une pill
   navy outline coherente avec la charte. */
.page-template-user-dashboard-template a.dash-hdtabchng-btn,
.page-template-user-dashboard-template .jobsearch-profile-title a.dash-hdtabchng-btn,
.jobsearch-dashnotifics-bars .jobsearch-profile-title a {
  background: #fff !important;
  color: var(--tp-navy) !important;
  border: 1px solid var(--tp-navy) !important;
  border-radius: 999px !important;
  padding: 7px 18px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}
.page-template-user-dashboard-template a.dash-hdtabchng-btn:hover,
.jobsearch-dashnotifics-bars .jobsearch-profile-title a:hover {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border-color: var(--tp-navy) !important;
}
/* En-tête du panneau Notifications : titre à gauche, les DEUX boutons
   (« Liste des notifications » + « Paramètres ») groupés à droite, côte à côte. */
.jobsearch-dashnotifics-bars .jobsearch-profile-title {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}
.jobsearch-dashnotifics-bars .jobsearch-profile-title h2 {
  margin: 0 auto 0 0 !important; /* pousse le titre à gauche -> boutons à droite */
}
.page-template-user-dashboard-template .jobsearch-account-status-bar:before,
.page-template-user-dashboard-template .user-account-status:before,
.page-template-user-dashboard-template .dashboard-account-status-bar:before,
.page-template-user-dashboard-template .jobsearch-typo-wrap .alert-info:before {
  content: "" !important;
  flex-shrink: 0;
  width: 24px !important;
  height: 24px !important;
  background: var(--tp-navy);
  border-radius: 50%;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
  color: #fff !important;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/14px no-repeat,
        linear-gradient(var(--tp-navy), var(--tp-navy));
}
.page-template-user-dashboard-template .jobsearch-account-status-bar a,
.page-template-user-dashboard-template .user-account-status a,
.page-template-user-dashboard-template .dashboard-account-status-bar a {
  color: var(--tp-accent-deep) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* --- 23.6 KPI CARDS : grid + design moderne --------------------------------- */
/* KPI « Récapitulatif » RETIRÉS côté CANDIDAT uniquement (peu utiles pour un
   élève : surtout des zéros, redondant avec l'onglet Candidatures). On masque
   toute la section (titre « Récapitulatif » compris) = le .jobsearch-employer-box-section
   qui CONTIENT la liste de stats. Gardés côté recruteur (body sans tp-role-candidate).
   Rôle posé sur le <body> par inc/taiara-dashboard-kpi.php. */
body.tp-role-candidate .jobsearch-employer-box-section:has(.jobsearch-stats-list) {
  display: none !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list {
  margin-bottom: 24px !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list > ul {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 16px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list > ul > li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list-wrap {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 16px !important;
  padding: 22px 24px !important;
  box-shadow: 0 1px 3px rgba(10, 31, 68, 0.04) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
  position: relative;
  overflow: hidden;
  /* Contenu CENTRÉ (chiffre au-dessus, nom en dessous, plus de sous-titre).
     Le chiffre est déjà placé en premier dans le HTML (voir taiara-dashboard-kpi.php)
     -> pas de `order` flex, donc pas de bug sur la 1re carte.
     height:100% -> la carte remplit son <li> (les <li> de la grille sont déjà
     à hauteur égale) -> les 4 cartes ont la MÊME hauteur, quel que soit le
     nom (ex. « OFFRE PUBLIÉE » plus long que « VUE »). */
  height: 100% !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list-wrap:before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--tp-accent);
  opacity: 0;
  transition: opacity 0.2s ease;
}
.page-template-user-dashboard-template .jobsearch-stats-list-wrap:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(10, 31, 68, 0.10) !important;
  border-color: rgba(22, 49, 92, 0.30) !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list-wrap:hover:before {
  opacity: 1;
}
.page-template-user-dashboard-template .jobsearch-stats-list ul li:nth-child(4) .jobsearch-stats-list-wrap:before {
  background: var(--tp-accent) !important;
}

/* Label KPI */
.page-template-user-dashboard-template .jobsearch-stats-list-wrap h6,
.page-template-user-dashboard-template .jobsearch-stats-list-wrap.green h6,
.page-template-user-dashboard-template .jobsearch-stats-list-wrap.light-blue h6,
.page-template-user-dashboard-template .jobsearch-stats-list-wrap.dark-blue h6 {
  font-family: "Inter", sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: var(--tp-text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Big number */
.page-template-user-dashboard-template .jobsearch-stats-list-wrap span,
.page-template-user-dashboard-template .jobsearch-stats-list-wrap.green span,
.page-template-user-dashboard-template .jobsearch-stats-list-wrap.light-blue span,
.page-template-user-dashboard-template .jobsearch-stats-list-wrap.dark-blue span {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 40px !important;
  font-weight: 800 !important;
  color: var(--tp-navy) !important;
  display: block !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  line-height: 1 !important;
  letter-spacing: -1px;
}
/* Chiffres TOUS navy : la classe plugin .dark-blue (placée sur des cartes
   différentes selon candidat/recruteur) mettait un chiffre doré « au hasard ».
   On harmonise -> tous les KPI en navy. */
.page-template-user-dashboard-template .jobsearch-stats-list-wrap.dark-blue span {
  color: var(--tp-navy) !important;
}

/* Subtitle */
.page-template-user-dashboard-template .jobsearch-stats-list-wrap small {
  font-size: 12.5px !important;
  color: var(--tp-text-muted) !important;
  line-height: 1.5 !important;
  display: block !important;
  margin: 0 !important;
}

/* --- 23.7 GRAPHIQUE : carte dediee ------------------------------------------ */
.page-template-user-dashboard-template .jobsearch-applicants-graph {
  display: grid !important;
  grid-template-columns: 1fr 240px !important;
  gap: 32px !important;
  align-items: start !important;
}
@media (max-width: 800px) {
  .page-template-user-dashboard-template .jobsearch-applicants-graph {
    grid-template-columns: 1fr !important;
  }
}
.page-template-user-dashboard-template .jobsearch-chart {
  min-height: 220px;
}
.page-template-user-dashboard-template .jobsearch-applicants-stats {
  background: var(--tp-bg-soft) !important;
  border-radius: 12px !important;
  padding: 18px !important;
}
.page-template-user-dashboard-template .jobsearch-applicants-stats h6 {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--tp-text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  margin: 0 0 12px !important;
}
.page-template-user-dashboard-template .jobsearch-applicants-stats ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.page-template-user-dashboard-template .jobsearch-applicants-stats ul li {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-bottom: 8px !important;
  font-size: 13px !important;
  color: var(--tp-navy) !important;
}
.page-template-user-dashboard-template .jobsearch-applicants-stats ul li i {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  display: inline-block !important;
  background: var(--tp-navy) !important;
}
.page-template-user-dashboard-template .jobsearch-applicants-stats ul li:nth-child(1) i { background: var(--tp-navy) !important; }
.page-template-user-dashboard-template .jobsearch-applicants-stats ul li:nth-child(2) i { background: var(--tp-accent) !important; }
.page-template-user-dashboard-template .jobsearch-applicants-stats ul li:nth-child(3) i { background: var(--tp-warm) !important; }
.page-template-user-dashboard-template .jobsearch-applicants-stats ul li:nth-child(4) i { background: var(--tp-text-muted) !important; }

/* --- 23.8 EMPTY STATES (Aucune notification, Aucune candidature, etc.) ------ */
.page-template-user-dashboard-template .jobsearch-no-record,
.page-template-user-dashboard-template .jobsearch-no-content,
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-no-listing-found,
.page-template-user-dashboard-template .jobsearch-typo-wrap > .jobsearch-employer-box-section > p:only-child {
  text-align: center !important;
  padding: 32px 20px !important;
  color: var(--tp-text-muted) !important;
  font-size: 14.5px !important;
}

/* --- 23.9 BOUTON "PARAMETRES" / actions en header section ------------------- */
.page-template-user-dashboard-template .jobsearch-section-actions,
.page-template-user-dashboard-template .jobsearch-profile-title .jobsearch-action-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 10px 18px !important;
  background: var(--tp-navy) !important;
  color: #fff !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: background 0.15s ease, transform 0.15s ease !important;
}
.page-template-user-dashboard-template .jobsearch-section-actions:hover {
  background: var(--tp-navy-deep) !important;
  transform: translateY(-1px);
}

/* --- 23.10 FORMULAIRES : champs modernises -------------------------------- */
.page-template-user-dashboard-template .jobsearch-typo-wrap label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--tp-navy) !important;
  display: block !important;
  margin-bottom: 6px !important;
  letter-spacing: 0.2px;
}
.page-template-user-dashboard-template .jobsearch-typo-wrap input[type="text"],
.page-template-user-dashboard-template .jobsearch-typo-wrap input[type="email"],
.page-template-user-dashboard-template .jobsearch-typo-wrap input[type="password"],
.page-template-user-dashboard-template .jobsearch-typo-wrap input[type="tel"],
.page-template-user-dashboard-template .jobsearch-typo-wrap input[type="number"],
.page-template-user-dashboard-template .jobsearch-typo-wrap input[type="url"],
.page-template-user-dashboard-template .jobsearch-typo-wrap textarea,
.page-template-user-dashboard-template .jobsearch-typo-wrap select {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  color: var(--tp-navy) !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14.5px !important;
  padding: 12px 16px !important;
  width: 100% !important;
  height: auto !important;
  line-height: 1.4 !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
.page-template-user-dashboard-template .jobsearch-typo-wrap input:focus,
.page-template-user-dashboard-template .jobsearch-typo-wrap textarea:focus,
.page-template-user-dashboard-template .jobsearch-typo-wrap select:focus {
  border-color: var(--tp-navy) !important;
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
}

/* --- 23.11 BOUTONS PRINCIPAUX du dashboard --------------------------------- */
.page-template-user-dashboard-template input[type="submit"],
.page-template-user-dashboard-template button[type="submit"],
.page-template-user-dashboard-template .jobsearch-employer-profile-submit,
.page-template-user-dashboard-template .jobsearch-action-btn.primary {
  background: var(--tp-navy) !important;
  background-image: none !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  padding: 12px 24px !important;
  cursor: pointer !important;
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease !important;
  box-shadow: 0 2px 8px rgba(22, 49, 92, 0.18) !important;
}
.page-template-user-dashboard-template input[type="submit"]:hover,
.page-template-user-dashboard-template button[type="submit"]:hover,
.page-template-user-dashboard-template .jobsearch-employer-profile-submit:hover {
  background: var(--tp-navy-deep) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(22, 49, 92, 0.25) !important;
}

/* --- 23.12 TINY MCE polished --------------------------------------------- */
.page-template-user-dashboard-template .wp-editor-wrap,
.page-template-user-dashboard-template .wp-editor-container {
  border-radius: 10px !important;
  border: 1px solid var(--tp-border) !important;
  overflow: hidden;
  background: #fff !important;
}
.page-template-user-dashboard-template .mce-toolbar,
.page-template-user-dashboard-template .mce-statusbar {
  border-color: var(--tp-border) !important;
}

/* --- 23.13 BOUTON SUPPRIMER LE COMPTE (sidebar, isolation visuelle) --------- */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .delete-account a {
  background: transparent !important;
  color: var(--tp-danger) !important;
  border: 1px solid var(--tp-danger) !important;
  font-weight: 600 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .delete-account a:hover {
  background: var(--tp-danger) !important;
  color: #fff !important;
  border-color: var(--tp-danger) !important;
}

/* --- 23.14 RESPONSIVE DASHBOARD ------------------------------------------- */
@media (max-width: 1024px) {
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav {
    position: static;
    margin-bottom: 24px;
  }
}
@media (max-width: 768px) {
  .page-template-user-dashboard-template .jobsearch-typo-wrap .dashboard-main-page-section,
  .page-template-user-dashboard-template .jobsearch-employer-box-section {
    padding: 20px 18px !important;
    border-radius: 14px !important;
  }
  .page-template-user-dashboard-template .jobsearch-stats-list > ul {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }
  .page-template-user-dashboard-template .jobsearch-stats-list-wrap {
    padding: 18px 16px !important;
  }
  .page-template-user-dashboard-template .jobsearch-stats-list-wrap span {
    font-size: 32px !important;
  }
}

/* ===========================================================================
 * 24. FIXES POST-DEPLOIEMENT v1.0.26 -> v1.0.27
 * --------------------------------------------------------------------------- */

/* --- 24.1 KPI : force width auto sur les li (overrides le width:25% du
 * plugin), reset margin/padding pour que le grid prenne la main --- */
.page-template-user-dashboard-template .jobsearch-stats-list ul li {
  width: auto !important;
  min-width: 0 !important;
  flex: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* Reset le margin negatif sur le ul */
.page-template-user-dashboard-template .jobsearch-stats-list ul {
  margin: 0 !important;
  padding: 0 !important;
}
/* Si auto-fit ne suffit pas, force 4 colonnes au desktop large */
@media (min-width: 1100px) {
  .page-template-user-dashboard-template .jobsearch-stats-list > ul {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 1099px) and (min-width: 700px) {
  .page-template-user-dashboard-template .jobsearch-stats-list > ul {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Empeche le texte uppercase de se replier lettre par lettre dans une
 * colonne tres etroite. Si trop long, juste tronquer avec ellipsis. */
.page-template-user-dashboard-template .jobsearch-stats-list-wrap h6 {
  word-break: normal !important;
  overflow-wrap: normal !important;
  white-space: normal !important;
  letter-spacing: 0.4px !important;
  line-height: 1.3 !important;
}

/* --- 24.2 BANDEAU STATUT COMPTE : contraste suffisant ---------------------- */
.page-template-user-dashboard-template .jobsearch-account-status-bar,
.page-template-user-dashboard-template .user-account-status,
.page-template-user-dashboard-template .dashboard-account-status-bar,
.page-template-user-dashboard-template .jobsearch-typo-wrap .alert-info,
.page-template-user-dashboard-template .jobsearch-info-banner,
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-alert,
.page-template-user-dashboard-template .jobsearch-typo-wrap .jobsearch-success-alert {
  background: #fff7e1 !important;
  border-color: rgba(231, 182, 71, 0.50) !important;
  border-left-color: var(--tp-warm) !important;
  color: #5a4a14 !important;
  font-weight: 500 !important;
}
.page-template-user-dashboard-template .jobsearch-account-status-bar:before,
.page-template-user-dashboard-template .user-account-status:before,
.page-template-user-dashboard-template .dashboard-account-status-bar:before,
.page-template-user-dashboard-template .jobsearch-typo-wrap .alert-info:before {
  background: var(--tp-warm) !important;
}
.page-template-user-dashboard-template .jobsearch-account-status-bar strong,
.page-template-user-dashboard-template .user-account-status strong,
.page-template-user-dashboard-template .dashboard-account-status-bar strong,
.page-template-user-dashboard-template .jobsearch-typo-wrap .alert-info strong {
  color: #5a4a14 !important;
  font-weight: 800 !important;
}
.page-template-user-dashboard-template .jobsearch-account-status-bar a,
.page-template-user-dashboard-template .user-account-status a,
.page-template-user-dashboard-template .dashboard-account-status-bar a {
  color: #8c6817 !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(140, 104, 23, 0.40) !important;
}

/* --- 24.3 TAGS jQuery UI (tagit) : override le ui-state-default ------------ */
.tagit.ui-widget {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  padding: 8px !important;
}
ul.tagit li.tagit-choice.ui-widget-content.ui-state-default,
ul.tagit li.tagit-choice.ui-state-default,
ul.tagit li.tagit-choice {
  background: rgba(22, 49, 92, 0.10) !important;
  background-image: none !important;
  border: 1px solid rgba(22, 49, 92, 0.20) !important;
  color: var(--tp-navy) !important;
  border-radius: 999px !important;
  padding: 4px 14px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  margin: 2px 4px 2px 0 !important;
}
ul.tagit li.tagit-choice a.tagit-label,
ul.tagit li.tagit-choice.ui-state-default a.tagit-label,
ul.tagit li.tagit-choice.ui-state-default span.tagit-label {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  background: transparent !important;
  padding: 0 !important;
}
ul.tagit li.tagit-choice .tagit-close,
ul.tagit li.tagit-choice.ui-state-default .tagit-close {
  color: var(--tp-navy) !important;
  background: transparent !important;
  margin-left: 4px !important;
  opacity: 0.6 !important;
  transition: opacity 0.15s ease !important;
}
ul.tagit li.tagit-choice .tagit-close:hover,
ul.tagit li.tagit-choice.ui-state-default .tagit-close:hover {
  opacity: 1 !important;
  color: var(--tp-danger) !important;
}
ul.tagit li.tagit-new input {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  padding: 4px 8px !important;
  font-size: 13px !important;
  color: var(--tp-navy) !important;
  box-shadow: none !important;
}

/* --- 24.4 ELEMENTOR CONTAINER : libere la largeur pour le dashboard --- */
body.page-template-user-dashboard-template .elementor-section.elementor-section-boxed > .elementor-container,
body.page-template-user-dashboard-template .elementor-section.elementor-section-stretched > .elementor-container,
body.page-template-user-dashboard-template .elementor-container {
  max-width: 100% !important;
  width: 100% !important;
}
body.page-template-user-dashboard-template .elementor-column .elementor-widget-wrap {
  padding: 0 !important;
}

/* --- 24.5 ENCART KPI 4 ("Nombre total de candidatures") : meme look --- */
.page-template-user-dashboard-template .jobsearch-applicants-stats-side,
.page-template-user-dashboard-template .jobsearch-total-applications {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 16px !important;
  padding: 24px !important;
  text-align: center !important;
  box-shadow: 0 1px 3px rgba(10, 31, 68, 0.04) !important;
}

/* ===========================================================================
 * 25. PATCH v1.0.27 : modale gestionnaire + cases consentement
 * --------------------------------------------------------------------------- */

/* --- 25.1 Masque la case de consentement RGPD sur le dashboard et la modale
 * Ajouter un gestionnaire (Teiva : le consentement est deja gere ailleurs) --- */
body.page-template-user-dashboard-template .terms-priv-chek-con,
.jobsearch-modal .terms-priv-chek-con {
  display: none !important;
}

/* --- 25.2 Modales JobSearch : reskin moderne ------------------------------
 *
 * Structure du plugin :
 *   .jobsearch-modal        (wrapper position: fixed plein ecran + backdrop)
 *     .modal-inner-area     (decoratif, display: none par defaut plugin)
 *     .modal-content-area   (flex container plein hauteur qui centre la box)
 *       .modal-box-area     (la boite visible avec le contenu)
 *
 * IMPORTANT : ne PAS mettre de background ou de styles visuels sur
 * .modal-content-area, il prend toute la hauteur du viewport (100vh) et
 * deviendrait une enorme zone blanche. Tout le visuel doit aller sur
 * .modal-box-area. La content-area garde juste la largeur max.
 * ------------------------------------------------------------------------- */
.jobsearch-modal {
  z-index: 99999 !important;
}
.jobsearch-modal .modal-content-area {
  max-width: 720px !important;
  width: 92% !important;
}
.jobsearch-modal .modal-box-area {
  border-radius: 18px !important;
  border: 1px solid var(--tp-border) !important;
  box-shadow: 0 24px 70px rgba(10, 31, 68, 0.22) !important;
  padding: 28px 32px !important;
  background: #fff !important;
}
.jobsearch-modal .jobsearch-modal-title-box,
.jobsearch-modal .modal-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 0 20px !important;
  margin-bottom: 22px !important;
  border-bottom: 1px solid var(--tp-border) !important;
  background: transparent !important;
}
.jobsearch-modal .jobsearch-modal-title-box h2,
.jobsearch-modal .modal-header h2,
.jobsearch-modal .jobsearch-adingmem-title,
.jobsearch-modal h2.jobsearch-modal-heading {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--tp-navy) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  line-height: 1.3 !important;
}
.jobsearch-modal .modal-close,
.jobsearch-modal .close,
.jobsearch-modal button.close {
  background: transparent !important;
  border: none !important;
  color: var(--tp-text-muted) !important;
  font-size: 22px !important;
  cursor: pointer !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  opacity: 1 !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}
.jobsearch-modal .modal-close:hover,
.jobsearch-modal .close:hover {
  background: var(--tp-bg-soft) !important;
  color: var(--tp-navy) !important;
}

/* Champs dans la modale */
.jobsearch-modal label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--tp-navy) !important;
  display: block !important;
  margin-bottom: 6px !important;
}
.jobsearch-modal input[type="text"],
.jobsearch-modal input[type="email"],
.jobsearch-modal input[type="password"],
.jobsearch-modal input[type="tel"] {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  padding: 12px 16px !important;
  width: 100% !important;
  font-size: 14.5px !important;
  color: var(--tp-navy) !important;
}
.jobsearch-modal input:focus {
  border-color: var(--tp-navy) !important;
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
}

/* Section "Autorisations accordees" */
.jobsearch-modal .jobsearch-adingmem-title,
.jobsearch-modal h4.jobsearch-adingmem-title {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--tp-navy) !important;
  margin: 24px 0 14px !important;
  display: block !important;
}

/* Liste des permissions : grid 2 colonnes */
.jobsearch-modal .jobsearch-adingmem-permisons-wrap ul,
.jobsearch-modal ul:has(> li > .jobsearch-adingmem-permisons) {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 22px !important;
}
@media (max-width: 600px) {
  .jobsearch-modal .jobsearch-adingmem-permisons-wrap ul,
  .jobsearch-modal ul:has(> li > .jobsearch-adingmem-permisons) {
    grid-template-columns: 1fr !important;
  }
}
.jobsearch-modal ul li:has(> .jobsearch-adingmem-permisons),
.jobsearch-modal .jobsearch-adingmem-permisons-wrap li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Checkbox + label custom (override emoji verte) */
.jobsearch-adingmem-permisons {
  position: relative;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  background: #fff !important;
  cursor: pointer !important;
  transition: border-color 0.15s ease, background 0.15s ease !important;
}
.jobsearch-adingmem-permisons:hover {
  border-color: var(--tp-navy) !important;
  background: rgba(22, 49, 92, 0.03) !important;
}
.jobsearch-adingmem-permisons input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 18px !important;
  height: 18px !important;
  border: 1.5px solid var(--tp-border) !important;
  border-radius: 4px !important;
  background: #fff !important;
  background-image: none !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  position: relative !important;
  margin: 0 !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}
.jobsearch-adingmem-permisons input[type="checkbox"]:checked {
  background: var(--tp-navy) !important;
  border-color: var(--tp-navy) !important;
}
.jobsearch-adingmem-permisons input[type="checkbox"]:checked::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 5px !important;
  height: 9px !important;
  border: solid #fff !important;
  border-width: 0 2px 2px 0 !important;
  transform: translate(-50%, -60%) rotate(45deg) !important;
}
.jobsearch-adingmem-permisons label {
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--tp-navy) !important;
  margin: 0 !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
  flex: 1 !important;
}

/* Bouton submit dans la modale */
.jobsearch-modal button[type="submit"],
.jobsearch-modal input[type="submit"],
.jobsearch-modal .jobsearch-add-member-btn,
.jobsearch-modal .jobsearch-modal-submit {
  background: var(--tp-navy) !important;
  background-image: none !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  padding: 12px 28px !important;
  cursor: pointer !important;
  width: auto !important;
  box-shadow: 0 2px 8px rgba(22, 49, 92, 0.20) !important;
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease !important;
}
.jobsearch-modal button[type="submit"]:hover,
.jobsearch-modal input[type="submit"]:hover {
  background: var(--tp-navy-deep) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(22, 49, 92, 0.28) !important;
}

/* ===========================================================================
 * 26. PATCH v1.0.28 : select2 + spin buttons number
 * --------------------------------------------------------------------------- */

/* --- 26.1 SELECT2 : cacher le <select> natif quand select2 l'enveloppe et
 * styler proprement le wrapper select2 pour qu'il matche nos inputs. -------- */

/* Cache l'ancien <select> qu'on voyait en double dessous le select2 */
select.select2-hidden-accessible,
.select2-hidden-accessible {
  display: block !important;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Wrapper select2 : meme look que nos inputs natifs */
.select2-container--default .select2-selection--single,
.select2-container .select2-selection--single {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  height: 46px !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14.5px !important;
  color: var(--tp-navy) !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--tp-navy) !important;
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--tp-navy) !important;
  font-weight: 500 !important;
  line-height: 46px !important;
  padding: 0 !important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--tp-text-muted) !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 44px !important;
  top: 1px !important;
  right: 10px !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--tp-navy) transparent transparent transparent !important;
}

/* Select2 multi-select (Secteur(s) professionnel(s) par ex.) */
.select2-container--default .select2-selection--multiple {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  min-height: 46px !important;
  padding: 6px 10px !important;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
  border-color: var(--tp-navy) !important;
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: rgba(22, 49, 92, 0.10) !important;
  border: 1px solid rgba(22, 49, 92, 0.20) !important;
  border-radius: 999px !important;
  padding: 3px 12px !important;
  color: var(--tp-navy) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  margin-right: 4px !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--tp-navy) !important;
  margin-right: 6px !important;
  border: none !important;
  font-weight: 700 !important;
}

/* Dropdown panel ouvert */
.select2-container--default .select2-dropdown {
  border: 1px solid var(--tp-navy) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 32px rgba(10, 31, 68, 0.12) !important;
  margin-top: 4px !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid var(--tp-border) !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--tp-navy) !important;
}
.select2-container--default .select2-results__option {
  padding: 10px 14px !important;
  color: var(--tp-navy) !important;
  font-size: 14px !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background: var(--tp-navy) !important;
  color: #fff !important;
}
.select2-container--default .select2-results__option[aria-selected=true] {
  background: var(--tp-bg-soft) !important;
  color: var(--tp-navy) !important;
}

/* --- 26.2 INPUT TYPE NUMBER : retire les spin buttons natifs ---------------- */
.page-template-user-dashboard-template input[type="number"]::-webkit-inner-spin-button,
.page-template-user-dashboard-template input[type="number"]::-webkit-outer-spin-button,
.jobsearch-typo-wrap input[type="number"]::-webkit-inner-spin-button,
.jobsearch-typo-wrap input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  appearance: none !important;
  margin: 0 !important;
  display: none !important;
}
.page-template-user-dashboard-template input[type="number"],
.jobsearch-typo-wrap input[type="number"] {
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}

/* ===========================================================================
 * 27. PATCH v1.0.29 : alignement vertical sidebar/contenu + responsive
 * --------------------------------------------------------------------------- */

/* --- 27.1 ALIGNEMENT : les 2 colonnes demarrent au meme Y -------------- */
.page-template-user-dashboard-template .jobsearch-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 0 !important;
}

/* Padding-top equivalent en haut des 2 colonnes pour les decoller du hero */
.page-template-user-dashboard-template .jobsearch-column-3,
.page-template-user-dashboard-template .jobsearch-column-9 {
  padding-top: 24px !important;
  box-sizing: border-box !important;
}

/* La sidebar a son padding-interne, le contenu a besoin du meme decalage
 * pour que le titre du premier card s'aligne avec le HAUT de la sidebar */
.page-template-user-dashboard-template .jobsearch-column-9 > .jobsearch-typo-wrap > div:first-child,
.page-template-user-dashboard-template .jobsearch-column-9 > .jobsearch-typo-wrap > section:first-child {
  margin-top: 0 !important;
}

/* --- 27.2 RESPONSIVE COMPLET ------------------------------------------ */

/* Tablette : sidebar passe au-dessus, plus etroite, contenu pleine largeur */
@media (max-width: 1024px) {
  .page-template-user-dashboard-template .jobsearch-row {
    flex-direction: column !important;
  }
  .page-template-user-dashboard-template .jobsearch-column-3,
  .page-template-user-dashboard-template .jobsearch-column-9 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 0 !important;
  }
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav {
    position: static !important;
    margin-bottom: 16px !important;
  }
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 6px !important;
  }
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li {
    margin: 0 !important;
  }
  /* Avatar reste centre + nom centre, mais menu en 2 colonnes pour
   * compacter sans surcharger */
}

/* Mobile : tout empile, padding reduit, KPIs 1 colonne */
@media (max-width: 768px) {
  .page-template-user-dashboard-template .jobsearch-plugin-default-container,
  .page-template-user-dashboard-template .jobsearch-container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .page-template-user-dashboard-template .jobsearch-typo-wrap .dashboard-main-page-section,
  .page-template-user-dashboard-template .jobsearch-employer-box-section,
  .page-template-user-dashboard-template .jobsearch-dashboard-section,
  .page-template-user-dashboard-template .user-dashboard-content section {
    padding: 18px 16px !important;
    border-radius: 14px !important;
    margin-bottom: 16px !important;
  }
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav {
    padding: 20px 16px !important;
    border-radius: 14px !important;
  }
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul {
    grid-template-columns: 1fr !important;
  }
  .page-template-user-dashboard-template .jobsearch-stats-list > ul {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .page-template-user-dashboard-template .jobsearch-stats-list-wrap {
    padding: 16px 18px !important;
  }
  .page-template-user-dashboard-template .jobsearch-stats-list-wrap span {
    font-size: 32px !important;
  }
  .page-template-user-dashboard-template .jobsearch-applicants-graph {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .page-template-user-dashboard-template .jobsearch-profile-title h2,
  .page-template-user-dashboard-template .jobsearch-section-title h2,
  .page-template-user-dashboard-template .dashboard-typo-section h2 {
    font-size: 18px !important;
  }
  /* Formulaires : champs prennent 100% sur mobile */
  .page-template-user-dashboard-template .jobsearch-row.jobsearch-employer-profile-form > li,
  .page-template-user-dashboard-template .jobsearch-employer-profile-form .jobsearch-column-6 {
    width: 100% !important;
    margin-bottom: 14px !important;
  }
  /* Modal : largeur quasi pleine sur mobile */
  .jobsearch-modal .modal-inner-area,
  .jobsearch-modal .modal-content-area {
    width: 96% !important;
    max-width: 96% !important;
  }
  .jobsearch-modal .modal-box-area {
    padding: 22px 18px !important;
  }
  .jobsearch-modal .jobsearch-adingmem-permisons-wrap ul,
  .jobsearch-modal ul:has(> li > .jobsearch-adingmem-permisons) {
    grid-template-columns: 1fr !important;
  }
}

/* Tres petit mobile */
@media (max-width: 480px) {
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .user_img_skillid,
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav figure,
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .user_img_skillid img,
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav figure img,
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .employer-dashboard-thumb {
    width: 88px !important;
    height: 88px !important;
  }
  .page-template-user-dashboard-template .jobsearch-stats-list-wrap span {
    font-size: 28px !important;
  }
}

/* ===========================================================================
 * 28. PATCH v1.0.33 : sidebar layout + alignement + marge en haut
 * --------------------------------------------------------------------------- */

/* --- 28.1 PADDING-TOP DE LA PAGE DASHBOARD : decolle du header --- */
.page-template-user-dashboard-template .jobsearch-main-content,
.page-template-user-dashboard-template .jobsearch-plugin-default-container {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

/* --- 28.2 ROW : flex SEULEMENT au top-level, pas dans le formulaire --- */
/* Cibler exclusivement la row qui contient les 2 colonnes principales
 * sidebar + content, jamais les rangees internes des formulaires */
.page-template-user-dashboard-template .jobsearch-plugin-default-container > .jobsearch-row,
.page-template-user-dashboard-template .jobsearch-main-content > .jobsearch-plugin-default-container > .jobsearch-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  margin: 0 !important;
}
/* IMPORTANT : la rangee du formulaire reprend son layout natif (block + float)
 * MAIS on respecte les li masques (style="display:none") par le JS via
 * :not([style*="display: none"]) — sinon le Code postal reapparait. */
.page-template-user-dashboard-template ul.jobsearch-row.jobsearch-employer-profile-form,
.page-template-user-dashboard-template .jobsearch-row.jobsearch-employer-profile-form {
  display: block !important;
}
.page-template-user-dashboard-template .jobsearch-row.jobsearch-employer-profile-form::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}
.page-template-user-dashboard-template .jobsearch-row.jobsearch-employer-profile-form > li.jobsearch-column-6:not([style*="display: none"]):not([style*="display:none"]),
.page-template-user-dashboard-template .jobsearch-row.jobsearch-employer-profile-form > li.jobsearch-column-12:not([style*="display: none"]):not([style*="display:none"]) {
  float: left !important;
  display: block !important;
}
.page-template-user-dashboard-template .jobsearch-row.jobsearch-employer-profile-form > li.jobsearch-column-6:not([style*="display: none"]):not([style*="display:none"]) {
  width: 50% !important;
  max-width: 50% !important;
  padding: 0 12px !important;
  margin: 0 0 18px !important;
  box-sizing: border-box !important;
}
.page-template-user-dashboard-template .jobsearch-row.jobsearch-employer-profile-form > li.jobsearch-column-12:not([style*="display: none"]):not([style*="display:none"]) {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 12px !important;
  margin: 0 0 18px !important;
  box-sizing: border-box !important;
}
/* Force display: none reste prioritaire si pose en inline */
.page-template-user-dashboard-template li[style*="display: none"],
.page-template-user-dashboard-template li[style*="display:none"] {
  display: none !important;
}

/* --- 28.3 SIDEBAR : layout vertical strict des enfants ------------------ */
/* Cible aussi les wrappers intermediaires .jobsearch-typo-wrap qui peuvent
 * exister entre la nav et le h2/figure. */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > .jobsearch-typo-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  text-align: center;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > *,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > .jobsearch-typo-wrap > * {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  clear: both !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  position: relative !important;
}

/* Le H2 (nom entreprise) : block, centre, full width, pas de wrap caractere */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav h2,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > h2,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-typo-wrap h2 {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--tp-navy) !important;
  margin: 12px 0 4px !important;
  line-height: 1.3 !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  white-space: normal !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav h2 a {
  display: inline !important;
  width: auto !important;
  color: inherit !important;
  text-decoration: none !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-dashboard-subtitle {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  font-size: 12.5px !important;
  color: var(--tp-text-muted) !important;
  margin: 0 0 18px !important;
}

/* Widget upload + son loader : block pleine largeur centre, dans le flow */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .fileUpLoader {
  display: block !important;
  width: 100% !important;
  float: none !important;
  clear: both !important;
  text-align: center !important;
  margin: 14px auto 0 !important;
  position: relative !important;
}

/* --- 28.4 ALIGNEMENT VERTICAL DES COLONNES ----------------------------- */
.page-template-user-dashboard-template .jobsearch-column-3,
.page-template-user-dashboard-template .jobsearch-column-9 {
  align-self: flex-start !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}
.page-template-user-dashboard-template .jobsearch-column-3 > *:first-child,
.page-template-user-dashboard-template .jobsearch-column-9 > *:first-child,
.page-template-user-dashboard-template .jobsearch-column-9 > .jobsearch-typo-wrap > *:first-child {
  margin-top: 0 !important;
}

/* Sticky uniquement desktop avec offset propre */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav {
  margin-top: 0 !important;
}
@media (min-width: 1025px) {
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav {
    position: sticky !important;
    top: 24px !important;
  }
}

/* ===========================================================================
 * 29. PATCH v1.0.34 : espace en haut + icones sidebar + aeration generale
 * --------------------------------------------------------------------------- */

/* --- 29.1 PLUS D'ESPACE EN HAUT du dashboard --------------------------- */
/* Bump le padding-top de 48px a 80px pour decoller franchement du header.
 * Et plus de gap entre les sections internes pour aerer. */
.page-template-user-dashboard-template .jobsearch-main-content,
.page-template-user-dashboard-template .jobsearch-plugin-default-container {
  padding-top: 80px !important;
  padding-bottom: 64px !important;
}

/* --- 29.2 ICONES MENU SIDEBAR : restaure l'affichage des <i> ----------- */
/* Mon CSS a pu masquer les icones FontAwesome. On force inline-flex
 * pour qu'elles reapparaissent en debut de chaque item. */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 14px !important;
  border-radius: 10px !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: var(--tp-text-muted) !important;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a i,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a > i,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a .fa,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a [class*="fa-"],
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a [class*="careerfy-icon"],
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a [class*="jobsearch-icon"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  color: var(--tp-text-muted) !important;
  width: 22px !important;
  height: 22px !important;
  flex-shrink: 0 !important;
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome",
               "careerfy-icon-fonts", "jobsearch-icon-fonts", inherit !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  transition: color 0.15s ease !important;
  margin: 0 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.current-menu-item > a i,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.active > a i {
  color: var(--tp-warm) !important;
}

/* --- 29.3 AERATION GENERALE : plus de respiration ------------------- */
/* Sections du contenu : padding genereux + gap entre elles */
.page-template-user-dashboard-template .jobsearch-typo-wrap .dashboard-main-page-section,
.page-template-user-dashboard-template .jobsearch-dashboard-section,
.page-template-user-dashboard-template .user-dashboard-content section,
.page-template-user-dashboard-template .user-dashboard-content .section-box,
.page-template-user-dashboard-template .jobsearch-employer-box-section,
.page-template-user-dashboard-template .jobsearch-applicants-graph {
  padding: 32px 36px !important;
  margin-bottom: 32px !important;
  border-radius: 18px !important;
}

/* Titres de section : marge dessous + separateur plus espace */
.page-template-user-dashboard-template .jobsearch-profile-title,
.page-template-user-dashboard-template .jobsearch-section-title {
  margin: 0 0 28px !important;
  padding-bottom: 22px !important;
}

/* Sidebar nav : padding generaux pour aerer */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav {
  padding: 32px 22px !important;
  border-radius: 18px !important;
}
/* Avatar : descend un peu pour respiration au-dessus */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > figure,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > .user_img_skillid,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-typo-wrap > figure {
  margin: 4px 0 16px !important;
}
/* Espace au-dessus du menu : separateur subtle */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul {
  margin-top: 20px !important;
  padding-top: 20px !important;
  border-top: 1px solid var(--tp-border) !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li {
  margin: 0 0 6px !important;
}

/* KPI cards : padding plus genereux et gap inter-cards */
.page-template-user-dashboard-template .jobsearch-stats-list > ul {
  gap: 20px !important;
  margin: 8px 0 0 !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list-wrap {
  padding: 26px 28px !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list-wrap h6 {
  margin: 0 0 14px !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list-wrap span {
  margin: 0 0 12px !important;
}

/* Graphique : padding genereux */
.page-template-user-dashboard-template .jobsearch-applicants-graph {
  padding: 32px 36px !important;
  gap: 40px !important;
}

/* Bandeau statut : plus de padding et separation */
.page-template-user-dashboard-template .jobsearch-account-status-bar,
.page-template-user-dashboard-template .user-account-status,
.page-template-user-dashboard-template .dashboard-account-status-bar,
.page-template-user-dashboard-template .jobsearch-typo-wrap .alert-info,
.page-template-user-dashboard-template .jobsearch-info-banner {
  padding: 20px 24px !important;
  margin-bottom: 32px !important;
  line-height: 1.6 !important;
}

/* Cards formulaire : meme aeration */
.page-template-user-dashboard-template .jobsearch-employer-box-section .jobsearch-row.jobsearch-employer-profile-form {
  margin-top: 12px !important;
}
.page-template-user-dashboard-template .jobsearch-employer-profile-form > li {
  margin-bottom: 22px !important;
}

/* ===========================================================================
 * 30. PATCH v1.0.35 : icones inline + masque menu mobile sur desktop
 * --------------------------------------------------------------------------- */

/* --- 30.1 ICONES : force inline a gauche du texte ---------------------- */
/* Le plugin positionne souvent les icones en absolute. On reset tout. */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  padding: 12px 14px 12px 14px !important;
  border-radius: 10px !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: var(--tp-text-muted) !important;
  text-decoration: none !important;
  position: relative !important;
  text-indent: 0 !important;
  background-image: none !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a i,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a > i,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a .fa,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a [class*="fa-"],
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a [class*="careerfy-icon"],
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a [class*="jobsearch-icon"] {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  flex: 0 0 22px !important;
  font-size: 15px !important;
  line-height: 1 !important;
  color: inherit !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
  text-align: center !important;
  order: -1 !important;
}

/* --- 30.2 MASQUE LE MENU MOBILE SUR DESKTOP --------------------------- */
/* Les classes typiques du menu mobile JobSearch : trigger hamburger,
 * close button rouge, et le menu duplique en haut a droite. */
@media (min-width: 1025px) {
  .page-template-user-dashboard-template .jobsearch-mobile-menu,
  .page-template-user-dashboard-template .jobsearch-mobile-menu-trigger,
  .page-template-user-dashboard-template .jobsearch-mobile-menu-close,
  .page-template-user-dashboard-template .jobsearch-mobile-menu-wrap,
  .page-template-user-dashboard-template .jobsearch-mobile-menu-bars,
  .page-template-user-dashboard-template .mobile-menu-icon,
  .page-template-user-dashboard-template .jobsearch-dashboard-mobile-trigger,
  .page-template-user-dashboard-template .responsive-toggle,
  .page-template-user-dashboard-template .jobsearch-trigmenu-mobile,
  .page-template-user-dashboard-template .jobsearch-dashside-mobnav,
  .page-template-user-dashboard-template .jobsearch-dashside-mobclose {
    display: none !important;
  }
}

/* Sur mobile, le bouton hamburger reprend un look propre */
.page-template-user-dashboard-template .jobsearch-mobile-menu-trigger,
.page-template-user-dashboard-template .jobsearch-trigmenu-mobile {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
}
.page-template-user-dashboard-template .jobsearch-mobile-menu-close,
.page-template-user-dashboard-template .jobsearch-dashside-mobclose {
  background: var(--tp-danger) !important;
  color: #fff !important;
  border-radius: 8px !important;
}

/* --- 30.3 ITEMS DU MENU : hover et active polish ----------------------- */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a:hover {
  background: rgba(22, 49, 92, 0.06) !important;
  color: var(--tp-navy) !important;
  transform: translateX(2px);
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a:hover i {
  color: var(--tp-navy) !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.current-menu-item > a,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.active > a,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.jobsearch-current-tab > a {
  background: var(--tp-navy) !important;
  color: #fff !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 12px rgba(22, 49, 92, 0.22);
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.current-menu-item > a i,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.active > a i {
  color: var(--tp-warm) !important;
}

/* ===========================================================================
 * 31. PATCH v1.0.36 : alignement gauche menu + masque double menu + espace
 * --------------------------------------------------------------------------- */

/* --- 31.1 ESPACE EN HAUT DU DASHBOARD : source unique de verite --------
 * Les patchs precedents (56/48/80/120px) s'empilaient sur .jobsearch-main-content
 * ET .jobsearch-plugin-default-container (imbriques) => risque de double
 * padding une fois le cache reconstruit. On remet a plat : espace porte
 * uniquement par le conteneur reel, main-content neutralise. */
/* NB : l'espace en haut du dashboard est desormais gere dans style.css
 * (exception au reset global .careerfy-wrapper > *:not(#id)). Inutile ici :
 * ce reset gagnait en specificite (2,1,2) et ecrasait toute regle posee sur
 * .jobsearch-main-content depuis ce fichier. Voir style.css. */

/* --- 31.2 ITEMS DU MENU : texte ALIGNE A GAUCHE quand il wrap -------- */
/* Mon ancien CSS herite text-align: center du parent nav. On force left. */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li {
  text-align: left !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a {
  text-align: left !important;
  justify-content: flex-start !important;
  align-items: center !important;
  line-height: 1.35 !important;
}
/* Quand le label wrap sur 2 lignes, le texte reste a gauche, pas centre */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a > span,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a {
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

/* --- 31.3 MASQUE LE DOUBLE MENU sur desktop -------------------------- */
@media (min-width: 1025px) {
  /* Toute occurrence dupliquee de la nav apres la premiere : masquee */
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ~ .jobsearch-employer-dashboard-nav,
  .page-template-user-dashboard-template .jobsearch-employer-dashboard-nav + .jobsearch-employer-dashboard-nav {
    display: none !important;
  }
  /* Tous les triggers / boutons mobiles : aucun ne doit s'afficher */
  .page-template-user-dashboard-template [class*="mobnav"],
  .page-template-user-dashboard-template [class*="mob-nav"],
  .page-template-user-dashboard-template [class*="mobile-trigger"],
  .page-template-user-dashboard-template [class*="mobile-toggle"],
  .page-template-user-dashboard-template [class*="mobile-menu"],
  .page-template-user-dashboard-template [class*="dashside-mob"],
  .page-template-user-dashboard-template [class*="dashboard-mob"],
  .page-template-user-dashboard-template [class*="empdash-mob"],
  .page-template-user-dashboard-template [class*="trigmenu"],
  .page-template-user-dashboard-template .fa-bars + .jobsearch-employer-dashboard-nav,
  .page-template-user-dashboard-template .mobile-nav-bars,
  .page-template-user-dashboard-template .nav-bars-trigger {
    display: none !important;
  }
  /* Cible aussi par structure : un <i class="fa-bars"> isole */
  .page-template-user-dashboard-template .jobsearch-column-3 i.fa-bars,
  .page-template-user-dashboard-template .jobsearch-column-3 .fa.fa-bars,
  .page-template-user-dashboard-template .jobsearch-column-3 button.fa-bars,
  .page-template-user-dashboard-template .jobsearch-column-3 a.fa-bars {
    display: none !important;
  }
}

/* --- 31.4 CENTRE LE BOUTON "Telechargez votre logo" ---------------- */
/* La figure (avatar) et le bouton fileUpload sont chacun bien centres */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > figure,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > .user_img_skillid,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-typo-wrap > figure {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  margin: 0 auto 0 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-saved-img-holder {
  margin-left: auto !important;
  margin-right: auto !important;
}
/* Le widget upload : pleine largeur, contenu centre */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  margin: 16px auto 0 !important;
}
/* Le span (label texte "Téléchargez votre logo") devient le bouton pill */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload > span,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload > .fileUpLoader {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  margin: 0 auto !important;
  padding: 10px 18px !important;
  background: #fff !important;
  color: var(--tp-navy) !important;
  border: 1px solid var(--tp-navy) !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  width: auto !important;
  max-width: 100% !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload > span:hover {
  background: var(--tp-navy) !important;
  color: #fff !important;
}

/* --- 31.5 BAISSE LE NOM DE L'ENTITE sous le bouton upload --------- */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav h2,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > h2,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-typo-wrap h2 {
  margin-top: 24px !important;  /* etait 12px, on baisse */
  margin-bottom: 6px !important;
}

/* ===========================================================================
 * 32. PATCH v1.0.37 : masque icones sections + fix dropdowns
 * --------------------------------------------------------------------------- */

/* --- 32.1 MASQUE LES ICONES JobSearch dans les titres de section ---
 * Cible "Gestionnaires du compte" (Account Members) et "Prix et recompenses"
 * (Awards) qui partagent la structure .jobsearch-candidate-title h2 > i */
.page-template-user-dashboard-template .jobsearch-candidate-title h2 > i,
.page-template-user-dashboard-template .jobsearch-candidate-title h2 .jobsearch-icon,
.page-template-user-dashboard-template .jobsearch-candidate-title h2 .jobsearch-group,
.page-template-user-dashboard-template .jobsearch-candidate-resume-wrap .jobsearch-candidate-title h2 i {
  display: none !important;
}

/* On reprend la marge / l'espacement perdu par le retrait de l'icone */
.page-template-user-dashboard-template .jobsearch-candidate-title h2 {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--tp-navy) !important;
  margin: 0 0 18px !important;
  padding-left: 0 !important;
}
.page-template-user-dashboard-template .jobsearch-candidate-title h2 a {
  margin-left: auto !important;  /* bouton "Ajouter un X" pousse a droite */
}

/* --- 32.2 LISTES DEROULANTES (select / select2) reactivees -------------- */

/* Native <select> : si select2 ne l'a pas encore enveloppe, on l'affiche
 * proprement avec le chevron CSS au lieu du look browser-default ramene
 * par mon CSS qui forcait height:auto */
.page-template-user-dashboard-template .jobsearch-typo-wrap select:not(.select2-hidden-accessible),
.page-template-user-dashboard-template .user-dashboard-content select:not(.select2-hidden-accessible),
.jobsearch-modal select:not(.select2-hidden-accessible) {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2316315c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='4 6 8 10 12 6'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 14px !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  padding: 12px 40px 12px 16px !important;
  color: var(--tp-navy) !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14.5px !important;
  width: 100% !important;
  height: 46px !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
.page-template-user-dashboard-template .jobsearch-typo-wrap select:not(.select2-hidden-accessible):focus,
.page-template-user-dashboard-template .user-dashboard-content select:not(.select2-hidden-accessible):focus {
  border-color: var(--tp-navy) !important;
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
}
/* Cache la version native quand select2 est applique */
select.select2-hidden-accessible {
  display: block !important;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  border: 0 !important;
}

/* Wrapper select2 visible : meme look que les inputs */
.select2-container--default .select2-selection--single {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  height: 46px !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  outline: none !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--tp-navy) !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  line-height: 44px !important;
  padding: 0 !important;
  padding-right: 26px !important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--tp-text-muted) !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  position: absolute !important;
  top: 0 !important;
  right: 10px !important;
  height: 44px !important;
  width: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border: none !important;
  width: 12px !important;
  height: 12px !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2316315c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='4 6 8 10 12 6'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 12px !important;
  margin: 0 !important;
  position: static !important;
  display: block !important;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  transform: rotate(180deg) !important;
}
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--single {
  border-color: var(--tp-navy) !important;
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
}

/* Le panel dropdown ouvert : style propre */
.select2-container--default .select2-dropdown {
  border: 1px solid var(--tp-navy) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 32px rgba(10, 31, 68, 0.15) !important;
  margin-top: 6px !important;
  background: #fff !important;
  overflow: hidden !important;
}
.select2-container--default .select2-dropdown.select2-dropdown--above {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}
.select2-container--default .select2-results__options {
  max-height: 280px !important;
}
.select2-container--default .select2-results__option {
  padding: 10px 16px !important;
  color: var(--tp-navy) !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14px !important;
  cursor: pointer !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background: var(--tp-navy) !important;
  color: #fff !important;
}
.select2-container--default .select2-results__option[aria-selected=true] {
  background: var(--tp-bg-soft) !important;
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
}
.select2-container--default .select2-search--dropdown {
  padding: 10px !important;
  background: var(--tp-bg-soft) !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid var(--tp-border) !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  background: #fff !important;
  color: var(--tp-navy) !important;
  outline: none !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
  border-color: var(--tp-navy) !important;
}

/* Empeche un eventuel doublon visuel : select natif + wrapper select2
 * superposes. On force la priorite au wrapper. */
.select2-container {
  z-index: 1 !important;
}
.select2-container--open {
  z-index: 999999 !important;
}

/* ===========================================================================
 * 33. PATCH v1.0.38 : reorganisation Mon profil (Option A 6 sections)
 * --------------------------------------------------------------------------- */

/* Le form parent passe en flex column pour que `order` fonctionne */
.page-template-user-dashboard-template form#employer-profilesetings-form,
.page-template-user-dashboard-template form.jobsearch-employer-dasboard,
.page-template-user-dashboard-template .jobsearch-employer-dasboard {
  display: flex !important;
  flex-direction: column !important;
}

/* Reorder via classes ajoutees par jobsearch-taiara.js a partir du titre h2
 * (plus robuste que nth-of-type qui se decale quand on ajoute/retire
 * des sections cote backend). */
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--identite      { order: 1 !important; }
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--contact       { order: 2 !important; }
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--localisation  { order: 3 !important; }
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--accueil       { order: 4 !important; }
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--medias        { order: 5 !important; }
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--membres       { order: 6 !important; }
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--prix          { order: 7 !important; }
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--gestion       { order: 8 !important; }
/* Fallback pour les sections sans titre reconnu : derniere position */
.page-template-user-dashboard-template .jobsearch-employer-box-section:not([class*="tp-sec--"]) { order: 50 !important; }

/* MASQUE la section "Informations administratives" si elle est vide
 * (tous les champs custom ayant ete supprimes en backend) */
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--admin.tp-sec--empty {
  display: none !important;
}
/* Si non vide, la classer apres Localisation et avant Accueil */
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--admin {
  order: 4 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--accueil {
  order: 5 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--medias {
  order: 6 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--membres {
  order: 7 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--prix {
  order: 8 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-box-section.tp-sec--gestion {
  order: 9 !important;
}

/* Le bouton submit reste tout en bas, aligne a gauche */
.page-template-user-dashboard-template form#employer-profilesetings-form > input[type="submit"],
.page-template-user-dashboard-template form.jobsearch-employer-dasboard > input[type="submit"],
.page-template-user-dashboard-template .jobsearch-employer-profile-submit {
  order: 99 !important;
  align-self: flex-start !important;
  margin-top: 32px !important;
}

/* ===========================================================================
 * 34. PATCH v1.0.39 : masque toutes les bannieres / cover images JobSearch
 * --------------------------------------------------------------------------- */

/* --- 34.1 BANNIERE WIDGET UPLOAD sur Mon profil (employer + candidate) -- */
/* Widget "Telecharger une image de banniere" dans le dashboard */
.jobsearch-employer-cvr-img,
.jobsearch-candidate-cvr-img,
.jobsearch-emp-cvr-img,
.jobsearch-cand-cvr-img,
.dashboard-cvr-img,
.cover-image-upload-wrap,
[class*="-cvr-img"] {
  display: none !important;
}

/* --- 34.2 BANNIERE HEADER sur les pages publiques ----------------------- */
/* Cover image affichee sur la page profil employeur public et sur la page
 * detail d'une offre (employeur cover en background du sub-header) */
.jobsearch-job-subheader,
.jobsearch-emp-cover-section,
.jobsearch-employer-cover-section,
.jobsearch-detail-banner,
.jobsearch-detail-page-banner,
.jobsearch-employer-detail-banner,
.jobsearch-candidate-detail-banner,
.jobsearch-banner-transparent {
  display: none !important;
}

/* --- 34.3 BOUTON Telecharger banniere (au cas ou il survit hors widget) -- */
.jobsearch-upload-banner-btn,
.jobsearch-upload-cover-btn,
.employer-banner-upload,
.candidate-banner-upload,
button.upload-cover,
a.upload-cover,
[class*="upload-banner"],
[class*="upload-cover"] {
  display: none !important;
}

/* --- 34.4 RESTE-T-IL DU MARGE / PADDING vide laisse par le retrait ? ---- */
/* Si la banniere etait dans une figure ou un wrapper, on rapproche les
 * elements suivants pour eviter un trou */
.page-template-user-dashboard-template .jobsearch-employer-cvr-img + .jobsearch-row,
.page-template-user-dashboard-template .jobsearch-employer-cvr-img + ul,
.page-template-user-dashboard-template .jobsearch-employer-cvr-img + div {
  margin-top: 0 !important;
}

/* ===========================================================================
 * 35. PATCH v1.0.40 : rapproche les champs apres retrait banniere + ajustes
 * --------------------------------------------------------------------------- */

/* --- 35.1 Section "Identite" : pas d'espace vide la ou etait la banniere -- */
/* La banniere etait entre le h2 du titre et le formulaire des champs.
 * On force le 1er ul du formulaire a coller au titre. */
.page-template-user-dashboard-template .jobsearch-employer-box-section .jobsearch-employer-cvr-img {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-box-section .jobsearch-profile-title {
  margin-bottom: 24px !important;
  padding-bottom: 18px !important;
}
/* Si la banniere etait dans un <figure> wrapper qui survit en flow */
.page-template-user-dashboard-template .jobsearch-employer-box-section > figure:empty,
.page-template-user-dashboard-template .jobsearch-employer-box-section figure.jobsearch-employer-cvr-img,
.page-template-user-dashboard-template .jobsearch-employer-box-section .jobsearch-employer-cvr-img + figure {
  display: none !important;
}
/* Le ul du formulaire colle au titre / aux erreurs */
.page-template-user-dashboard-template .jobsearch-profile-title + ul.jobsearch-row,
.page-template-user-dashboard-template .jobsearch-profile-title + .jobsearch-employer-cvr-img + ul.jobsearch-row,
.page-template-user-dashboard-template .jobsearch-profile-title ~ ul.jobsearch-row {
  margin-top: 0 !important;
}
/* Au cas ou la banniere laissait un margin-top sur l'element suivant */
.page-template-user-dashboard-template .jobsearch-employer-cvr-img + * {
  margin-top: 0 !important;
}

/* ===========================================================================
 * 36. PATCH v1.0.41 : widget upload photo dans la modale gestionnaire
 * --------------------------------------------------------------------------- */

.tp-member-avatar-upload {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 22px !important;
  margin: 0 0 22px !important;
  background: var(--tp-bg-soft) !important;
  border: 1px dashed rgba(22, 49, 92, 0.30) !important;
  border-radius: 14px !important;
}
.tp-member-avatar-upload__label {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--tp-navy) !important;
  letter-spacing: 0.3px;
  margin: 0 !important;
  display: block !important;
  text-align: center;
}
.tp-member-avatar-upload__label .tp-optional {
  color: var(--tp-text-muted);
  font-weight: 500;
  font-size: 12px;
  margin-left: 6px;
}
.tp-member-avatar-upload__preview {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--tp-border);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  box-shadow: 0 2px 8px rgba(10, 31, 68, 0.06);
}
.tp-member-avatar-upload__placeholder {
  color: var(--tp-text-muted);
  display: flex;
  align-items: center;
  justify-content: center;
}
.tp-member-avatar-upload__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.tp-member-avatar-upload__btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 16px !important;
  background: #fff !important;
  color: var(--tp-navy) !important;
  border: 1px solid var(--tp-navy) !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}
.tp-member-avatar-upload__btn:hover {
  background: var(--tp-navy) !important;
  color: #fff !important;
}
.tp-member-avatar-upload__input {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

/* ===========================================================================
 * 37. PATCH v1.0.42 : Code postal hardcode (id jobsearch_loc_postalcode_*)
 * --------------------------------------------------------------------------- */

/* Masque l'input Code postal natif */
[id^="jobsearch_loc_postalcode_"],
[id*="loc_postalcode"],
[id*="postalcode"],
input[name="postal_code"],
input[name="postalcode"],
input[name="zip_code"],
input[name="zipcode"] {
  display: none !important;
}

/* Masque le wrapper parent (li / column / div) qui contient cet input.
 * Utilise :has() pour cibler le parent qui hebergerait le champ */
li:has(input[id^="jobsearch_loc_postalcode_"]),
li:has(input[id*="postalcode"]),
li:has(input[name="postal_code"]),
.jobsearch-column-6:has(input[id*="postalcode"]),
.jobsearch-column-12:has(input[id*="postalcode"]),
.jobsearch-typo-wrap > div:has(> input[id*="postalcode"]),
.jobsearch-typo-wrap > div:has(> label + input[id*="postalcode"]) {
  display: none !important;
}

/* Masque aussi le label associe (pour fallback navigateurs sans :has) */
label[for^="jobsearch_loc_postalcode_"],
label[for*="postalcode"] {
  display: none !important;
}

/* ===========================================================================
 * 38. PATCH v1.0.46 : hauteurs reduites et harmonisees
 * --------------------------------------------------------------------------- */

/* --- 38.1 EDITEUR DE DESCRIPTION (TinyMCE / wp_editor) -------------- */
/* Reduit la hauteur par defaut + masque le bouton "Ajouter un media" */
.page-template-user-dashboard-template .wp-editor-wrap,
.page-template-user-dashboard-template .wp-editor-container {
  max-height: 280px !important;
}
.page-template-user-dashboard-template .wp-editor-container textarea.wp-editor-area,
.page-template-user-dashboard-template textarea.wp-editor-area,
.page-template-user-dashboard-template .mce-edit-area iframe,
.page-template-user-dashboard-template .wp-editor-container iframe[id$="_ifr"] {
  min-height: 180px !important;
  height: 180px !important;
  max-height: 220px !important;
}
/* Bouton "Ajouter un media" supprime visuellement */
.page-template-user-dashboard-template .wp-media-buttons,
.page-template-user-dashboard-template .wp-editor-tools .wp-media-buttons,
.page-template-user-dashboard-template .wp-editor-wrap .wp-media-buttons,
.page-template-user-dashboard-template .insert-media,
.page-template-user-dashboard-template button.add_media,
.page-template-user-dashboard-template a.add_media {
  display: none !important;
}
/* Ajuste la toolbar pour combler l'espace libere */
.page-template-user-dashboard-template .wp-editor-tools {
  padding-top: 0 !important;
  padding-bottom: 6px !important;
  min-height: 0 !important;
}

/* --- 38.2 ZONE UPLOAD photos / videos (Presentation enrichie) ------ */
/* Dropzone / zone "Telecharger des fichiers ici" : hauteur reduite */
.page-template-user-dashboard-template .dropzone,
.page-template-user-dashboard-template .jobsearch-dropzone,
.page-template-user-dashboard-template .jobsearch-photo-upload-area,
.page-template-user-dashboard-template .jobsearch-uploaded-photos,
.page-template-user-dashboard-template .jobsearch-cand-images-upload,
.page-template-user-dashboard-template .jobsearch-emp-images-upload,
.page-template-user-dashboard-template .jobsearch-mediaupload-section {
  min-height: 160px !important;
  padding: 24px 20px !important;
}
.page-template-user-dashboard-template .dropzone .dz-message,
.page-template-user-dashboard-template .jobsearch-dropzone .dz-message {
  margin: 8px 0 !important;
  font-size: 14px !important;
}
.page-template-user-dashboard-template .dropzone .dz-default,
.page-template-user-dashboard-template .dropzone .dz-message img {
  width: 56px !important;
  height: 56px !important;
  margin: 0 auto 10px !important;
}

/* --- 38.3 SECTIONS QUASI-VIDES : Membres, Prix, Gestion ------------ */
/* Quand on n'a encore rien ajoute, la section affiche juste son titre +
 * le bouton "+ Ajouter X". On retire l'espace vide en dessous. */
.page-template-user-dashboard-template .tp-sec--membres,
.page-template-user-dashboard-template .tp-sec--prix,
.page-template-user-dashboard-template .tp-sec--gestion {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
  min-height: auto !important;
}
/* Le wrapper "candidate-resume-wrap" autour du contenu peut creer un
 * vide -- on le force a hauteur auto */
.page-template-user-dashboard-template .tp-sec--membres .jobsearch-candidate-resume-wrap,
.page-template-user-dashboard-template .tp-sec--prix .jobsearch-candidate-resume-wrap,
.page-template-user-dashboard-template .tp-sec--gestion .jobsearch-candidate-resume-wrap {
  min-height: auto !important;
  padding-bottom: 0 !important;
}
/* Le titre h2 garde son separateur, mais on retire la marge dessous
 * pour que le bouton "+ Ajouter X" colle au titre */
.page-template-user-dashboard-template .tp-sec--membres .jobsearch-candidate-title,
.page-template-user-dashboard-template .tp-sec--prix .jobsearch-candidate-title,
.page-template-user-dashboard-template .tp-sec--gestion .jobsearch-candidate-title {
  margin-bottom: 0 !important;
}
/* Si la section a un placeholder "Aucun X" : compact */
.page-template-user-dashboard-template .tp-sec--membres .jobsearch-no-record,
.page-template-user-dashboard-template .tp-sec--prix .jobsearch-no-record,
.page-template-user-dashboard-template .tp-sec--gestion .jobsearch-no-record,
.page-template-user-dashboard-template .tp-sec--membres .jobsearch-empty-state,
.page-template-user-dashboard-template .tp-sec--prix .jobsearch-empty-state,
.page-template-user-dashboard-template .tp-sec--gestion .jobsearch-empty-state {
  padding: 16px 0 0 !important;
  font-size: 14px !important;
  color: var(--tp-text-muted) !important;
}

/* --- 38.4 HARMONISATION GENERALE des hauteurs de sections ---------- */
/* Toutes les sections utilisent le meme padding vertical pour creer
 * un rythme visuel coherent */
.page-template-user-dashboard-template .jobsearch-employer-box-section {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}
/* Le titre reste au top, separateur, contenu apres */
.page-template-user-dashboard-template .jobsearch-employer-box-section > .jobsearch-profile-title,
.page-template-user-dashboard-template .jobsearch-employer-box-section > .jobsearch-candidate-resume-wrap > .jobsearch-candidate-title {
  margin-bottom: 22px !important;
  padding-bottom: 18px !important;
}
/* La presentation enrichie / photos peut etre plus haute par essence */
.page-template-user-dashboard-template .tp-sec--medias {
  padding-bottom: 32px !important;
}

/* --- 38.5 SIDEBAR : hauteur calculee sur le menu visible uniquement -- */
/* Le second menu duplique (mobile) est masque mais le cadre parent gardait
 * la hauteur du contenu d'origine. On force height auto. */
.page-template-user-dashboard-template .jobsearch-column-3 {
  height: auto !important;
  min-height: 0 !important;
  align-self: flex-start !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > .jobsearch-typo-wrap {
  height: auto !important;
  min-height: 0 !important;
}
/* Tout dernier element du menu : pas de marge dessous qui creerait un vide */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li:last-child {
  margin-bottom: 0 !important;
}
/* Si le plugin ajoute un script/style/forme fantome apres le menu : caches */
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > script,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > style,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > form[style*="display: none"],
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > div[style*="display: none"] {
  display: none !important;
}

/* ===========================================================================
 * 39. PATCH v1.0.47 : dropdowns + tags TagIt visuels
 * --------------------------------------------------------------------------- */

/* --- 39.1 DROPDOWN : annule le "trait fantome" sous le select2 -------- */
/* Le <select> natif reste rendu et son rendu navigateur laisse une ligne
 * sous le wrapper select2. On le tue de tous les cotes. */
.page-template-user-dashboard-template select.select2-hidden-accessible,
select.select2-hidden-accessible {
  display: block !important;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
  background: transparent !important;
  pointer-events: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}
/* Si le plugin ajoute une "trace" sous le select2 (border-radius, ombre,
 * etc.), on l'efface */
.page-template-user-dashboard-template .select2-container--default .select2-selection {
  outline: none !important;
  box-shadow: none !important;
}
.page-template-user-dashboard-template .select2-container--default.select2-container--focus .select2-selection--single,
.page-template-user-dashboard-template .select2-container--default.select2-container--open .select2-selection--single {
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
}
/* Le `<li>` qui contient un select2 ne doit pas avoir de hauteur fantome */
.page-template-user-dashboard-template li:has(.select2-container) {
  min-height: 0 !important;
  height: auto !important;
}

/* --- 39.2 TAGS jQuery TagIt : override agressif -------------------- */
/* jQuery UI applique .ui-state-default avec gradient bleu. On override
 * en ciblant tous les selecteurs possibles avec specificite elevee. */
.page-template-user-dashboard-template ul.tagit,
.tagit.ui-widget,
.tagit.ui-widget-content,
ul.tagit.ui-widget.ui-widget-content {
  background: #fff !important;
  background-image: none !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  padding: 6px 8px !important;
  min-height: 46px !important;
  font-family: "Inter", sans-serif !important;
}

.page-template-user-dashboard-template ul.tagit li.tagit-choice,
.page-template-user-dashboard-template ul.tagit li.tagit-choice.ui-widget-content,
.page-template-user-dashboard-template ul.tagit li.tagit-choice.ui-widget-content.ui-state-default,
.page-template-user-dashboard-template ul.tagit li.tagit-choice.ui-state-default,
ul.tagit li.tagit-choice,
ul.tagit li.tagit-choice.ui-widget-content,
ul.tagit li.tagit-choice.ui-widget-content.ui-state-default,
ul.tagit li.tagit-choice.ui-state-default {
  background: rgba(22, 49, 92, 0.10) !important;
  background-color: rgba(22, 49, 92, 0.10) !important;
  background-image: none !important;
  background-repeat: no-repeat !important;
  border: 1px solid rgba(22, 49, 92, 0.25) !important;
  color: var(--tp-navy) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  margin: 3px 4px 3px 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-family: "Inter", sans-serif !important;
  line-height: 1.4 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.page-template-user-dashboard-template ul.tagit li.tagit-choice a.tagit-label,
.page-template-user-dashboard-template ul.tagit li.tagit-choice .tagit-label,
ul.tagit li.tagit-choice a.tagit-label,
ul.tagit li.tagit-choice span.tagit-label {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  font-family: "Inter", sans-serif !important;
}

.page-template-user-dashboard-template ul.tagit li.tagit-choice .tagit-close,
ul.tagit li.tagit-choice .tagit-close {
  color: var(--tp-navy) !important;
  background: transparent !important;
  border: none !important;
  margin: 0 0 0 4px !important;
  padding: 0 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  opacity: 0.55 !important;
  cursor: pointer !important;
  transition: opacity 0.15s ease, color 0.15s ease !important;
  position: static !important;
  top: auto !important;
  right: auto !important;
  text-shadow: none !important;
}
.page-template-user-dashboard-template ul.tagit li.tagit-choice .tagit-close:hover,
ul.tagit li.tagit-choice .tagit-close:hover {
  opacity: 1 !important;
  color: var(--tp-danger) !important;
}
/* Le carre rouge UI default sur le bouton X */
.page-template-user-dashboard-template ul.tagit .tagit-close .ui-icon-close,
ul.tagit .tagit-close .ui-icon-close,
ul.tagit .tagit-close .ui-icon {
  display: none !important;
}
.page-template-user-dashboard-template ul.tagit .tagit-close .text-icon,
ul.tagit .tagit-close .text-icon {
  display: inline !important;
  color: inherit !important;
  font-family: "Inter", sans-serif !important;
}

/* Input de saisie nouveaux tags : compact, propre */
.page-template-user-dashboard-template ul.tagit li.tagit-new {
  padding: 4px !important;
  margin: 0 !important;
}
.page-template-user-dashboard-template ul.tagit li.tagit-new input,
.page-template-user-dashboard-template ul.tagit li.tagit-new input.ui-widget-content,
ul.tagit li.tagit-new input,
ul.tagit li.tagit-new input.ui-widget-content {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  outline: none !important;
  padding: 4px 8px !important;
  font-size: 14px !important;
  color: var(--tp-navy) !important;
  box-shadow: none !important;
  font-family: "Inter", sans-serif !important;
  min-width: 120px !important;
  width: auto !important;
  height: auto !important;
}

/* Pas de hauteur "monstrueuse" sur la div en dessous */
.page-template-user-dashboard-template ul.tagit + div,
.page-template-user-dashboard-template .tagit-autocomplete {
  min-height: 0 !important;
}

/* ===========================================================================
 * 40. PATCH v1.0.48 : masquer les etoiles * des champs obligatoires
 * --------------------------------------------------------------------------- */
.page-template-user-dashboard-template label .required,
.page-template-user-dashboard-template label span.required,
.page-template-user-dashboard-template label .jobsearch-required,
.page-template-user-dashboard-template label .req-mark,
.page-template-user-dashboard-template label abbr.required,
.page-template-user-dashboard-template label abbr[title*="required" i],
.page-template-user-dashboard-template label abbr[title*="obligatoire" i],
.page-template-user-dashboard-template .jobsearch-typo-wrap label .required,
.jobsearch-modal label .required,
.jobsearch-modal label abbr[title*="required" i] {
  display: none !important;
}

/* ===========================================================================
 * 41. Onglets TinyMCE (Visuel / Code) MASQUÉS sur le dashboard.
 * --------------------------------------------------------------------------- */
/* L'editeur WP expose 2 onglets en haut a droite : "Visuel" (TinyMCE) et
 * "Code" (textarea HTML). Cote candidat ils ne sont pas rendus (config
 * d'editeur) ; cote recruteur ("Presentation de l'entite") ils apparaissent.
 * On les masque partout sur le dashboard pour homogeneiser : l'editeur reste
 * en mode Visuel par defaut, pas de bascule "Code" exposee aux utilisateurs.
 * (Les regles de couleur ci-dessous deviennent sans effet mais sont inoffensives.) */
.page-template-user-dashboard-template .wp-editor-tabs,
.page-template-user-dashboard-template .wp-editor-wrap .wp-editor-tabs,
.page-template-user-dashboard-template .wp-editor-wrap .wp-switch-editor {
  display: none !important;
}
.page-template-user-dashboard-template .wp-editor-tabs .wp-switch-editor,
.page-template-user-dashboard-template .wp-editor-tabs .wp-switch-editor.switch-html,
.page-template-user-dashboard-template .wp-editor-tabs .wp-switch-editor.switch-tmce {
  background: transparent !important;
  background-image: none !important;
  color: var(--tp-text-muted) !important;
  border: 1px solid transparent !important;
  border-radius: 8px 8px 0 0 !important;
  padding: 8px 16px !important;
  font-family: "Inter", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease !important;
  cursor: pointer !important;
  outline: none !important;
}
.page-template-user-dashboard-template .wp-editor-tabs .wp-switch-editor:hover {
  background: var(--tp-bg-soft) !important;
  color: var(--tp-navy) !important;
  border-color: var(--tp-border) !important;
}
.page-template-user-dashboard-template .wp-editor-tabs .wp-switch-editor:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(22, 49, 92, 0.18) !important;
}
/* Onglet actif (Visuel ou Code) : navy plein, texte blanc */
.page-template-user-dashboard-template .wp-editor-wrap.tmce-active .wp-editor-tabs .switch-tmce,
.page-template-user-dashboard-template .wp-editor-wrap.html-active .wp-editor-tabs .switch-html {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border-color: var(--tp-navy) !important;
  border-bottom-color: transparent !important;
}
.page-template-user-dashboard-template .wp-editor-wrap.tmce-active .wp-editor-tabs .switch-tmce:hover,
.page-template-user-dashboard-template .wp-editor-wrap.html-active .wp-editor-tabs .switch-html:hover {
  background: var(--tp-navy-deep, #0d2046) !important;
  color: #fff !important;
}

/* On retire l'onglet "Code" (mode HTML) de l'editeur : seul "Visuel" reste.
   L'editeur demarre en mode Visuel (tmce-active) par defaut : aucun risque de
   rester bloque en Code. */
.page-template-user-dashboard-template .wp-editor-tabs .wp-switch-editor.switch-html {
  display: none !important;
}

/* ===========================================================================
 * 42. PATCH v1.0.50 : harmonisation boutons "+ Ajouter X" (memes dimensions)
 * --------------------------------------------------------------------------- */
/* Les boutons "+ Ajouter un prix", "+ Ajouter un membre", "+ Ajouter un
 * gestionnaire" ont chacun leur classe propre. On les normalise tous a la
 * meme taille + meme look. */
.page-template-user-dashboard-template .jobsearch-candidate-title h2 > a,
.page-template-user-dashboard-template .jobsearch-resume-addbtn,
.page-template-user-dashboard-template .jobsearch-portfolio-add-btn,
.page-template-user-dashboard-template .jobsearch-empmember-add-popup,
.page-template-user-dashboard-template .jobsearch-add-award-btn,
.page-template-user-dashboard-template .jobsearch-add-member-btn,
.page-template-user-dashboard-template a.jobsearch-add-manager-btn,
.page-template-user-dashboard-template a.jobsearch-add-prize-btn,
.page-template-user-dashboard-template .tp-sec--membres .jobsearch-candidate-title h2 > a,
.page-template-user-dashboard-template .tp-sec--prix .jobsearch-candidate-title h2 > a,
.page-template-user-dashboard-template .tp-sec--gestion .jobsearch-candidate-title h2 > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 180px !important;
  width: auto !important;
  height: 42px !important;
  padding: 0 18px !important;
  background: var(--tp-navy) !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid var(--tp-navy) !important;
  border-radius: 999px !important;
  font-family: "Inter", sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  letter-spacing: 0.1px !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  box-shadow: 0 2px 6px rgba(22, 49, 92, 0.18) !important;
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease !important;
  margin: 0 !important;
}
.page-template-user-dashboard-template .jobsearch-candidate-title h2 > a:hover,
.page-template-user-dashboard-template .jobsearch-resume-addbtn:hover,
.page-template-user-dashboard-template .jobsearch-portfolio-add-btn:hover,
.page-template-user-dashboard-template .jobsearch-empmember-add-popup:hover {
  background: var(--tp-navy-deep, #0d2046) !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 14px rgba(22, 49, 92, 0.25) !important;
}
/* L'icone "+" (fa fa-plus) dans le bouton : taille fixe, couleur blanche */
.page-template-user-dashboard-template .jobsearch-candidate-title h2 > a > span.fa-plus,
.page-template-user-dashboard-template .jobsearch-candidate-title h2 > a > .fa,
.page-template-user-dashboard-template .jobsearch-candidate-title h2 > a > i,
.page-template-user-dashboard-template .jobsearch-candidate-title h2 > a > [class*="fa-"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 14px !important;
  height: 14px !important;
  font-size: 13px !important;
  color: #fff !important;
  line-height: 1 !important;
  margin: 0 !important;
}

/* ===========================================================================
 * 43. PATCH v1.0.51 : boutons de mise en forme TinyMCE (B I U liste, etc.)
 * --------------------------------------------------------------------------- */
/* TinyMCE rendu inside .mce-tinymce dans WP : barres d'outils, boutons
 * icones (gras, italique, listes, alignement, lien, undo/redo). */

/* Bandeau de la toolbar : fond beige soft, separateur subtle */
.page-template-user-dashboard-template .mce-toolbar-grp,
.page-template-user-dashboard-template .mce-tinymce .mce-toolbar-grp,
.page-template-user-dashboard-template .mce-tinymce .mce-stack-layout {
  background: var(--tp-bg-soft) !important;
  border-bottom: 1px solid var(--tp-border) !important;
}
.page-template-user-dashboard-template .mce-toolbar {
  background: transparent !important;
  border: none !important;
  padding: 4px 6px !important;
}

/* Chaque bouton de la toolbar : transparent au repos, navy au hover */
.page-template-user-dashboard-template .mce-btn,
.page-template-user-dashboard-template .mce-toolbar .mce-btn {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  margin: 1px 2px !important;
  padding: 0 !important;
  transition: background 0.12s ease, border-color 0.12s ease !important;
}
.page-template-user-dashboard-template .mce-btn button {
  padding: 6px 10px !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  color: var(--tp-text-muted) !important;
  font-family: "Inter", sans-serif !important;
  font-size: 13px !important;
  text-shadow: none !important;
  cursor: pointer !important;
}

/* L'icone elle-meme (gras "B", italique "I", liste, alignement, etc.) */
.page-template-user-dashboard-template .mce-btn .mce-ico,
.page-template-user-dashboard-template .mce-btn i.mce-ico {
  color: var(--tp-navy) !important;
  font-size: 16px !important;
  line-height: 1 !important;
  text-shadow: none !important;
  transition: color 0.12s ease !important;
}

/* HOVER : bg-soft beige plus dense, icone navy bolder */
.page-template-user-dashboard-template .mce-btn:hover,
.page-template-user-dashboard-template .mce-btn.mce-btn-has-text:hover,
.page-template-user-dashboard-template .mce-btn-group .mce-btn:hover {
  background: rgba(22, 49, 92, 0.10) !important;
  border-color: rgba(22, 49, 92, 0.15) !important;
}
.page-template-user-dashboard-template .mce-btn:hover .mce-ico,
.page-template-user-dashboard-template .mce-btn:hover i.mce-ico {
  color: var(--tp-navy) !important;
}
.page-template-user-dashboard-template .mce-btn:hover button {
  color: var(--tp-navy) !important;
}

/* FOCUS : ring navy subtle */
.page-template-user-dashboard-template .mce-btn:focus,
.page-template-user-dashboard-template .mce-btn.mce-focused {
  background: rgba(22, 49, 92, 0.10) !important;
  border-color: var(--tp-navy) !important;
  box-shadow: 0 0 0 2px rgba(22, 49, 92, 0.15) !important;
}

/* ACTIVE (bouton enfonce, ex: Gras applique sur du texte selectionne) */
.page-template-user-dashboard-template .mce-btn.mce-active,
.page-template-user-dashboard-template .mce-btn.mce-active:hover,
.page-template-user-dashboard-template .mce-btn.mce-active:focus {
  background: var(--tp-navy) !important;
  border-color: var(--tp-navy) !important;
  box-shadow: none !important;
}
.page-template-user-dashboard-template .mce-btn.mce-active .mce-ico,
.page-template-user-dashboard-template .mce-btn.mce-active i.mce-ico,
.page-template-user-dashboard-template .mce-btn.mce-active button {
  color: #fff !important;
}

/* Bouton DISABLED (undo/redo quand rien a annuler) : transparent gris pale */
.page-template-user-dashboard-template .mce-btn.mce-disabled,
.page-template-user-dashboard-template .mce-btn.mce-disabled:hover {
  background: transparent !important;
  border-color: transparent !important;
  cursor: default !important;
}
.page-template-user-dashboard-template .mce-btn.mce-disabled .mce-ico,
.page-template-user-dashboard-template .mce-btn.mce-disabled i.mce-ico {
  color: var(--tp-text-muted) !important;
  opacity: 0.5 !important;
}

/* Groupes de boutons (B I U | listes | aligne) : separateur subtle entre groupes */
.page-template-user-dashboard-template .mce-btn-group:not(:first-child):not(:last-child) {
  border-left: 1px solid var(--tp-border) !important;
  padding-left: 6px !important;
  margin-left: 4px !important;
}
.page-template-user-dashboard-template .mce-btn-group {
  border: none !important;
  background: transparent !important;
}

/* Toolbar de status-bar (compteur de mots si present) */
.page-template-user-dashboard-template .mce-statusbar {
  background: var(--tp-bg-soft) !important;
  border-top: 1px solid var(--tp-border) !important;
  color: var(--tp-text-muted) !important;
  font-family: "Inter", sans-serif !important;
}
.page-template-user-dashboard-template .mce-statusbar .mce-path-item {
  color: var(--tp-text-muted) !important;
  font-size: 12px !important;
}

/* ===========================================================================
 * 44. PATCH v1.0.52 : boutons "+ Ajouter X" a droite + hauteurs egales
 * --------------------------------------------------------------------------- */

/* --- 44.1 Restaure le margin-left: auto qui pousse le bouton a droite --- */
/* (mon patch precedent avait `margin: 0` qui ecrasait cette regle) */
.page-template-user-dashboard-template .jobsearch-candidate-title h2 > a,
.page-template-user-dashboard-template .jobsearch-resume-addbtn,
.page-template-user-dashboard-template .jobsearch-portfolio-add-btn,
.page-template-user-dashboard-template .jobsearch-empmember-add-popup,
.page-template-user-dashboard-template .tp-sec--membres .jobsearch-candidate-title h2 > a,
.page-template-user-dashboard-template .tp-sec--prix .jobsearch-candidate-title h2 > a,
.page-template-user-dashboard-template .tp-sec--gestion .jobsearch-candidate-title h2 > a {
  margin-left: auto !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  float: none !important;
  position: static !important;
}

/* Le h2 reste flex pour que margin-left: auto fonctionne */
.page-template-user-dashboard-template .jobsearch-candidate-title h2 {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  width: 100% !important;
  flex-wrap: nowrap !important;
}

/* --- 44.2 HAUTEURS IDENTIQUES pour Membres / Prix / Gestion --------- */
/* Min-height calee sur le contenu type (titre + separateur + padding +
 * placeholder "Aucun X") soit ~ 180px */
.page-template-user-dashboard-template .tp-sec--membres,
.page-template-user-dashboard-template .tp-sec--prix,
.page-template-user-dashboard-template .tp-sec--gestion {
  min-height: 180px !important;
  display: flex !important;
  flex-direction: column !important;
}
.page-template-user-dashboard-template .tp-sec--membres .jobsearch-candidate-resume-wrap,
.page-template-user-dashboard-template .tp-sec--prix .jobsearch-candidate-resume-wrap,
.page-template-user-dashboard-template .tp-sec--gestion .jobsearch-candidate-resume-wrap {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}
/* Le titre garde sa place en haut */
.page-template-user-dashboard-template .tp-sec--membres .jobsearch-candidate-title,
.page-template-user-dashboard-template .tp-sec--prix .jobsearch-candidate-title,
.page-template-user-dashboard-template .tp-sec--gestion .jobsearch-candidate-title {
  flex-shrink: 0 !important;
}

/* ===========================================================================
 * 45. PATCH v1.0.53 : fusion barre TinyMCE + tabs + boutons Quicktags (Code)
 * --------------------------------------------------------------------------- */

/* --- 45.1 FUSION VISUELLE : tabs Visuel/Code dans la barre formatage ---- */
/* Le wrapper editor devient le contexte de positionnement absolu */
.page-template-user-dashboard-template .wp-editor-wrap {
  position: relative !important;
}
/* La barre d'outils-tabs (.wp-editor-tools) se superpose au coin haut droit
 * de la toolbar formatage ci-dessous */
.page-template-user-dashboard-template .wp-editor-tools {
  position: absolute !important;
  top: 0 !important;
  right: 8px !important;
  z-index: 5 !important;
  background: transparent !important;
  border: none !important;
  padding: 4px 0 !important;
  margin: 0 !important;
  height: 42px !important;
  display: flex !important;
  align-items: center !important;
}
/* On laisse de l'espace a droite des toolbars formatage pour les tabs */
.page-template-user-dashboard-template .mce-toolbar-grp,
.page-template-user-dashboard-template .mce-toolbar-grp > .mce-container-body,
.page-template-user-dashboard-template .quicktags-toolbar {
  padding-right: 180px !important;
  min-height: 42px !important;
  box-sizing: border-box !important;
}
/* Sur mobile : tabs sous la toolbar, plus en absolu */
@media (max-width: 600px) {
  .page-template-user-dashboard-template .wp-editor-tools {
    position: static !important;
    height: auto !important;
    padding: 4px 8px !important;
  }
  .page-template-user-dashboard-template .mce-toolbar-grp,
  .page-template-user-dashboard-template .quicktags-toolbar {
    padding-right: 8px !important;
  }
}

/* --- 45.2 BASCULE Visuel <-> Code : on respecte ce que WP toggle ----- */
/* Une seule barre visible a la fois : mce-toolbar-grp en Visuel,
 * quicktags-toolbar en Code. */
.page-template-user-dashboard-template .wp-editor-wrap.tmce-active .quicktags-toolbar {
  display: none !important;
}
.page-template-user-dashboard-template .wp-editor-wrap.html-active .mce-toolbar-grp,
.page-template-user-dashboard-template .wp-editor-wrap.html-active .mce-tinymce.mce-container,
.page-template-user-dashboard-template .wp-editor-wrap.html-active iframe[id$="_ifr"] {
  display: none !important;
}

/* Container quicktags (uniquement quand html-active) : style propre */
.page-template-user-dashboard-template .wp-editor-wrap.html-active .quicktags-toolbar {
  background: var(--tp-bg-soft) !important;
  border-bottom: 1px solid var(--tp-border) !important;
  padding: 6px 8px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  align-items: center !important;
}
/* On garde le selecteur generique pour styler la barre meme avant que JS
 * ait mis la class .html-active (au chargement initial) */
.page-template-user-dashboard-template .quicktags-toolbar {
  background: var(--tp-bg-soft) !important;
  border-bottom: 1px solid var(--tp-border) !important;
  padding: 6px 8px !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  align-items: center !important;
}
.page-template-user-dashboard-template .quicktags-toolbar input.ed_button,
.page-template-user-dashboard-template .quicktags-toolbar button.ed_button,
.page-template-user-dashboard-template input.ed_button,
.page-template-user-dashboard-template button.ed_button {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--tp-navy) !important;
  font-family: "Inter", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  padding: 6px 12px !important;
  margin: 0 !important;
  height: 30px !important;
  min-width: 30px !important;
  cursor: pointer !important;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
  text-decoration: none !important;
  line-height: 1 !important;
}
.page-template-user-dashboard-template .quicktags-toolbar input.ed_button:hover,
.page-template-user-dashboard-template .quicktags-toolbar button.ed_button:hover,
.page-template-user-dashboard-template input.ed_button:hover,
.page-template-user-dashboard-template button.ed_button:hover {
  background: rgba(22, 49, 92, 0.10) !important;
  border-color: rgba(22, 49, 92, 0.20) !important;
  color: var(--tp-navy) !important;
}
.page-template-user-dashboard-template .quicktags-toolbar input.ed_button:focus,
.page-template-user-dashboard-template input.ed_button:focus {
  outline: none !important;
  background: rgba(22, 49, 92, 0.10) !important;
  border-color: var(--tp-navy) !important;
  box-shadow: 0 0 0 2px rgba(22, 49, 92, 0.18) !important;
}
.page-template-user-dashboard-template .quicktags-toolbar input.ed_button:active,
.page-template-user-dashboard-template input.ed_button:active {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border-color: var(--tp-navy) !important;
}

/* Boutons specifiques avec italique (i.e. attribut value="i") */
.page-template-user-dashboard-template .quicktags-toolbar input[value="i"],
.page-template-user-dashboard-template .quicktags-toolbar input.ed_button[value="i"] {
  font-style: italic !important;
}
/* Bouton "fermer les balises" (close tags) */
.page-template-user-dashboard-template input.ed_button.ed_close_tags,
.page-template-user-dashboard-template input[id$="_close"],
.page-template-user-dashboard-template input.button.ed_close_tags {
  background: transparent !important;
  color: var(--tp-navy) !important;
  border: 1px solid rgba(22, 49, 92, 0.20) !important;
  border-radius: 999px !important;
  padding: 4px 14px !important;
  font-weight: 600 !important;
}
.page-template-user-dashboard-template input.ed_button.ed_close_tags:hover {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border-color: var(--tp-navy) !important;
}

/* Textarea code (mode HTML pur) : fond blanc, font monospace lisible */
.page-template-user-dashboard-template textarea.wp-editor-area,
.page-template-user-dashboard-template .wp-editor-container textarea {
  background: #fff !important;
  color: var(--tp-navy) !important;
  font-family: "JetBrains Mono", "Menlo", "Consolas", monospace !important;
  font-size: 13.5px !important;
  line-height: 1.55 !important;
  border: none !important;
  padding: 14px 18px !important;
  resize: vertical !important;
}

/* --- 45.3 Ajustements onglets tabs (deja dans 41) pour la nouvelle position -- */
.page-template-user-dashboard-template .wp-editor-tabs .wp-switch-editor {
  height: 32px !important;
  padding: 0 16px !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* ===========================================================================
 * 46. MODALE GESTIONNAIRE -> PANNEAU INLINE
 *
 * #JobSearchModalEmpAccMembAdd est nativement une modale flottante. Le JS
 * Ta'iara la deplace dans la section "Equipe de gestion" et ajoute la
 * classe .tp-inline-panel. Ces regles neutralisent les styles modal et
 * appliquent le meme look que le panneau .jobsearch-add-popup (Membres
 * de l'equipe).
 * --------------------------------------------------------------------------- */

/* Neutralise le comportement modal */
.jobsearch-modal.tp-inline-panel {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  z-index: auto !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  background: transparent !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  margin: 16px 0 0 0 !important;
  padding: 0 !important;
}

/* Le backdrop sombre : on le supprime */
.jobsearch-modal.tp-inline-panel .modal-inner-area {
  display: none !important;
}

/* Le conteneur de contenu reprend la largeur du panneau */
.jobsearch-modal.tp-inline-panel .modal-content-area {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  display: block !important;
  background: transparent !important;
}

/* La carte interieure : meme look que .jobsearch-add-popup. ANNULE aussi
   les styles modal du plugin qui mettent opacity: 0 et transform: translate
   (-25%) par defaut (le plugin ne les revele qu'avec .fade-in, qu'on n'utilise
   pas dans le mode panneau inline). */
.jobsearch-modal.tp-inline-panel .modal-box-area {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 12px !important;
  padding: 24px 28px !important;
  box-shadow: 0 2px 12px rgba(22, 49, 92, 0.06) !important;
  position: relative !important;
  width: 100% !important;
  max-height: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  transform: none !important;
  -webkit-transform: none !important;
  transition: none !important;
  -webkit-transition: none !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* Force visibility sur le wrapper meme s'il a la classe .fade (heritage plugin) */
.jobsearch-modal.tp-inline-panel.fade,
.jobsearch-modal.tp-inline-panel {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
/* Le content-area doit aussi etre interactif */
.jobsearch-modal.tp-inline-panel .modal-content-area {
  pointer-events: auto !important;
  padding: 0 !important;
}

/* Titre + croix */
.jobsearch-modal.tp-inline-panel .jobsearch-modal-title-box {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 18px !important;
  padding: 0 0 14px 0 !important;
  border-bottom: 1px solid var(--tp-border) !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-modal-title-box h2 {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  color: var(--tp-navy) !important;
  border: none !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-modal-title-box .modal-close {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  cursor: pointer !important;
  color: var(--tp-text-muted) !important;
  background: transparent !important;
  border-radius: 50% !important;
  width: 32px !important;
  height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-modal-title-box .modal-close:hover {
  background: rgba(22, 49, 92, 0.08) !important;
  color: var(--tp-navy) !important;
}

/* Animation d'ouverture douce */
.jobsearch-modal.tp-inline-panel.tp-inline-open .modal-box-area {
  animation: tpInlinePanelIn 0.22s ease-out;
}
@keyframes tpInlinePanelIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Bouton "Ajouter un gestionnaire" final (submit) : style Ta'iara */
.jobsearch-modal.tp-inline-panel input[type="submit"],
.jobsearch-modal.tp-inline-panel button[type="submit"],
.jobsearch-modal.tp-inline-panel .addempmemb-account-btn {
  background: var(--tp-navy) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 12px 22px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  cursor: pointer !important;
  transition: background 0.15s ease, transform 0.15s ease !important;
}
.jobsearch-modal.tp-inline-panel input[type="submit"]:hover,
.jobsearch-modal.tp-inline-panel button[type="submit"]:hover,
.jobsearch-modal.tp-inline-panel .addempmemb-account-btn:hover {
  background: #1e4173 !important;
}

/* ---------------------------------------------------------------------------
 * 46.b RESTRUCTURATION INTERNE DU FORMULAIRE GESTIONNAIRE
 *
 * Le markup natif est :
 *   form > .jobsearch-user-form > ul.addempmemb-fields-list
 *     > li (Prenom)         > li (Nom)
 *     > li (Identifiant)    > li (Email)
 *     > li (Mot de passe)   > li (Confirmation)
 *     > li.jobsearch-user-form-coltwo-full
 *         > .jobsearch-adingmem-parnet
 *             > .jobsearch-adingmem-title "Autorisations"
 *             > ul > li > .jobsearch-adingmem-permisons (checkbox)
 * Plus un input[type="submit"] en dehors de la liste.
 *
 * On applique :
 *  - Grid 2 colonnes sur la liste de champs (avec gap propre)
 *  - Avatar pleine largeur en haut
 *  - Section autorisations pleine largeur, separee par un border-top, avec
 *    grid 2 colonnes pour les checkboxes en "cartes"
 *  - Bouton submit centre / aligne droite, espacement aere
 * -------------------------------------------------------------------------- */

/* Form container */
.jobsearch-modal.tp-inline-panel .jobsearch-addempacount-membcon {
  background: transparent !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-user-form {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}

/* Grid 2 colonnes pour la liste de champs */
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list {
  list-style: none !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px 20px !important;
  padding: 0 !important;
  margin: 0 !important;
}
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  width: auto !important;
  float: none !important;
  display: block !important;
}

/* Li "full width" : autorisations, submit */
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li.jobsearch-user-form-coltwo-full {
  grid-column: 1 / -1 !important;
}

/* Labels au-dessus des inputs */
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li > label,
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li > .label-with-tooltip,
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li > span.jobsearch-field-label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--tp-text-muted) !important;
  margin: 0 0 6px 0 !important;
  padding: 0 !important;
}

/* Inputs pleine largeur dans la grille */
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li > input[type="text"],
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li > input[type="email"],
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li > input[type="password"],
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li > input[type="tel"] {
  width: 100% !important;
  margin: 0 !important;
}

/* Avatar upload (injecte par notre JS) : pleine largeur, encadre */
.jobsearch-modal.tp-inline-panel .tp-member-avatar-upload {
  grid-column: 1 / -1 !important;
  background: var(--tp-bg-soft) !important;
  border: 1px dashed var(--tp-border) !important;
  border-radius: 10px !important;
  padding: 22px !important;
  text-align: center !important;
  margin: 0 0 8px 0 !important;
}
.jobsearch-modal.tp-inline-panel .tp-member-avatar-upload__label {
  display: block !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--tp-navy) !important;
  margin: 0 0 14px 0 !important;
}
.jobsearch-modal.tp-inline-panel .tp-member-avatar-upload__label .tp-optional {
  font-weight: 400 !important;
  color: var(--tp-text-muted) !important;
  font-size: 13px !important;
  margin-left: 6px !important;
}
.jobsearch-modal.tp-inline-panel .tp-member-avatar-upload__preview {
  width: 88px !important;
  height: 88px !important;
  border-radius: 50% !important;
  background: #fff !important;
  margin: 0 auto 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  border: 1px solid var(--tp-border) !important;
}
.jobsearch-modal.tp-inline-panel .tp-member-avatar-upload__placeholder {
  color: var(--tp-text-muted) !important;
}
.jobsearch-modal.tp-inline-panel .tp-member-avatar-upload__img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
.jobsearch-modal.tp-inline-panel .tp-member-avatar-upload__btn {
  display: inline-block !important;
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 999px !important;
  padding: 8px 22px !important;
  font-weight: 500 !important;
  font-size: 13.5px !important;
  color: var(--tp-navy) !important;
  cursor: pointer !important;
  transition: border-color 0.15s ease, background 0.15s ease !important;
}
.jobsearch-modal.tp-inline-panel .tp-member-avatar-upload__btn:hover {
  border-color: var(--tp-navy) !important;
  background: var(--tp-bg-soft) !important;
}
.jobsearch-modal.tp-inline-panel .tp-member-avatar-upload__input {
  display: none !important;
}

/* Section "Autorisations accordees" */
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-parnet {
  margin: 8px 0 0 0 !important;
  padding-top: 20px !important;
  border-top: 1px solid var(--tp-border) !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-title {
  display: block !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  color: var(--tp-navy) !important;
  margin: 0 0 14px 0 !important;
  padding: 0 !important;
}

/* Liste de checkboxes en grid 2 colonnes, chaque ligne = "carte" */
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-parnet > ul {
  list-style: none !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px 14px !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* Reset agressif des li nested (le plugin met de gros margins par defaut) */
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-parnet ul,
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-parnet ul li,
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-parnet > ul > li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  min-height: 0 !important;
  height: auto !important;
  width: auto !important;
  float: none !important;
  display: block !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-permisons {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  cursor: pointer !important;
  min-height: 0 !important;
  height: auto !important;
  transition: border-color 0.15s ease, background 0.15s ease !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-permisons:hover {
  border-color: var(--tp-accent) !important;
  background: var(--tp-bg-soft) !important;
}
/* Etat "carte cochee" : feedback visuel clair */
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-permisons:has(input[type="checkbox"]:checked) {
  border-color: var(--tp-accent) !important;
  background: rgba(46, 166, 160, 0.08) !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-permisons:has(input[type="checkbox"]:checked) label {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-permisons input[type="checkbox"] {
  margin: 0 !important;
  flex-shrink: 0 !important;
}
.jobsearch-modal.tp-inline-panel .jobsearch-adingmem-permisons label {
  margin: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  font-size: 13.5px !important;
  color: var(--tp-navy) !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* Submit final : aligne a GAUCHE, espacement aere */
.jobsearch-modal.tp-inline-panel #addempmemb-account-form input[type="submit"],
.jobsearch-modal.tp-inline-panel .jobsearch-addempacount-membcon input[type="submit"] {
  display: block !important;
  margin: 24px auto 0 0 !important;
  padding: 12px 28px !important;
}
/* Si le submit est dans un li, lui faire occuper la ligne entiere et aligner a gauche */
.jobsearch-modal.tp-inline-panel ul.addempmemb-fields-list > li:has(input[type="submit"]) {
  grid-column: 1 / -1 !important;
  display: flex !important;
  justify-content: flex-start !important;
  margin-top: 8px !important;
}

/* ===========================================================================
 * 46.c SELECTIZE.JS : harmonisation avec la charte Ta'iara
 *
 * Selectize.js est utilise par JobSearch pour les multi-selects (Secteurs,
 * Categories, Niveaux d'experience, etc.). Par defaut il rend des tags bleu
 * vif et un dropdown au hover violet, ce qui jure avec notre charte.
 * --------------------------------------------------------------------------- */

/* Wrapper visible (input + tags) : meme look que nos autres inputs */
.selectize-control.multi .selectize-input,
.selectize-control.single .selectize-input,
.user-dashboard-content .selectize-input,
.jobsearch-typo-wrap .selectize-input,
.jobsearch-modal .selectize-input {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  padding: 8px 12px !important;
  min-height: 46px !important;
  color: var(--tp-navy) !important;
  font-size: 14px !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
.selectize-control.multi .selectize-input.input-active,
.selectize-control.multi .selectize-input.focus,
.selectize-control.single .selectize-input.input-active,
.selectize-control.single .selectize-input.focus,
.selectize-control .selectize-input.dropdown-active {
  border-color: var(--tp-navy) !important;
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
}

/* Tags selectionnes (les "chips" bleus par defaut) */
.selectize-control.multi .selectize-input > .item,
.selectize-input > .item {
  background: rgba(22, 49, 92, 0.08) !important;
  border: 1px solid rgba(22, 49, 92, 0.18) !important;
  border-radius: 999px !important;
  color: var(--tp-navy) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 3px 10px 3px 12px !important;
  margin: 0 6px 4px 0 !important;
  text-shadow: none !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.selectize-control.multi .selectize-input > .item.active,
.selectize-input > .item.active {
  background: rgba(46, 166, 160, 0.18) !important;
  border-color: var(--tp-accent) !important;
  color: var(--tp-navy) !important;
}
/* Croix de suppression du tag */
.selectize-control.multi .selectize-input > .item .remove,
.selectize-input > .item .remove {
  border: none !important;
  background: transparent !important;
  color: var(--tp-navy) !important;
  opacity: 0.55 !important;
  font-weight: 700 !important;
  padding: 0 !important;
  margin: 0 !important;
  text-decoration: none !important;
  transition: opacity 0.12s ease, color 0.12s ease !important;
}
.selectize-control.multi .selectize-input > .item .remove:hover,
.selectize-input > .item .remove:hover {
  opacity: 1 !important;
  color: #c44 !important;
  background: transparent !important;
}

/* Input de recherche dans le multi-select */
.selectize-input input,
.selectize-control .selectize-input input[type="text"] {
  color: var(--tp-navy) !important;
  font-size: 14px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 2px 0 !important;
  margin: 0 !important;
  min-width: 80px !important;
}
.selectize-input input::placeholder {
  color: var(--tp-text-muted) !important;
}

/* Dropdown des options */
.selectize-dropdown,
.selectize-dropdown.multi,
.selectize-dropdown.single {
  background: #fff !important;
  border: 1px solid var(--tp-navy) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 32px rgba(10, 31, 68, 0.12) !important;
  margin-top: 4px !important;
  padding: 4px !important;
  overflow: hidden !important;
}
.selectize-dropdown .selectize-dropdown-content {
  padding: 0 !important;
}

/* Option dans le dropdown */
.selectize-dropdown .option,
.selectize-dropdown [data-selectable] {
  padding: 9px 12px !important;
  color: var(--tp-navy) !important;
  font-size: 14px !important;
  border-radius: 6px !important;
  margin: 1px 0 !important;
  background: transparent !important;
  transition: background 0.12s ease, color 0.12s ease !important;
}
/* Option survolee (souris) ou active (clavier) */
.selectize-dropdown .option:hover,
.selectize-dropdown .active,
.selectize-dropdown [data-selectable]:hover,
.selectize-dropdown [data-selectable].active {
  background: var(--tp-bg-soft) !important;
  color: var(--tp-navy) !important;
}
/* Option deja selectionnee : un peu plus discrete + check visuel */
.selectize-dropdown .option.selected,
.selectize-dropdown [data-selectable].selected {
  background: rgba(46, 166, 160, 0.10) !important;
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
  position: relative !important;
}
.selectize-dropdown .option.selected::after,
.selectize-dropdown [data-selectable].selected::after {
  content: '\2713' !important;
  position: absolute !important;
  right: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: var(--tp-accent) !important;
  font-weight: 700 !important;
  font-size: 14px !important;
}
.selectize-dropdown .option.selected.active,
.selectize-dropdown [data-selectable].selected.active {
  background: rgba(46, 166, 160, 0.18) !important;
}

/* Optgroups (categories grises) */
.selectize-dropdown .optgroup-header {
  padding: 8px 12px 4px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--tp-text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  background: transparent !important;
}

/* Pas de resultat */
.selectize-dropdown .no-results,
.selectize-dropdown .create {
  padding: 10px 12px !important;
  color: var(--tp-text-muted) !important;
  font-size: 13.5px !important;
}

/* ===========================================================================
 * 48. CROIX FERMETURE MODALE : forcer en haut a DROITE
 *
 * Le plugin met le `.modal-close` flottant a droite par defaut, mais sur la
 * modale de suppression de compte (#JobSearchModalUserProfileDel) le markup
 * la positionne autrement (visiblement a gauche). On force position absolute
 * top/right pour toutes les modales JobSearch (sauf .tp-inline-panel qui
 * a son propre layout).
 * --------------------------------------------------------------------------- */
.jobsearch-modal:not(.tp-inline-panel) .modal-close,
.jobsearch-modal:not(.tp-inline-panel) .modal-close:hover,
.jobsearch-modal:not(.tp-inline-panel) .modal-box-area > .modal-close,
.jobsearch-modal:not(.tp-inline-panel) .jobsearch-modal-title-box .modal-close,
#JobSearchModalUserProfileDel .modal-close,
#JobSearchModalUserProfileDel .modal-close:hover {
  position: absolute !important;
  top: 14px !important;
  right: 18px !important;
  left: auto !important;
  float: none !important;
  margin: 0 !important;
  width: 36px !important;
  height: 36px !important;
  font-size: 22px !important;
  line-height: 1 !important;
  padding: 0 !important;
  text-indent: 0 !important;
  text-transform: none !important;
  transform: none !important;
  box-shadow: none !important;
  z-index: 5 !important;
}
/* Neutralise tout pseudo-element qui pourrait injecter du texte "Annuler" */
.jobsearch-modal:not(.tp-inline-panel) .modal-close::before,
.jobsearch-modal:not(.tp-inline-panel) .modal-close::after,
.jobsearch-modal:not(.tp-inline-panel) .modal-close:hover::before,
.jobsearch-modal:not(.tp-inline-panel) .modal-close:hover::after {
  content: none !important;
  display: none !important;
}
.jobsearch-modal:not(.tp-inline-panel) .modal-box-area {
  position: relative !important;
}
/* Cache le bouton "Cancel/Annuler" natif redondant : la croix .modal-close
   suffit pour fermer la modale, pas besoin d'un 2e bouton vert. */
.jobsearch-modal .del-action-btns a.jobsearch-userdel-cancel {
  display: none !important;
}

/* ===========================================================================
 * 48.c CASE CONFIRMATION SUPPRESSION COMPTE
 *
 * Injectee via JS dans la modale #JobSearchModalUserProfileDel. RGPD-friendly :
 * non pre-cochee, libelle explicite "suppression irreversible".
 * --------------------------------------------------------------------------- */
.tp-deletion-consent {
  display: block !important;
  clear: both !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 18px 0 16px 0 !important;
  padding: 14px 16px !important;
  background: rgba(196, 68, 68, 0.05) !important;
  border: 1px solid rgba(196, 68, 68, 0.25) !important;
  border-radius: 10px !important;
  text-align: left !important;
}
.tp-deletion-consent label {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin: 0 !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
  color: var(--tp-navy) !important;
  text-align: left !important;
}
.tp-deletion-consent__checkbox {
  margin: 3px 0 0 0 !important;
  flex-shrink: 0 !important;
  width: 16px !important;
  height: 16px !important;
  cursor: pointer !important;
  accent-color: #c44 !important;
}
.tp-deletion-consent strong {
  color: #c44 !important;
  font-weight: 700 !important;
}
.tp-deletion-consent__required {
  color: #c44 !important;
  font-weight: 700 !important;
}

/* ===========================================================================
 * 48.b MENU MOBILE DASHBOARD : retirer du flow sur desktop
 *
 * Le plugin injecte un toggle menu mobile (.jobsearch-dashbord-menubtn) et
 * son drawer (.jobsearch-dashbord-mobilemenu.hidden-dashbord-menu) dans la
 * sidebar. La classe "hidden-dashbord-menu" les masque visuellement mais ne
 * retire pas leur espace -> la sidebar continue verticalement de plusieurs
 * centaines de pixels apres "Supprimer le compte". On force display: none
 * sur desktop pour eliminer cette zone fantome.
 * --------------------------------------------------------------------------- */
@media (min-width: 769px) {
  .page-template-user-dashboard-template .jobsearch-dashbord-menubtn,
  .page-template-user-dashboard-template .jobsearch-dashbord-mobilemenu,
  .page-template-user-dashboard-template .jobsearch-dashbord-desktopmenu .jobsearch-dashbord-menubtn,
  .page-template-user-dashboard-template .jobsearch-dashbord-desktopmenu .jobsearch-dashbord-mobilemenu,
  .page-template-user-dashboard-template .hidden-dashbord-menu,
  .page-template-user-dashboard-template .dashbord-mobile-nav-togglebtn {
    display: none !important;
  }
}

/* ===========================================================================
 * 49. SIDEBAR DASHBOARD : hauteur naturelle, pas d'extension verticale
 *
 * Probleme : la sidebar (menu vertical) heritait d'un align-items: stretch du
 * parent flex/grid et s'etendait jusqu'au footer alors que son contenu finit
 * a "Supprimer le compte". On force align-self: flex-start + height: auto +
 * min-height: 0 pour qu'elle ne s'etire plus.
 * --------------------------------------------------------------------------- */
.page-template-user-dashboard-template .jobsearch-dashboard-menu,
.page-template-user-dashboard-template .jobsearch-dashboard-menu-list,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav,
.page-template-user-dashboard-template .jobsearch-candidate-dashboard-nav,
.page-template-user-dashboard-template aside.jobsearch-dashboard-aside,
.page-template-user-dashboard-template .dashboard-aside-bar,
.page-template-user-dashboard-template .jobsearch-dashboard-aside,
.page-template-user-dashboard-template .jobsearch-employer-dashboard-aside,
.page-template-user-dashboard-template .jobsearch-candidate-dashboard-aside {
  align-self: flex-start !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
/* Si le parent est une grille / flexbox column-stretch, on garantit le scope */
.page-template-user-dashboard-template .jobsearch-typo-wrap > .jobsearch-row,
.page-template-user-dashboard-template .dashboard-main-page-section > .jobsearch-row {
  align-items: flex-start !important;
}

/* ===========================================================================
 * 50. RESPONSIVE TWEAKS (residuel)
 * --------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .jobsearch-stats-list-wrap { padding: 14px 16px !important; }
  .jobsearch-stats-list-wrap span { font-size: 28px !important; }
  .jobsearch-modal .modal-inner-area { margin: 16px !important; max-width: calc(100vw - 32px) !important; }
  .jobsearch-modal.tp-inline-panel .modal-box-area { padding: 18px 16px !important; }
}

/* ===========================================================================
 * 51. BANNIERE "compte actif" (jobsearch-profil-approv-alrt / -noapprov-alrt)
 * Masquee sur demande : on retire completement le bandeau .alrt-cover-area
 * (message d'etat d'adhesion + CTA) de la section Recapitulatif.
 * --------------------------------------------------------------------------- */
.jobsearch-profil-approv-alrt .alrt-cover-area,
.jobsearch-profil-noapprov-alrt .alrt-cover-area,
.alrt-cover-area {
  display: none !important;
}
.jobsearch-profil-approv-alrt .alrt-icon,
.jobsearch-profil-noapprov-alrt .alrt-icon {
  flex: 0 0 auto !important;
  width: 34px !important;
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: var(--tp-accent) !important;
  color: #fff !important;
  margin: 0 !important;
}
.jobsearch-profil-noapprov-alrt .alrt-icon {
  background: var(--tp-warm) !important;
  color: var(--tp-navy) !important;
}
.jobsearch-profil-approv-alrt .alrt-icon i,
.jobsearch-profil-noapprov-alrt .alrt-icon i {
  color: inherit !important;
}
.jobsearch-profil-approv-alrt .close-alrt-btn,
.jobsearch-profil-noapprov-alrt .close-alrt-btn {
  margin-left: auto !important;
  color: var(--tp-text-muted) !important;
  flex: 0 0 auto !important;
}

/* ===========================================================================
 * 52. GRAPHE DASHBOARD (Morris.js) : le tooltip .morris-hover a un z-index
 * natif de 1000 et debordait par-dessus le header sticky. Le header PWA
 * (.tpa-header) est en z-index 50 : on repasse donc le tooltip a 40 (STRICTEMENT
 * sous le header, sinon egalite 50=50 -> le tooltip repasse devant) et on
 * l'habille facon Ta'iara. pointer-events:none -> il ne capture jamais le
 * curseur (evite qu'il reste "colle" a l'ecran).
 * --------------------------------------------------------------------------- */
.morris-hover,
.morris-hover.morris-default-style {
  z-index: 40 !important;
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 6px 20px rgba(20, 30, 60, 0.12) !important;
  padding: 10px 12px !important;
  color: var(--tp-navy) !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  pointer-events: none !important;
}
.morris-hover .morris-hover-row-label {
  color: var(--tp-navy) !important;
  font-weight: 700 !important;
  margin-bottom: 4px !important;
}

/* ===========================================================================
 * 53. HEADER NON FIXE (demande Ta'iara : le header doit defiler avec la page)
 * Le header PWA (.tpa-header) et le wrapper Careerfy (#careerfy-header) etaient
 * en position:sticky -> ils restaient colles en haut au scroll. On repasse en
 * static : le header suit le flux normal et disparait quand on descend.
 * Effet de bord bienvenu : plus de header fixe = le tooltip du graphe ne peut
 * plus le chevaucher (cf. section 52).
 * --------------------------------------------------------------------------- */
.tpa-header,
#careerfy-header {
  position: static !important;
  top: auto !important;
}

/* ===========================================================================
 * 54. PANIER / CHECKOUT : suppression de la colonne QUANTITE
 * Le site ne vend qu'UN abonnement a la fois (sold_individually) -> la quantite
 * vaut toujours 1 et son champ, masque, laissait une case vide qui cassait le
 * tableau. On retire la quantite partout : panier, recap checkout, mini-panier.
 * (Selecteurs volontairement tres specifiques pour battre taiara-woocommerce.css
 * quel que soit l'ordre de chargement.)
 * --------------------------------------------------------------------------- */

/* --- Tableau PANIER : masque l'entete + la cellule Quantite --- */
.woocommerce-cart .woocommerce-cart-form table.shop_table th.product-quantity,
.woocommerce-cart .woocommerce-cart-form table.shop_table td.product-quantity {
  display: none !important;
}

/* --- Tableau PANIER : alignement propre des colonnes restantes ---
   Produit a gauche, Prix + Sous-total alignes a droite (rendu "facture"). */
.woocommerce-cart .woocommerce-cart-form table.shop_table th.product-name,
.woocommerce-cart .woocommerce-cart-form table.shop_table td.product-name {
  text-align: left !important;
}
.woocommerce-cart .woocommerce-cart-form table.shop_table th.product-price,
.woocommerce-cart .woocommerce-cart-form table.shop_table td.product-price,
.woocommerce-cart .woocommerce-cart-form table.shop_table th.product-subtotal,
.woocommerce-cart .woocommerce-cart-form table.shop_table td.product-subtotal {
  text-align: right !important;
}

/* --- RECAP CHECKOUT : masque le "x 1" accole au nom du produit ---
   Large volontairement : sur le checkout, .product-quantity n'apparait que dans
   les lignes du recap de commande (peu importe le wrapper Elementor). */
.woocommerce-checkout .product-quantity,
.woocommerce-checkout strong.product-quantity {
  display: none !important;
}

/* --- MINI-PANIER / widget panier : masque la quantite --- */
.woocommerce-mini-cart .mini_cart_item .quantity,
.widget_shopping_cart_content .mini_cart_item .quantity {
  display: none !important;
}


/* ===========================================================================
 * 55. PAGE "COMMANDE CONFIRMEE" (order-received) — design Ta'iara-PRO
 * Rendu par le template override woocommerce/checkout/thankyou.php.
 * Polices Fraunces (titres) + Hanken Grotesk (corps), chargees via functions.php.
 * Tailles calquees sur la maquette de reference (texte plus grand). Tout est
 * prefixe .tp-confirm pour ne pas fuiter dans le reste du site.
 * --------------------------------------------------------------------------- */
/* Sortie pleine largeur : le shortcode [woocommerce_checkout] est dans une
   colonne Elementor etroite/alignee a gauche. On neutralise les wrappers puis
   on fait deborder .tp-confirm sur toute la largeur, contenu recentre a 1080px.
   (Scope order-received uniquement pour ne pas toucher le reste du site.) */
body.woocommerce-order-received .elementor-widget-shortcode,
body.woocommerce-order-received .elementor-widget-shortcode > .elementor-widget-container,
body.woocommerce-order-received .elementor-widget-wrap,
body.woocommerce-order-received .e-con-inner,
body.woocommerce-order-received .e-con{display:contents !important}
body.woocommerce-order-received .elementor-section,
body.woocommerce-order-received .elementor-container,
body.woocommerce-order-received .elementor-column,
body.woocommerce-order-received .elementor-element,
body.woocommerce-order-received .elementor-widget,
body.woocommerce-order-received .elementor-widget-container{overflow:visible !important;max-width:none !important}
/* Supprime la bande vide avant le footer : les sections/colonnes Elementor
   (dont l'ancienne section titre supprimee) gardaient padding / min-height.
   On les aplatit sur order-received (le layout est gere par .tp-confirm). */
body.woocommerce-order-received .elementor-section,
body.woocommerce-order-received .elementor-container,
body.woocommerce-order-received .elementor-column,
body.woocommerce-order-received .elementor-column-wrap,
body.woocommerce-order-received .elementor-widget-wrap,
body.woocommerce-order-received .e-con,
body.woocommerce-order-received .e-con-inner{padding-top:0 !important;padding-bottom:0 !important;margin-top:0 !important;margin-bottom:0 !important;min-height:0 !important}

.tp-confirm{
  --navy:#16304d; --navy-soft:#27496b; --emerald:#1f9b8e; --emerald-deep:#15847a;
  --cream:#f6f0e6; --cream-deep:#efe6d7; --field:#f8efe4; --card:#fffdf9;
  --ink:#1c2a3a; --muted:#8a8576; --tpc-line:#e7ddcc; --coral:#c25b4a;
  --tpc-display:'Fraunces',Georgia,serif; --tpc-body:'Hanken Grotesk',system-ui,sans-serif;
  --tpc-radius:16px; --tpc-radius-sm:11px;
  width:100vw; max-width:100vw;
  position:relative; left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
  padding:54px 0 76px;
  font-family:var(--tpc-body); color:var(--ink); line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.tp-confirm *{box-sizing:border-box}
.tp-confirm > *{max-width:1080px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.tp-confirm .tpc-hero{text-align:center;margin-bottom:44px}
.tp-confirm .tpc-badge{display:inline-flex;align-items:center;gap:11px;background:rgba(31,155,142,.12);color:var(--emerald-deep);font-family:var(--tpc-body);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:8px 20px 8px 10px;border-radius:999px}
.tp-confirm .tpc-check{width:30px;height:30px;border-radius:50%;background:linear-gradient(140deg,var(--emerald),var(--emerald-deep));display:grid;place-items:center;flex-shrink:0;box-shadow:0 6px 12px -4px rgba(31,155,142,.5)}
.tp-confirm .tpc-check svg{width:14px;height:14px;stroke:#fff;stroke-width:3.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tp-confirm .tpc-hero h1{font-family:var(--tpc-display);font-size:clamp(38px,6vw,60px);font-weight:600;letter-spacing:-.02em;margin:22px 0 12px;line-height:1.04;color:var(--navy)}
.tp-confirm .tpc-hero h1 .tpc-brand{font-style:normal;color:var(--emerald);font-weight:600;white-space:nowrap}
.tp-confirm .tpc-sub{color:var(--muted);font-size:16px;max-width:560px;margin:0 auto}
.tp-confirm .tpc-sub strong{color:var(--navy-soft);font-weight:600}
.tp-confirm .tpc-steps{display:flex;justify-content:center;margin:34px auto 46px;max-width:720px;counter-reset:tpcstep}
.tp-confirm .tpc-step{flex:1;text-align:center;position:relative;padding-top:42px}
.tp-confirm .tpc-step::before{counter-increment:tpcstep;content:counter(tpcstep);position:absolute;top:0;left:50%;transform:translateX(-50%);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-family:var(--tpc-body);font-size:15px;font-weight:700;background:var(--cream-deep);color:var(--navy-soft);border:2px solid var(--tpc-line);z-index:2}
.tp-confirm .tpc-step::after{content:"";position:absolute;top:16px;left:calc(50% + 19px);width:calc(100% - 38px);height:2px;background:var(--tpc-line)}
.tp-confirm .tpc-step:last-child::after{display:none}
.tp-confirm .tpc-step.done::before{content:"\2713";background:var(--emerald);color:#fff;border-color:var(--emerald)}
.tp-confirm .tpc-step.done::after{background:var(--emerald)}
.tp-confirm .tpc-step.current::before{background:#fff;color:var(--navy);border-color:var(--emerald);box-shadow:0 0 0 5px rgba(31,155,142,.15)}
.tp-confirm .tpc-s-title{font-weight:600;font-size:14px;color:var(--navy)}
.tp-confirm .tpc-s-hint{font-size:12.5px;color:var(--muted);margin-top:2px}
.tp-confirm .tpc-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:24px;align-items:start}
.tp-confirm .tpc-card{background:var(--card);border:1px solid var(--tpc-line);border-radius:var(--tpc-radius);padding:34px;box-shadow:0 24px 60px -28px rgba(22,48,77,.28)}
.tp-confirm .tpc-card h2{font-family:var(--tpc-body);font-weight:700;font-size:21px;letter-spacing:-.005em;margin:0 0 8px;color:var(--navy);line-height:1.3}
.tp-confirm .tpc-lead{color:var(--navy-soft);font-size:14.5px;line-height:1.6;margin-bottom:24px}
.tp-confirm .tpc-pay{border-top:4px solid var(--emerald)}
.tp-confirm .tpc-paid{border-top:4px solid var(--emerald)}
.tp-confirm .tpc-amount{background:var(--navy);color:var(--cream);border-radius:13px;padding:24px 28px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.tp-confirm .tpc-a-label{font-family:var(--tpc-body);font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:#9fb0c6;font-weight:600}
.tp-confirm .tpc-a-value{font-family:var(--tpc-display);font-size:34px;font-weight:600;color:var(--cream);letter-spacing:-.01em}
.tp-confirm .tpc-field{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1.5px solid var(--tpc-line);border-radius:var(--tpc-radius-sm);padding:15px 18px;margin-bottom:11px;background:#fff}
.tp-confirm .tpc-f-meta{min-width:0}
.tp-confirm .tpc-f-label{font-family:var(--tpc-body);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--navy-soft);font-weight:700;display:block;margin-bottom:5px}
.tp-confirm .tpc-f-value{font-family:var(--tpc-body);font-size:15.5px;font-weight:600;word-break:break-all;color:var(--navy);letter-spacing:.01em}
.tp-confirm .tpc-highlight{border-color:var(--emerald);background:rgba(31,155,142,.06)}
.tp-confirm .tpc-copy{flex-shrink:0;display:inline-flex;align-items:center;gap:7px;background:var(--cream-deep);border:1.5px solid var(--tpc-line);color:var(--navy);font-family:var(--tpc-body);font-size:13px;font-weight:600;padding:9px 15px;border-radius:9px;cursor:pointer;transition:background .15s,border-color .15s}
.tp-confirm .tpc-copy:hover{background:rgba(31,155,142,.12);border-color:var(--emerald)}
.tp-confirm .tpc-copy:focus-visible{outline:2px solid var(--emerald);outline-offset:2px}
.tp-confirm .tpc-copy.copied{background:var(--emerald);border-color:var(--emerald);color:#fff}
.tp-confirm .tpc-copy svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tp-confirm .tpc-bank-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:14px}
.tp-confirm .tpc-mini{border:1px solid var(--tpc-line);border-radius:var(--tpc-radius-sm);padding:13px 16px;background:#fff}
.tp-confirm .tpc-notice{display:flex;gap:13px;align-items:flex-start;background:rgba(31,155,142,.10);border-radius:var(--tpc-radius-sm);padding:16px 18px;margin-top:24px;font-size:14.5px;line-height:1.6;color:var(--emerald-deep)}
.tp-confirm .tpc-notice svg{width:20px;height:20px;flex-shrink:0;margin-top:1px;stroke:var(--emerald-deep);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tp-confirm .tpc-notice strong{font-weight:700}
.tp-confirm .tpc-ref-pill{display:inline-block;font-family:var(--tpc-body);font-size:12px;font-weight:700;letter-spacing:.06em;background:rgba(31,155,142,.10);color:var(--emerald-deep);padding:7px 15px;border-radius:999px;margin-bottom:22px}
.tp-confirm .tpc-line{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--tpc-line);font-size:15px}
.tp-confirm .tpc-l-name{font-weight:600;color:var(--navy)}
.tp-confirm .tpc-l-sub{display:block;font-size:12px;color:var(--muted);font-weight:500;margin-top:3px}
.tp-confirm .tpc-l-amount{font-family:var(--tpc-body);font-size:15px;font-weight:600;color:var(--navy);white-space:nowrap}
.tp-confirm .tpc-discount .tpc-l-name,.tp-confirm .tpc-discount .tpc-l-amount{color:var(--emerald-deep)}
.tp-confirm .tpc-total{border-bottom:none;padding-top:18px;margin-top:2px;border-top:1.5px solid var(--navy)}
.tp-confirm .tpc-total .tpc-l-name{font-family:var(--tpc-body);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--navy-soft)}
.tp-confirm .tpc-total .tpc-l-amount{font-family:var(--tpc-display);font-size:28px;font-weight:600;color:var(--navy);letter-spacing:-.01em}
.tp-confirm .tpc-meta{display:flex;justify-content:space-between;gap:16px;font-size:14.5px;padding:16px 0 2px;color:var(--navy-soft)}
.tp-confirm .tpc-meta b{color:var(--navy);font-weight:600}
.tp-confirm .tpc-invoice{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;margin-top:22px;background:var(--emerald);color:#fff;font-family:var(--tpc-body);font-weight:700;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;padding:15px;border:none;border-radius:12px;cursor:pointer;transition:background .15s,transform .1s;text-decoration:none;box-shadow:0 10px 22px -12px rgba(31,155,142,.55)}
.tp-confirm .tpc-invoice:hover{background:var(--emerald-deep);color:#fff}
.tp-confirm .tpc-invoice:active{transform:scale(.99)}
.tp-confirm .tpc-invoice svg{width:16px;height:16px;stroke:#fff;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tp-confirm .tpc-invoice-soon{margin-top:20px;font-size:14px;color:var(--muted);text-align:center;font-style:italic}
.tp-confirm .tpc-addr-card{margin-top:24px}
.tp-confirm .tpc-addr{background:var(--cream);border:1px solid var(--tpc-line);border-radius:var(--tpc-radius-sm);padding:20px 22px;font-size:15px;line-height:1.7;color:var(--navy)}
.tp-confirm .tpc-addr-contact{margin-top:10px;padding-top:10px;border-top:1px dashed var(--tpc-line);font-family:var(--tpc-body);font-size:14px;color:var(--navy-soft)}
.tp-confirm .tpc-help{text-align:center;margin-top:46px;font-size:15px;color:var(--muted)}
.tp-confirm .tpc-help a{color:var(--emerald-deep);font-weight:600;text-decoration:none;border-bottom:1px solid var(--emerald-deep)}
.tp-confirm .tpc-help a:hover{color:var(--emerald)}
@media (max-width:860px){.tp-confirm .tpc-grid{grid-template-columns:1fr}.tp-confirm .tpc-bank-mini{grid-template-columns:1fr 1fr}}
@media (max-width:520px){
  .tp-confirm{padding:36px 0 56px}
  .tp-confirm > *{padding-left:16px;padding-right:16px}
  .tp-confirm .tpc-hero h1{font-size:clamp(30px,8vw,40px)}
  .tp-confirm .tpc-card{padding:24px 22px}
  .tp-confirm .tpc-steps{flex-direction:column;gap:22px;align-items:flex-start;max-width:none}
  .tp-confirm .tpc-step{padding-top:0;padding-left:48px;text-align:left;width:100%}
  .tp-confirm .tpc-step::before{left:0;top:2px;transform:none}
  .tp-confirm .tpc-step::after{left:16px;top:38px;width:2px;height:calc(100% - 16px)}
  .tp-confirm .tpc-bank-mini{grid-template-columns:1fr}
  .tp-confirm .tpc-a-value{font-size:28px}
}

/* ===========================================================================
 * 56. TUNNEL CHECKOUT (body.woocommerce-checkout) — maquette Ta'iara-PRO
 * Design fourni par Teiva, integre au thème (remplace le Custom CSS Elementor,
 * a vider cote Elementor pour eviter les conflits). Elements HTML custom
 * (.tp-hero, .tp-pay-title, .tp-secured/.tp-trust, .tp-coupon-row) injectes par
 * taiara-wc-page.php + jobsearch-taiara.js. Variables scopees a body.woocommerce-checkout.
 * --------------------------------------------------------------------------- */
body.woocommerce-checkout{
  --navy:#16304d; --navy-soft:#27496b; --emerald:#1f9b8e; --emerald-deep:#15847a;
  --cream:#f6f0e6; --cream-deep:#efe6d7; --field:#f8efe4; --field-focus:#fffaf2;
  --ink:#1c2a3a; --muted:#8a8576; --line:#e7ddcc; --error:#c25b4a; --white:#fffdf9;
  --radius:16px; --radius-sm:11px;
  --shadow:0 24px 60px -28px rgba(22,48,77,.30); --shadow-soft:0 10px 30px -18px rgba(22,48,77,.35);
  --font-display:"Fraunces",Georgia,serif; --font-body:"Hanken Grotesk",system-ui,sans-serif;
  background:
    radial-gradient(900px 500px at 85% -8%, rgba(31,155,142,.10), transparent 60%),
    radial-gradient(800px 600px at -5% 5%, rgba(22,48,77,.07), transparent 55%),
    var(--cream) !important;
  font-family:var(--font-body) !important; color:var(--ink) !important; line-height:1.55 !important;
  -webkit-font-smoothing:antialiased;
}
body.woocommerce-checkout .elementor-widget-shortcode,
body.woocommerce-checkout .elementor-widget-shortcode > .elementor-widget-container,
body.woocommerce-checkout .elementor-widget-wrap,
body.woocommerce-checkout .e-con-inner,
body.woocommerce-checkout .e-con{display:contents !important}
body.woocommerce-checkout .elementor-section,
body.woocommerce-checkout .elementor-container,
body.woocommerce-checkout .elementor-column,
body.woocommerce-checkout .elementor-element,
body.woocommerce-checkout .elementor-widget,
body.woocommerce-checkout .elementor-widget-container{overflow:visible !important;max-width:none !important}

body.woocommerce-checkout .woocommerce{
  width:100vw !important; max-width:100vw !important; position:relative !important;
  left:50% !important; right:50% !important; margin-left:-50vw !important; margin-right:-50vw !important;
  padding:0 0 80px !important; background:transparent !important; color:var(--ink) !important;
  font-family:var(--font-body) !important; line-height:1.55 !important; box-sizing:border-box !important; float:none !important;
}
body.woocommerce-checkout .woocommerce-form-login,
body.woocommerce-checkout form.woocommerce-form-login,
body.woocommerce-checkout form.login,
body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout .woocommerce-additional-fields,
body.woocommerce-checkout #customer_details .col-2,
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout .woocommerce > .checkout_coupon,
body.woocommerce-checkout .woocommerce > form.checkout_coupon{display:none !important}

body.woocommerce-checkout .tp-hero{text-align:center;padding:54px 24px 30px;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
body.woocommerce-checkout .tp-hero__eyebrow{display:inline-block;font-family:var(--font-body);font-size:11px;font-weight:700;letter-spacing:.18em;color:var(--emerald-deep);background:rgba(31,155,142,.12);padding:7px 16px;border-radius:30px;margin-bottom:20px;text-transform:uppercase}
body.woocommerce-checkout .tp-hero__title{font-family:var(--font-display);font-weight:600;font-size:clamp(38px,6vw,62px);line-height:1.02;color:var(--navy);letter-spacing:-.02em;margin:0}
body.woocommerce-checkout .tp-hero__title em{font-style:italic;color:var(--emerald);font-weight:600}
body.woocommerce-checkout .tp-hero__sub{color:var(--muted);font-size:16px;margin:14px auto 0;max-width:480px}

body.woocommerce-checkout .woocommerce > .woocommerce-notices-wrapper,
body.woocommerce-checkout .woocommerce > .woocommerce-form-login-toggle,
body.woocommerce-checkout .woocommerce > .woocommerce-message,
body.woocommerce-checkout .woocommerce > .woocommerce-info,
body.woocommerce-checkout .woocommerce > .woocommerce-error{display:block !important;width:100% !important;max-width:1180px !important;margin:0 auto !important;padding-left:28px !important;padding-right:28px !important;box-sizing:border-box !important;position:relative !important;left:auto !important;right:auto !important;float:none !important}

body.woocommerce-checkout .woocommerce > form.checkout,
body.woocommerce-checkout .woocommerce form.woocommerce-checkout{display:grid !important;grid-template-columns:1.7fr 1fr !important;grid-template-rows:auto 1fr !important;column-gap:28px !important;row-gap:0 !important;align-items:start !important;width:100% !important;max-width:1280px !important;margin:14px auto 0 !important;padding:0 28px !important;box-sizing:border-box !important;position:relative !important;left:auto !important;right:auto !important;float:none !important;background:transparent !important}
body.woocommerce-checkout .woocommerce > form.checkout > *{min-width:0 !important}

.woocommerce-checkout form.checkout #customer_details{grid-column:1 !important;grid-row:1 / span 2 !important;align-self:start !important;background:var(--white) !important;border:1px solid var(--line) !important;border-radius:var(--radius) !important;box-shadow:var(--shadow) !important;padding:34px 34px 38px !important;margin:0 !important;width:auto !important;max-width:none !important;display:block !important;float:none !important;box-sizing:border-box !important}
.woocommerce-checkout form.checkout #customer_details .col-1,
.woocommerce-checkout form.checkout #customer_details > div{background:transparent !important;border:none !important;box-shadow:none !important;padding:0 !important;margin:0 !important;width:100% !important;float:none !important;box-sizing:border-box !important}

.woocommerce-checkout .woocommerce-form-login-toggle{margin:0 0 32px !important;padding:0 !important}
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info{display:flex !important;align-items:center !important;gap:14px !important;padding:18px 22px !important;border-radius:var(--radius-sm) !important;background:linear-gradient(100deg,rgba(31,155,142,.09),rgba(22,48,77,.05)) !important;border:1px solid var(--line) !important;border-left:4px solid var(--emerald) !important;font-size:14.5px !important;color:var(--navy-soft) !important;font-family:var(--font-body) !important;font-weight:500 !important;margin:0 !important;box-shadow:none !important;list-style:none !important;cursor:pointer !important}
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info::before{content:"" !important;width:30px !important;height:30px !important;border-radius:50% !important;background:rgba(31,155,142,.15) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2315847a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/><circle cx='12' cy='7' r='4'/></svg>") center/16px no-repeat !important;flex:none !important;color:transparent !important;position:relative !important;top:auto !important;left:auto !important;font-size:0 !important;display:inline-block !important;margin:0 !important}
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info a{color:var(--emerald-deep) !important;font-weight:700 !important;text-decoration:none !important;border-bottom:2px solid transparent !important;transition:border-color .2s !important}
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info a:hover{border-bottom-color:var(--emerald-deep) !important}

.woocommerce-checkout .woocommerce-billing-fields > h3,
.woocommerce-checkout .woocommerce-additional-fields > h3{font-family:var(--font-display) !important;font-weight:600 !important;font-size:24px !important;color:var(--navy) !important;letter-spacing:-.01em !important;margin:18px 0 24px !important;padding:0 !important;border:none !important;text-transform:none !important}
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-additional-fields__field-wrapper{display:grid !important;grid-template-columns:repeat(6,minmax(0,1fr)) !important;gap:14px !important}
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row{grid-column:span 2 !important}
.woocommerce-checkout #billing_email_field,
.woocommerce-checkout #billing_phone_field{grid-column:span 3 !important}
.woocommerce-checkout .form-row-wide{grid-column:1 / -1 !important}
.woocommerce-checkout .form-row{margin:0 !important;padding:0 !important;display:flex !important;flex-direction:column !important;gap:7px !important;width:100% !important;min-width:0 !important}
.woocommerce-checkout .form-row .woocommerce-input-wrapper,
.woocommerce-checkout .woocommerce-input-wrapper{display:block !important;width:100% !important}
.woocommerce-checkout .form-row label{display:block !important;font-family:var(--font-body) !important;font-size:11px !important;font-weight:700 !important;letter-spacing:.06em !important;text-transform:uppercase !important;color:var(--navy-soft) !important;margin:0 !important;line-height:1.3 !important;min-height:14px !important}
.woocommerce-checkout .form-row label .required,
.woocommerce-checkout .form-row label abbr.required,
.woocommerce-checkout .form-row label .optional{display:none !important}
.woocommerce-checkout .form-row input[type="text"],
.woocommerce-checkout .form-row input[type="email"],
.woocommerce-checkout .form-row input[type="tel"],
.woocommerce-checkout .form-row input[type="number"],
.woocommerce-checkout .form-row input[type="password"],
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select{font-family:var(--font-body) !important;font-size:15px !important;color:var(--ink) !important;background:var(--field) !important;border:1.5px solid rgba(196,185,163,.45) !important;border-radius:10px !important;padding:11px 14px !important;width:100% !important;height:auto !important;min-height:0 !important;box-sizing:border-box !important;line-height:1.4 !important;transition:background .2s,border-color .2s,box-shadow .2s !important}
.woocommerce-checkout .form-row input::placeholder,
.woocommerce-checkout .form-row textarea::placeholder{color:#b3ac9c !important}
.woocommerce-checkout .form-row input:hover,
.woocommerce-checkout .form-row textarea:hover,
.woocommerce-checkout .form-row select:hover{background:#f5e9da !important;border-color:rgba(196,185,163,.7) !important}
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row select:focus{outline:none !important;background:var(--field-focus) !important;border-color:var(--emerald) !important;box-shadow:0 0 0 4px rgba(31,155,142,.13) !important}

.woocommerce-checkout form.checkout #order_review_heading{grid-column:2 !important;grid-row:1 !important;align-self:start !important;position:static !important;background:var(--white) !important;border:1px solid var(--line) !important;border-bottom:1px solid var(--line) !important;border-radius:var(--radius) var(--radius) 0 0 !important;margin:0 !important;padding:30px 34px 22px !important;box-shadow:0 -1px 0 0 var(--white) !important;font-family:var(--font-display) !important;font-weight:600 !important;font-size:22px !important;color:var(--navy) !important;letter-spacing:-.01em !important;text-transform:none !important;width:auto !important;max-width:none !important;display:block !important}
.woocommerce-checkout form.checkout #order_review{grid-column:2 !important;grid-row:2 !important;align-self:start !important;position:static !important;background:var(--white) !important;border:1px solid var(--line) !important;border-top:none !important;border-radius:0 0 var(--radius) var(--radius) !important;padding:0 34px 38px !important;box-shadow:var(--shadow) !important;margin:0 !important;width:auto !important;max-width:none !important;box-sizing:border-box !important;overflow:visible !important;display:block !important}

.woocommerce-checkout #order_review table.shop_table{width:100% !important;border:none !important;margin:0 !important;background:transparent !important;border-collapse:collapse !important;table-layout:auto !important}
.woocommerce-checkout #order_review table.shop_table thead{display:none !important}
.woocommerce-checkout #order_review table.shop_table tbody td,
.woocommerce-checkout #order_review table.shop_table tfoot td,
.woocommerce-checkout #order_review table.shop_table tfoot th{padding:14px 0 !important;border:none !important;border-bottom:1px solid var(--line) !important;font-family:var(--font-body) !important;font-size:14.5px !important;color:var(--navy-soft) !important;background:transparent !important;vertical-align:middle !important}
.woocommerce-checkout #order_review table.shop_table tbody td.product-name{font-family:var(--font-body) !important;font-weight:600 !important;color:var(--navy) !important;font-size:15px !important;padding-right:12px !important}
.woocommerce-checkout #order_review table.shop_table tbody td.product-name strong.product-quantity,
.woocommerce-checkout #order_review table.shop_table tbody td.product-name .product-quantity{font-weight:600 !important;font-family:var(--font-body) !important;color:var(--muted) !important;font-size:12px !important;display:inline-block !important;background:var(--cream-deep) !important;padding:2px 9px !important;border-radius:20px !important;margin-left:8px !important}
.woocommerce-checkout #order_review table.shop_table tbody td.product-total{text-align:right !important;font-weight:700 !important;color:var(--navy) !important;white-space:nowrap !important}
.woocommerce-checkout #order_review table.shop_table tfoot tr.cart-subtotal th,
.woocommerce-checkout #order_review table.shop_table tfoot tr.fee th{font-family:var(--font-body) !important;font-weight:500 !important;color:var(--navy-soft) !important;font-size:14.5px !important;text-transform:none !important;letter-spacing:0 !important;padding:10px 0 !important;border-bottom:none !important}
.woocommerce-checkout #order_review table.shop_table tfoot tr.cart-subtotal td,
.woocommerce-checkout #order_review table.shop_table tfoot tr.fee td{text-align:right !important;font-weight:500 !important;color:var(--navy-soft) !important;font-size:14.5px !important;padding:10px 0 !important;border-bottom:none !important}
.woocommerce-checkout #order_review table.shop_table tfoot tr.cart-discount th,
.woocommerce-checkout #order_review table.shop_table tfoot tr.cart-discount td{color:var(--emerald-deep) !important;font-weight:600 !important}
.woocommerce-checkout #order_review table.shop_table tfoot tr.order-total th{font-family:var(--font-body) !important;font-weight:700 !important;font-size:13px !important;color:var(--navy-soft) !important;text-transform:uppercase !important;letter-spacing:.1em !important;padding:14px 0 4px !important;border-top:1.5px solid var(--navy) !important;border-bottom:none !important;vertical-align:baseline !important}
.woocommerce-checkout #order_review table.shop_table tfoot tr.order-total td{font-family:var(--font-display) !important;font-weight:700 !important;font-size:30px !important;color:var(--navy) !important;padding:14px 0 4px !important;text-align:right !important;border-top:1.5px solid var(--navy) !important;border-bottom:none !important;letter-spacing:-.01em !important;white-space:nowrap !important;vertical-align:baseline !important}
.woocommerce-checkout #order_review table.shop_table tfoot tr.order-total td .woocommerce-Price-currencySymbol{font-size:15px !important;font-weight:600 !important;color:var(--emerald-deep) !important;margin-left:2px !important}

.woocommerce-checkout #order_review table.shop_table tfoot tr.tp-coupon-row td{padding:18px 0 14px !important;border:none !important;border-bottom:1px solid var(--line) !important;background:transparent !important}
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon{display:flex !important;flex-wrap:nowrap !important;align-items:center !important;gap:9px !important;background:transparent !important;border:none !important;box-shadow:none !important;border-radius:0 !important;padding:0 !important;margin:0 !important;position:static !important}
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon > p:not(.form-row),
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon > .clear{display:none !important}
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon p.form-row{margin:0 !important;padding:0 !important;display:block !important}
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon p.form-row.form-row-first{flex:1 1 0% !important;min-width:0 !important;order:1 !important;width:auto !important;float:none !important}
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon p.form-row.form-row-last{flex:0 0 auto !important;order:2 !important;width:auto !important;float:none !important}
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon input[name="coupon_code"]{font-family:var(--font-body) !important;font-size:14px !important;color:var(--ink) !important;background:var(--field) !important;border:1.5px solid transparent !important;border-radius:var(--radius-sm) !important;padding:12px 14px !important;width:100% !important;height:auto !important;box-sizing:border-box !important;transition:.2s !important}
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon input[name="coupon_code"]:focus{outline:none !important;background:var(--field-focus) !important;border-color:var(--emerald) !important;box-shadow:0 0 0 4px rgba(31,155,142,.12) !important}
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon button[name="apply_coupon"]{font-family:var(--font-body) !important;font-weight:600 !important;font-size:12.5px !important;letter-spacing:.04em !important;background:var(--emerald) !important;color:#fff !important;border:none !important;border-radius:var(--radius-sm) !important;padding:0 18px !important;height:44px !important;line-height:1 !important;cursor:pointer !important;white-space:nowrap !important;text-transform:uppercase !important;transition:background .2s !important;flex-shrink:0 !important}
.woocommerce-checkout tr.tp-coupon-row .checkout_coupon button[name="apply_coupon"]:hover{background:var(--emerald-deep) !important}

.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout .woocommerce-info{background:var(--white) !important;border:1px solid var(--line) !important;border-left:4px solid var(--emerald) !important;border-radius:var(--radius-sm) !important;padding:14px 18px !important;font-size:14px !important;color:var(--navy-soft) !important;margin:14px auto !important;box-shadow:var(--shadow-soft) !important;list-style:none !important}
.woocommerce-checkout .woocommerce-message::before,
.woocommerce-checkout .woocommerce-message::after,
.woocommerce-checkout .woocommerce-error::before,
.woocommerce-checkout .woocommerce-error::after,
.woocommerce-checkout .woocommerce-info::before,
.woocommerce-checkout .woocommerce-info::after,
.woocommerce-checkout .woocommerce-message li::before,
.woocommerce-checkout .woocommerce-error li::before,
.woocommerce-checkout .woocommerce-info li::before{display:none !important;content:none !important}
.woocommerce-checkout .woocommerce-message li,
.woocommerce-checkout .woocommerce-error li,
.woocommerce-checkout .woocommerce-info li{padding:0 !important;margin:0 !important;list-style:none !important}
.woocommerce-checkout .woocommerce-error{border-left-color:var(--error) !important}
.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout .woocommerce-error li,
.woocommerce-checkout .woocommerce-error p,
.woocommerce-checkout .woocommerce-error strong{color:var(--error) !important;background:transparent !important}
.woocommerce-checkout .woocommerce-error a{color:var(--error) !important;text-decoration:underline !important;font-weight:600 !important}
.woocommerce-checkout .woocommerce-message li,
.woocommerce-checkout .woocommerce-message p,
.woocommerce-checkout .woocommerce-info li,
.woocommerce-checkout .woocommerce-info p{color:var(--navy-soft) !important;background:transparent !important}
.woocommerce-checkout .woocommerce-message a,
.woocommerce-checkout .woocommerce-info a{color:var(--emerald-deep) !important;font-weight:600 !important;text-decoration:none !important}

body.woocommerce-checkout .tp-pay-title{font-family:var(--font-body) !important;font-size:12px !important;font-weight:700 !important;letter-spacing:.09em !important;text-transform:uppercase !important;color:var(--navy-soft) !important;margin:24px 0 12px !important}

.woocommerce-checkout #payment{background:transparent !important;border:none !important;border-radius:0 !important;padding:0 !important;margin:0 !important;width:100% !important;box-sizing:border-box !important}
.woocommerce-checkout #payment ul.payment_methods{background:transparent !important;border:none !important;border-radius:0 !important;padding:0 !important;margin:0 !important;list-style:none !important;display:flex !important;flex-direction:column !important;gap:11px !important}
.woocommerce-checkout #payment ul.payment_methods li{list-style:none !important;background:var(--white) !important;border:1.5px solid var(--line) !important;border-radius:13px !important;padding:14px 18px !important;margin:0 !important;transition:border-color .2s,background .2s,box-shadow .2s !important;cursor:pointer !important;display:flex !important;flex-wrap:wrap !important;align-items:center !important;gap:10px !important;row-gap:8px !important}
.woocommerce-checkout #payment ul.payment_methods li:hover{border-color:#cbbfa8 !important}
.woocommerce-checkout #payment ul.payment_methods li.tp-payment-active{border-color:var(--emerald) !important;background:rgba(31,155,142,.05) !important;box-shadow:0 0 0 3px rgba(31,155,142,.10) !important}
.woocommerce-checkout #payment ul.payment_methods li > label{display:inline-flex !important;align-items:center !important;gap:10px !important;padding:0 !important;font-family:var(--font-body) !important;font-weight:600 !important;font-size:15px !important;color:var(--navy) !important;cursor:pointer !important;margin:0 !important;flex:1 1 auto !important;min-width:0 !important;line-height:1.3 !important}
.woocommerce-checkout #payment ul.payment_methods li > label img{max-height:22px !important;width:auto !important;margin-left:auto !important}
.woocommerce-checkout #payment ul.payment_methods li input[type="radio"]{appearance:none !important;-webkit-appearance:none !important;width:20px !important;height:20px !important;border-radius:50% !important;border:2px solid #c4b9a3 !important;background:transparent !important;flex-shrink:0 !important;position:relative !important;cursor:pointer !important;margin:0 !important;transition:border-color .2s !important;order:0 !important}
.woocommerce-checkout #payment ul.payment_methods li input[type="radio"]:checked{border-color:var(--emerald) !important}
.woocommerce-checkout #payment ul.payment_methods li input[type="radio"]:checked::after{content:'' !important;position:absolute !important;inset:4px !important;background:var(--emerald) !important;border-radius:50% !important}
.woocommerce-checkout #payment div.payment_box{background:transparent !important;border:none !important;border-radius:0 !important;padding:0 0 0 34px !important;font-family:var(--font-body) !important;font-size:13.5px !important;color:var(--navy) !important;margin:0 !important;line-height:1.6 !important;width:100% !important;flex:1 1 100% !important;max-width:100% !important;box-sizing:border-box !important;overflow-wrap:break-word !important;max-height:0 !important;opacity:0 !important;overflow:hidden !important;transition:max-height .3s,opacity .3s,padding .3s !important;order:2 !important}
.woocommerce-checkout #payment div.payment_box::before{display:none !important}
.woocommerce-checkout #payment ul.payment_methods li.tp-payment-active div.payment_box{max-height:240px !important;opacity:1 !important;padding-top:6px !important}
.woocommerce-checkout #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box p,
.woocommerce-checkout #payment div.payment_box span,
.woocommerce-checkout #payment div.payment_box strong,
.woocommerce-checkout #payment div.payment_box li{color:var(--navy) !important}
.woocommerce-checkout #payment div.payment_box a{color:var(--emerald-deep) !important;font-weight:600 !important;text-decoration:none !important}
.woocommerce-checkout #payment div.payment_box p{margin:0 0 8px !important}
.woocommerce-checkout #payment div.payment_box p:last-child{margin:0 !important}
.woocommerce-checkout #payment div.payment_box code{background:var(--cream-deep) !important;padding:2px 7px !important;border-radius:6px !important;font-family:inherit !important;font-size:12.5px !important;color:var(--navy) !important;font-weight:600 !important;letter-spacing:.02em !important}
.woocommerce-checkout #payment div.payment_box select,
.woocommerce-checkout #payment div.payment_box input[type="text"],
.woocommerce-checkout #payment div.payment_box input[type="email"]{font-family:var(--font-body) !important;font-size:14px !important;padding:10px 12px !important;border:1.5px solid var(--line) !important;border-radius:9px !important;background:var(--white) !important;width:100% !important;max-width:100% !important;color:var(--ink) !important;margin-top:8px !important;box-sizing:border-box !important}

.woocommerce-checkout #order_review .woocommerce-terms-and-conditions-wrapper{display:block !important;margin:22px 0 18px !important;padding:0 !important;background:transparent !important;border:none !important}
.woocommerce-checkout .woocommerce-terms-and-conditions,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper > p:not(.form-row):not(.wc-terms-and-conditions),
.woocommerce-checkout .woocommerce-privacy-policy-text,
.woocommerce-checkout .woocommerce-terms-and-conditions-link{display:none !important}
.woocommerce-checkout #order_review .wc-terms-and-conditions,
.woocommerce-checkout #order_review .form-row.terms,
.woocommerce-checkout .form-row.terms-and-conditions{background:transparent !important;padding:0 !important;margin:0 !important;border:none !important;font-size:13.5px !important;display:flex !important;flex-direction:row !important;align-items:flex-start !important;flex-wrap:nowrap !important;gap:11px !important;color:var(--navy-soft) !important}
.woocommerce-checkout .wc-terms-and-conditions label,
.woocommerce-checkout .form-row.terms label,
.woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text{font-weight:400 !important;color:var(--navy-soft) !important;font-family:var(--font-body) !important;font-size:13.5px !important;line-height:1.55 !important;display:inline !important;margin:0 !important;flex:1 1 auto !important;min-width:0 !important;text-transform:none !important;letter-spacing:0 !important}
.woocommerce-checkout .wc-terms-and-conditions a,
.woocommerce-checkout .form-row.terms a{color:var(--emerald-deep) !important;font-weight:600 !important;text-decoration:none !important;border-bottom:1px solid var(--emerald-deep) !important}
.woocommerce-checkout .form-row.terms input[type="checkbox"],
.woocommerce-checkout .form-row.terms-and-conditions input[type="checkbox"]{appearance:none !important;-webkit-appearance:none !important;width:21px !important;height:21px !important;margin:0 !important;border-radius:6px !important;border:2px solid #c4b9a3 !important;background:var(--white) !important;flex-shrink:0 !important;cursor:pointer !important;position:relative !important;transition:.18s !important}
.woocommerce-checkout .form-row.terms input[type="checkbox"]:checked,
.woocommerce-checkout .form-row.terms-and-conditions input[type="checkbox"]:checked{background:var(--emerald) !important;border-color:var(--emerald) !important}
.woocommerce-checkout .form-row.terms input[type="checkbox"]:checked::after,
.woocommerce-checkout .form-row.terms-and-conditions input[type="checkbox"]:checked::after{content:'' !important;position:absolute !important;left:5px !important;top:1px !important;width:7px !important;height:12px !important;border:solid #fff !important;border-width:0 2.5px 2.5px 0 !important;transform:rotate(45deg) !important}

.woocommerce-checkout #place_order,
.woocommerce-checkout button[name="woocommerce_checkout_place_order"]{display:flex !important;width:100% !important;align-items:center !important;justify-content:center !important;gap:10px !important;background:linear-gradient(120deg,var(--navy),var(--navy-soft)) !important;color:#fff !important;border:none !important;border-radius:14px !important;padding:18px !important;font-family:var(--font-body) !important;font-weight:700 !important;font-size:15.5px !important;letter-spacing:.06em !important;text-transform:uppercase !important;cursor:pointer !important;margin:0 !important;white-space:normal !important;line-height:1.2 !important;height:auto !important;text-align:center !important;text-shadow:none !important;box-shadow:0 14px 30px -14px rgba(22,48,77,.6) !important;transition:transform .25s,box-shadow .25s !important}
.woocommerce-checkout #place_order:hover{transform:translateY(-2px);box-shadow:0 20px 36px -14px rgba(22,48,77,.65) !important}
.woocommerce-checkout #place_order::after{content:"" !important;flex:none !important;width:18px !important;height:18px !important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='12 5 19 12 12 19'/%3E%3C/svg%3E") center/contain no-repeat !important;transition:transform .25s ease !important}
.woocommerce-checkout #place_order:hover::after{transform:translateX(4px) !important}

body.woocommerce-checkout .tp-secured{display:flex;align-items:center;justify-content:center;gap:7px;color:var(--muted);font-size:12.5px;margin-top:16px;font-family:var(--font-body)}
body.woocommerce-checkout .tp-secured svg{width:14px;height:14px;color:var(--emerald-deep);flex-shrink:0}
body.woocommerce-checkout .tp-trust{display:flex;gap:18px;justify-content:center;margin-top:18px;flex-wrap:wrap}
body.woocommerce-checkout .tp-trust__item{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);font-weight:500;font-family:var(--font-body)}
body.woocommerce-checkout .tp-trust__item svg{width:14px;height:14px;color:var(--emerald);flex-shrink:0}

.woocommerce-checkout #payment ul.payment_methods li input[type="radio"]:focus-visible,
.woocommerce-checkout .form-row.terms input[type="checkbox"]:focus-visible,
.woocommerce-checkout .form-row.terms-and-conditions input[type="checkbox"]:focus-visible{outline:2px solid var(--emerald) !important;outline-offset:3px !important}
.woocommerce-checkout #place_order:focus-visible{outline:3px solid rgba(31,155,142,.55) !important;outline-offset:3px !important}

@media (max-width:1280px){
  body.woocommerce-checkout .woocommerce > form.checkout,
  body.woocommerce-checkout .woocommerce form.woocommerce-checkout{column-gap:24px !important;padding:0 22px !important;grid-template-columns:1.55fr 1fr !important}
  body.woocommerce-checkout .woocommerce > .woocommerce-notices-wrapper,
  body.woocommerce-checkout .woocommerce > .woocommerce-form-login-toggle{padding-left:22px !important;padding-right:22px !important}
  .woocommerce-checkout form.checkout #customer_details{padding:30px 28px 32px !important}
  .woocommerce-checkout form.checkout #order_review_heading{padding:28px 28px 18px !important}
  .woocommerce-checkout form.checkout #order_review{padding:0 28px 32px !important}
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
  .woocommerce-checkout .woocommerce-additional-fields__field-wrapper{gap:12px !important}
}
@media (max-width:980px){
  body.woocommerce-checkout .woocommerce > form.checkout,
  body.woocommerce-checkout .woocommerce form.woocommerce-checkout{grid-template-columns:1fr !important;grid-template-rows:auto auto auto !important;row-gap:0 !important;max-width:720px !important}
  body.woocommerce-checkout .woocommerce > .woocommerce-notices-wrapper,
  body.woocommerce-checkout .woocommerce > .woocommerce-form-login-toggle{max-width:720px !important}
  .woocommerce-checkout form.checkout #customer_details{grid-column:1 !important;grid-row:1 !important}
  .woocommerce-checkout form.checkout #order_review_heading{grid-column:1 !important;grid-row:2 !important;position:static !important;margin-top:24px !important;border-radius:var(--radius) var(--radius) 0 0 !important}
  .woocommerce-checkout form.checkout #order_review{grid-column:1 !important;grid-row:3 !important;position:static !important}
  body.woocommerce-checkout .tp-hero{padding:44px 22px 26px}
  body.woocommerce-checkout .tp-hero__title{font-size:clamp(32px,7vw,48px)}
}
@media (max-width:720px){
  body.woocommerce-checkout .tp-hero{padding:36px 18px 22px}
  body.woocommerce-checkout .woocommerce{padding:0 0 56px !important}
  body.woocommerce-checkout .woocommerce > .woocommerce-notices-wrapper,
  body.woocommerce-checkout .woocommerce > .woocommerce-form-login-toggle,
  body.woocommerce-checkout .woocommerce > form.checkout,
  body.woocommerce-checkout .woocommerce form.woocommerce-checkout{padding-left:16px !important;padding-right:16px !important}
  .woocommerce-checkout form.checkout #customer_details{padding:24px 20px 26px !important}
  .woocommerce-checkout form.checkout #order_review_heading{padding:22px 20px 14px !important;font-size:19px !important}
  .woocommerce-checkout form.checkout #order_review{padding:0 20px 24px !important}
  .woocommerce-checkout .woocommerce-billing-fields > h3{font-size:21px !important;margin-bottom:20px !important}
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
  .woocommerce-checkout .woocommerce-additional-fields__field-wrapper{grid-template-columns:1fr !important;gap:14px !important}
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row,
  .woocommerce-checkout #billing_email_field,
  .woocommerce-checkout #billing_phone_field{grid-column:auto !important}
  .woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info{padding:14px 16px !important;font-size:13.5px !important;gap:10px !important}
  .woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info::before{width:26px !important;height:26px !important}
  .woocommerce-checkout tr.tp-coupon-row .checkout_coupon{flex-wrap:wrap !important;gap:8px !important}
  .woocommerce-checkout tr.tp-coupon-row .checkout_coupon p.form-row.form-row-first{flex:1 1 100% !important}
  .woocommerce-checkout tr.tp-coupon-row .checkout_coupon p.form-row.form-row-last{flex:1 1 100% !important}
  .woocommerce-checkout tr.tp-coupon-row .checkout_coupon button[name="apply_coupon"]{width:100% !important;height:42px !important}
  .woocommerce-checkout #order_review table.shop_table tfoot tr.order-total td{font-size:24px !important}
  .woocommerce-checkout #place_order{font-size:14px !important;padding:16px !important}
  body.woocommerce-checkout .tp-trust{gap:12px !important}
  body.woocommerce-checkout .tp-trust__item{font-size:11px !important}
}


/* ===========================================================================
 * 61. TABLEAU DE BORD — POLISH SECTIONS (chart, hover, etats vides)
 * --------------------------------------------------------------------------- */

/* --- 61.1/61.2 GRAPHIQUE SUPPRIME : les KPI (cartes) suffisent, le chart
 * Morris ne faisait que repeter ces memes chiffres en 4 barres. On masque le
 * graphe ET la carte de legende "Nombre total de candidatures" (element frere,
 * pas dans .jobsearch-applicants-graph). La section garde son titre + les KPI. */
.page-template-user-dashboard-template .jobsearch-applicants-graph,
.page-template-user-dashboard-template .jobsearch-applicants-stats {
  display: none !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list {
  margin-bottom: 0 !important;
}

/* --- 61.3 Cartes stats : accent de hover COHERENT (emerald) sur les 4,
 * fini la barre orange aleatoire du 4e. --- */
.page-template-user-dashboard-template .jobsearch-stats-list-wrap:before,
.page-template-user-dashboard-template .jobsearch-stats-list ul li:nth-child(4) .jobsearch-stats-list-wrap:before {
  background: var(--tp-accent) !important;
}
.page-template-user-dashboard-template .jobsearch-stats-list-wrap:hover {
  border-color: rgba(31, 155, 142, 0.35) !important;
}

/* --- 61.4 Etats vides : notifications + candidatures = message centre + icone
 * au lieu d'une grande carte vide / d'un texte gris seul. --- */
.page-template-user-dashboard-template .jobsearch-employer-box-section > p,
.page-template-user-dashboard-template .dash-notifics-nofound {
  text-align: center !important;
  color: var(--tp-text-muted) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  padding: 30px 20px !important;
  margin: 0 !important;
}
.page-template-user-dashboard-template .jobsearch-employer-box-section > p:before {
  content: "📄";
  display: block;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 12px;
  opacity: 0.5;
}
.page-template-user-dashboard-template .dash-notifics-nofound:before {
  content: "🔔";
  display: block;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 12px;
  opacity: 0.5;
}


/* ===========================================================================
 * 62. PANNEAU NOTIFICATIONS DU DASHBOARD — TOUJOURS VISIBLE.
 * Avant : masqué par défaut et révélé au clic sur la cloche du header (via
 * :target). La cloche a été RETIRÉE (voir functions.php) -> il n'y a plus de
 * lien pour le révéler, donc on l'affiche en permanence dans le tableau de bord.
 * --------------------------------------------------------------------------- */
.page-template-user-dashboard-template #jobsearch-notification-section {
  display: block !important;
  scroll-margin-top: 90px;
}


/* ===========================================================================
 * 63. MON PROFIL — Select2 pleine largeur + layout coherent
 * Les champs .jobsearch-profile-select (Secteur, Profil, Domaine, Competences,
 * Duree du stage...) utilisent Select2 mais rendaient etroit : la zone
 * .select2-selection etait en display flex a largeur auto (~399px), trop haute,
 * placeholder rejete a droite. Le conteneur est deja a width:100% ; on force la
 * SELECTION a remplir, hauteur auto, et un layout propre, single ET multiple.
 * --------------------------------------------------------------------------- */
.jobsearch-profile-select .select2-container {
  width: 100% !important;
  display: block !important;
}

/* Le wrapper porte le chevron unique (voir plus bas) */
.jobsearch-profile-select {
  position: relative !important;
}

/* Zone de selection : pleine largeur, aligne sur nos inputs (46px, radius 10).
 * padding-right laisse la place au chevron unique. */
.jobsearch-profile-select .select2-container .select2-selection {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  width: 100% !important;
  min-height: 46px !important;
  height: auto !important;
  box-sizing: border-box !important;
  padding: 5px 38px 5px 12px !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  background: #fff !important;
}
.jobsearch-profile-select .select2-container--focus .select2-selection,
.jobsearch-profile-select .select2-container--open .select2-selection {
  border-color: var(--tp-navy) !important;
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
}

/* Le <ul> des puces : NE grossit PAS (sinon il pousse la recherche a droite et
 * cree la "boite vide"). Il ne prend que la largeur de ses puces et wrappe. */
.jobsearch-profile-select .select2-selection__rendered {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 0 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  line-height: 1.4 !important;
}

/* SINGLE : le texte selectionne prend l'espace */
.jobsearch-profile-select .select2-selection--single .select2-selection__rendered {
  flex: 1 1 auto !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* MULTIPLE : le champ de recherche (avec le placeholder) REMPLIT l'espace
 * restant -> le placeholder s'affiche sur toute la largeur quand c'est vide. */
.jobsearch-profile-select .select2-selection--multiple .select2-search--inline {
  flex: 1 1 auto !important;
  margin: 0 !important;
  min-width: 60px !important;
}
.jobsearch-profile-select .select2-selection--multiple .select2-search__field {
  width: 100% !important;
  min-width: 60px !important;
  height: 30px !important;
  line-height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  resize: none !important;
  overflow: hidden !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14.5px !important;
  color: var(--tp-navy) !important;
}

/* Placeholder gris coherent */
.jobsearch-profile-select .select2-selection__placeholder,
.jobsearch-profile-select .select2-search__field::placeholder {
  color: var(--tp-text-muted) !important;
  opacity: 1 !important;
}

/* --- CHEVRON UNIQUE ---------------------------------------------------------
 * Il y avait DEUX chevrons superposes : un ::after sur .select2-selection et un
 * ::after sur le wrapper .jobsearch-profile-select (plugin). On tue toutes les
 * fleches natives/plugin et on dessine UN seul chevron propre sur le wrapper. */
.jobsearch-profile-select .select2-selection::after,
.jobsearch-profile-select .select2-selection__arrow {
  display: none !important;
}
.jobsearch-profile-select::after {
  content: "" !important;
  position: absolute !important;
  right: 16px !important;
  top: 18px !important; /* centre sur la 1re rangee (hauteur ~46px) */
  width: 9px !important;
  height: 9px !important;
  border: 0 !important;
  border-right: 2px solid var(--tp-navy) !important;
  border-bottom: 2px solid var(--tp-navy) !important;
  transform: rotate(45deg) !important;
  background: none !important;
  pointer-events: none !important;
  margin: 0 !important;
}


/* --- 63.b FINITIONS : supprimer les "doubles" (cadre / bordure / chevron) ----
 * Objectif : que les multi-selects soient aussi propres que le single "Dernier
 * diplome obtenu" -> UNE seule boite (.select2-selection), UN seul chevron.
 * Le champ de recherche (textarea) portait sa propre bordure/fond => 2e cadre a
 * cote des puces. Le wrapper pouvait aussi avoir une bordure => double bordure.
 * On aplatit tout. */

/* Le wrapper n'est qu'un conteneur : aucune bordure/fond/ombre propre */
.jobsearch-profile-select {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* La zone de recherche (inline) et son textarea fondent dans la boite unique */
.jobsearch-profile-select .select2-search,
.jobsearch-profile-select .select2-search--inline {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.jobsearch-profile-select .select2-search__field {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Un seul chevron : on re-tue TOUTE fleche select2/native residuelle
 * (le chevron unique est dessine sur .jobsearch-profile-select::after en 63). */
.jobsearch-profile-select .select2-selection__arrow,
.jobsearch-profile-select .select2-selection__arrow b,
.jobsearch-profile-select .select2-selection::before,
.jobsearch-profile-select .select2-selection::after,
.jobsearch-profile-select .select2-container::before,
.jobsearch-profile-select .select2-container::after {
  display: none !important;
}


/* --- 63.c / 64. Multi-selects en "recherche EN HAUT du menu" ----------------
 * Quand le JS a bascule un multi-select en dropdownAdapter+search (classe
 * .tp-topsearch-on posee sur le wrapper), la recherche est desormais DANS le
 * menu. On masque donc la recherche EN LIGNE et on affiche le placeholder via
 * data-ph quand aucune puce n'est selectionnee. Rendu = identique aux single. */
.jobsearch-profile-select.tp-topsearch-on .select2-selection--multiple .select2-search--inline {
  display: none !important;
}
.jobsearch-profile-select.tp-topsearch-on .select2-selection__rendered:empty::before {
  content: attr(data-ph);
  color: var(--tp-text-muted);
  font-family: "Inter", sans-serif;
  font-size: 14.5px;
  line-height: 1.4;
}
/* La barre de recherche EN HAUT du menu : deja stylee en §26, on s'assure juste
 * qu'elle respire bien dans nos dropdowns. */
.jobsearch-profile-select .select2-dropdown .select2-search--dropdown {
  padding: 8px !important;
}


/* ===========================================================================
 * 65. SUPPRESSION DE TOUS LES CHEVRONS des listes deroulantes (dashboard)
 * Demande : plus aucun chevron sur les selects. On tue toutes les sources :
 * fleche Select2 (single + multiple), notre chevron de wrapper (§63), et la
 * fleche SVG de fond des selects natifs (§32.2). On recupere la place a droite.
 * --------------------------------------------------------------------------- */
.page-template-user-dashboard-template .select2-selection__arrow,
.page-template-user-dashboard-template .select2-selection__arrow b,
.jobsearch-profile-select .select2-selection__arrow,
.jobsearch-profile-select::before,
.jobsearch-profile-select::after {
  display: none !important;
}

/* Selects natifs : retire la fleche SVG de fond + rend la place a droite */
.page-template-user-dashboard-template .jobsearch-typo-wrap select:not(.select2-hidden-accessible),
.page-template-user-dashboard-template .user-dashboard-content select:not(.select2-hidden-accessible),
.jobsearch-modal select:not(.select2-hidden-accessible) {
  background-image: none !important;
  padding-right: 14px !important;
}

/* Select2 : on n'a plus besoin de la place reservee au chevron */
.jobsearch-profile-select .select2-container .select2-selection {
  padding-right: 12px !important;
}


/* ===========================================================================
 * 66. KILL ABSOLU DES CHEVRONS (priorite max, bat Careerfy)
 * Le §65 perdait la bataille de specificite contre les regles Careerfy
 * (.select2-container--default .select2-selection--single .select2-selection__arrow).
 * On prefixe html body + on couvre toutes les sources.
 * --------------------------------------------------------------------------- */
html body.page-template-user-dashboard-template .select2-container--default .select2-selection--single .select2-selection__arrow,
html body.page-template-user-dashboard-template .select2-container .select2-selection--single .select2-selection__arrow,
html body.page-template-user-dashboard-template .select2-selection__arrow,
html body.page-template-user-dashboard-template .select2-selection__arrow b,
html body.page-template-user-dashboard-template .jobsearch-profile-select::after,
html body.page-template-user-dashboard-template .jobsearch-profile-select::before,
html body.page-template-user-dashboard-template .select2-selection::after,
html body.page-template-user-dashboard-template .select2-selection::before {
  display: none !important;
  content: none !important;
}
html body.page-template-user-dashboard-template .select2-selection,
html body.page-template-user-dashboard-template .jobsearch-typo-wrap select,
html body.page-template-user-dashboard-template .user-dashboard-content select {
  background-image: none !important;
}

/* ===========================================================================
 * 67. FUSION "Informations administratives" -> "Identité"
 * Les champs admin sont deplaces en JS a la fin de la row de Identite (sous la
 * Presentation), et la section admin (videe) est masquee (.tp-sec--merged-away).
 * On passe la row de Identite en FLEX-WRAP : lignes propres quelle que soit la
 * hauteur des champs (multi-selects a puces) ET champs LARGES a 50% (le flux
 * flex conserve la largeur, contrairement a la grille qui les rendait etroits).
 * --------------------------------------------------------------------------- */
.tp-sec--merged-away {
  display: none !important;
}
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 22px 28px !important;
}
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row::before,
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row::after {
  display: none !important;
  content: none !important;
}
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row > li {
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
}
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row > li.jobsearch-column-6 {
  flex: 0 0 calc(50% - 14px) !important;
  max-width: calc(50% - 14px) !important;
}
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row > li.jobsearch-column-12 {
  flex: 0 0 100% !important;
  max-width: 100% !important;
}
/* Les champs remplissent toute la largeur de leur colonne */
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row > li input,
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row > li textarea,
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row > li .jobsearch-profile-select,
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row > li .select2,
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row > li .select2-container {
  width: 100% !important;
  max-width: none !important;
}

/* --- Hauteur UNIFORME de tous les champs (single select2 = multi = inputs) ---
 * Les selects simples (Profil, Etudes, Diplome) et les inputs (dates...) etaient
 * plus courts que les multi-selects a puces (Mobilite, Domaine...). On aligne
 * tout sur une meme hauteur mini de 50px, centre verticalement. Un multi avec
 * PLUSIEURS puces peut grandir (normal), mais avec 1 puce il matche les autres. */
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row .select2-container .select2-selection--single,
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row .select2-container .select2-selection--multiple {
  min-height: 50px !important;
  height: auto !important;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
  align-items: center !important;
}
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row .select2-selection--single .select2-selection__rendered {
  line-height: 1.4 !important;
}
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row input[type="text"],
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row input[type="email"],
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row input[type="tel"],
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row input[type="url"],
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row input[type="number"],
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row input[type="date"],
html body.page-template-user-dashboard-template .tp-sec--identite ul.jobsearch-row input:not([type]) {
  height: 50px !important;
}


/* ===========================================================================
 * 68. LISTINGS (Offres / Recruteurs) : tris + filtres au style Ta'iara
 * Scope : conteneurs propres aux pages de listing (.jobsearch-sort-section,
 * .jobsearch-filter-sortable, .listin-filters-sidebar) pour ne pas toucher les
 * autres Select2 du front (barre de recherche, etc.).
 * --------------------------------------------------------------------------- */

/* --- 68.1 TRIS : Select2 "Les plus recents" / "Par page" ------------------- */
.jobsearch-filter-sortable .jobsearch-filterable-select {
  position: relative;
}
.jobsearch-filter-sortable .select2-container {
  width: auto !important;
  min-width: 180px !important;
}
.jobsearch-filter-sortable .select2-container--default .select2-selection--single,
.jobsearch-sort-section .select2-container--default .select2-selection--single {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 10px !important;
  height: 44px !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14px !important;
  color: var(--tp-navy) !important;
}
.jobsearch-filter-sortable .select2-container--default .select2-selection--single .select2-selection__rendered,
.jobsearch-sort-section .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--tp-navy) !important;
  font-weight: 600 !important;
  line-height: 42px !important;
  padding: 0 !important;
}
/* ZERO chevron sur les tris : on masque TOUTES les fleches (plugin + select2).
 * Sources reelles : .jobsearch-sort-section .select2-selection::after (plugin)
 * et .jobsearch-filterable-select::after. */
.jobsearch-filter-sortable .select2-selection__arrow,
.jobsearch-sort-section .select2-selection__arrow,
.jobsearch-sort-section .select2-container .select2-selection::after,
.jobsearch-sort-section .select2-container .select2-selection::before,
.jobsearch-filter-sortable .jobsearch-filterable-select::after,
.jobsearch-filter-sortable .jobsearch-filterable-select::before,
.jobsearch-sort-section .jobsearch-filterable-select::after,
.jobsearch-sort-section .jobsearch-filterable-select::before {
  display: none !important;
  content: none !important;
}
/* L'icone "tri" a gauche du plugin : discrete */
.jobsearch-sort-section .jobsearch-icon.jobsearch-sort {
  color: var(--tp-text-muted) !important;
}

/* --- 68.2 FILTRES : accordeons de la colonne de gauche --------------------- */
.listin-filters-sidebar .jobsearch-search-filter-wrap {
  background: #fff !important;
  border: 1px solid var(--tp-border) !important;
  border-radius: 14px !important;
  margin-bottom: 14px !important;
  padding: 0 !important;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(10, 31, 68, 0.04);
}
/* Titre / bouton d'accordeon */
.listin-filters-sidebar .jobsearch-fltbox-title {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}
.listin-filters-sidebar .jobsearch-fltbox-title .jobsearch-click-btn {
  position: relative;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 15px 18px !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-weight: 600 !important;
  font-size: 14.5px !important;
  color: var(--tp-navy) !important;
  text-decoration: none !important;
  cursor: pointer;
}
/* ZERO chevron sur les accordeons : la fleche du plugin est dessinee via
 * .jobsearch-fltbox-title a::before -> on la masque, et toute autre. */
.listin-filters-sidebar .jobsearch-fltbox-title .jobsearch-click-btn::before,
.listin-filters-sidebar .jobsearch-fltbox-title .jobsearch-click-btn::after,
.listin-filters-sidebar .jobsearch-fltbox-title .jobsearch-click-btn i,
.listin-filters-sidebar .jobsearch-fltbox-title::after,
.listin-filters-sidebar .jobsearch-fltbox-title::before {
  display: none !important;
  content: none !important;
}
/* Corps de l'accordeon */
.listin-filters-sidebar .jobsearch-checkbox-toggle {
  padding: 4px 18px 16px !important;
}
.listin-filters-sidebar ul.jobsearch-checkbox {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.listin-filters-sidebar ul.jobsearch-checkbox > li {
  margin: 0 0 4px !important;
  padding: 0 !important;
}
.listin-filters-sidebar ul.jobsearch-checkbox label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 8px !important;
  border-radius: 8px !important;
  font-size: 13.5px !important;
  color: var(--tp-navy) !important;
  cursor: pointer;
  transition: background-color 0.12s ease;
}
.listin-filters-sidebar ul.jobsearch-checkbox label:hover {
  background: var(--tp-bg-soft) !important;
}
.listin-filters-sidebar .filter-post-count {
  margin-left: auto !important;
  background: var(--tp-bg-soft) !important;
  color: var(--tp-text-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 1px 8px !important;
  border-radius: 999px !important;
  min-width: 22px;
  text-align: center;
}


/* ===========================================================================
 * 69. SIDEBAR DASHBOARD : masque le bloc "completez votre profil" (%)
 * .required-skills-detail = encart "X% de plus pour votre profil..." sous
 * l'avatar. Retire sur demande.
 * --------------------------------------------------------------------------- */
.page-template-user-dashboard-template .required-skills-detail,
.jobsearch-employer-dashboard-nav .required-skills-detail {
  display: none !important;
}


/* ===========================================================================
 * 70. DASHBOARD : RAIL D'ICONES FACON TA'IARA GATE
 * Le menu lateral devient un rail d'icones fin, fixe a gauche, DEMARRANT SOUS
 * le header (qui reste pleine largeur avec son logo). Au survol, le rail
 * s'elargit en douceur et devoile les libelles PAR-DESSUS le contenu (overlay),
 * puis se recontracte. Aucun bouton toggle (donc plus de "bandeau bleu").
 * Un espace est reserve en bas pour ne pas gener le bouton cookies flottant.
 * Actif en desktop (>=1025px) ; en dessous -> panneau empile classique (§22/§23).
 * --------------------------------------------------------------------------- */

@media (min-width: 1025px) {

  /* 70.1 CONTENU : reserve la gouttiere gauche (largeur du rail au repos). */
  body.page-template-user-dashboard-template .jobsearch-plugin-default-container {
    padding-left: 68px !important;
  }
  body.page-template-user-dashboard-template .jobsearch-column-9 {
    width: 100% !important;
    max-width: none !important;
    flex: 1 1 auto !important;
    padding-left: 40px !important;
  }

  /* 70.2 RAIL : fixe, sous le header. On ANCRE le haut du rail a 76px (hauteur du
     header) au lieu de top:0 + padding-top:76 : ainsi une petite variation de
     hauteur du header entre navigateurs (Safari vs Chromium) ne rogne plus le
     premier icone. z-index < header (50). */
  /* Rail SOMBRE facon Ta'iara Gate. La section 7 peint le nav ET le <ul> du menu
     en BLANC ; ce blanc se superposait et masquait le navy. Strategie blindee :
     on peint le navy sur l'aside ET le nav, et on force TOUTES les couches
     internes (ul, wrappers, enfants directs du nav) en transparent -> le navy
     ressort partout et les icones claires redeviennent visibles. */
  body.page-template-user-dashboard-template aside.jobsearch-column-3,
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-employer-dashboard-nav,
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .dashboard-side-nav {
    background: #fff !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 {
    position: fixed !important;
    top: 0 !important;              /* le rail monte jusqu'en haut... */
    left: 0 !important;
    height: 100vh !important;       /* ...pleine hauteur, il passe DERRIERE le header */
    width: 68px !important;
    max-width: 68px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-right: 1px solid var(--tp-border) !important;
    border-radius: 0 !important;
    overflow: visible !important;
    z-index: 40 !important; /* sous le header (100) : le haut du rail passe derriere */
    transition: width 0.2s ease !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-employer-dashboard-nav {
    height: 100% !important;
    width: 100% !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    /* padding-haut = hauteur du header (fallback ; le JS pose la valeur exacte
       = bas du header + 6 en inline). Le rail passe DERRIERE le header opaque, donc
       tout residu au-dessus des icones est cache. */
    padding: calc(var(--tp-header-h, 76px) + 8px) 12px 72px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    transition: box-shadow 0.2s ease !important;
  }
  /* Toutes les couches internes -> transparentes (sinon le blanc de la section 7
     recouvre le navy). On cible aussi les enfants directs du nav et tout <ul>. */
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-employer-dashboard-nav > *,
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-dashboard-menu-list,
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-dashboard-menu,
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-typo-wrap,
  body.page-template-user-dashboard-template aside.jobsearch-column-3 ul {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  /* 70.2-bis ANTI-VIDE EN HAUT DU RAIL. DOM reel : aside > div.jobsearch-typo-wrap
     > div.jobsearch-employer-dashboard-nav (flex). On fait remplir le wrapper
     intermediaire sans marge/padding, on force le menu en HAUT (flex-start, sans
     centrage ni gap) et on annule toute marge/padding du <ul> -> le 1er item
     colle pile sous le header (plus de bande vide). */
  body.page-template-user-dashboard-template aside.jobsearch-column-3 > .jobsearch-typo-wrap {
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-employer-dashboard-nav {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 0 !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-employer-dashboard-nav > ul,
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-dashboard-menu-list {
    margin: 0 !important;
    padding: 0 !important;
  }
  /* DOM reel : le menu desktop est dans .jobsearch-desktop-dashmenu (enfant du
     nav), PAS un <ul> direct -> c'est SON padding/marge qui creait la bande vide
     en haut. On le zero-ise. Et le nav embarque aussi un bouton + un menu MOBILE
     qu'on masque en desktop. */
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-desktop-dashmenu {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    background: transparent !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-desktop-dashmenu > ul {
    margin: 0 !important;
    padding: 0 !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-dashbord-menubtn,
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .jobsearch-dashbord-mobilemenu {
    display: none !important;
  }

  /* 70.2-ter BLOC LOGO (coin haut-gauche du rail, injecte par JS). Meme hauteur
     que le header -> la ligne du haut (logo | header) est continue. Repos (rail
     68px) = marque seule centree ; survol = marque + texte. */
  /* Le logo du rail (shell en L) n'est plus utilise : le logo est revenu dans le
     header pleine largeur. On masque le bloc au cas ou le JS l'injecte encore. */
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .tp-sidebar-brand {
    display: none !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .tp-sidebar-brand__logo {
    width: 40px !important;
    height: 40px !important;
    flex-shrink: 0 !important;
    object-fit: contain !important;
    image-rendering: -webkit-optimize-contrast !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .tp-sidebar-brand__text {
    display: none !important;
    flex-direction: column !important;
    line-height: 1 !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .tp-sidebar-brand__name {
    font-size: 1.05rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.4px !important;
    color: var(--tp-navy) !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 .tp-sidebar-brand__tag {
    margin-top: 3px !important;
    font-size: 0.56rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    color: var(--tp-accent-deep) !important;
  }
  /* Survol : le rail s'elargit -> on affiche la marque + le texte, aligne a gauche. */
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover .tp-sidebar-brand {
    justify-content: flex-start !important;
    padding-left: 16px !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover .tp-sidebar-brand__text {
    display: flex !important;
  }

  /* 70.3 ELEMENTS NON-NAV masques dans le rail (avatar, nom, upload, sous-titre) :
     le rail est purement navigation, facon Gate. */
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > figure,
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .user_img_skillid,
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-saved-img-holder,
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-fileUpload,
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav > h2,
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav .jobsearch-dashboard-subtitle {
    display: none !important;
  }

  /* 70.4 MENU au repos : chaque item = un bouton carre 44x44 centre, icone seule.
     Rythme vertical regulier, angles arrondis, aucun "rectangle plein". */
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul {
    margin: 0 !important;
    padding: 0 !important;
  }
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li {
    margin: 0 !important;
    list-style: none !important;
  }
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    margin: 4px auto !important;
    padding: 0 !important;
    border-radius: 12px !important;
    font-size: 0 !important;
    gap: 0 !important;
    color: var(--tp-navy) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
  }
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a i {
    font-size: 17px !important;
    font-weight: normal !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    line-height: 1 !important;
    color: inherit !important;
    -webkit-font-smoothing: antialiased !important; /* trait plus fin (moins gras) */
    -moz-osx-font-smoothing: grayscale !important;
  }
  /* Onglet actif : chip carre arrondi navy plein, icone blanche (raccord bouton "Mon espace"). */
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.current-menu-item > a,
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.active > a,
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.jobsearch-current-tab > a {
    background: var(--tp-navy) !important;
    color: #fff !important;
  }
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.current-menu-item > a i,
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.active > a i,
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li.jobsearch-current-tab > a i {
    color: #fff !important;
  }
  /* Rail sombre : separateur discret ; "Supprimer le compte" (sans icone) est
     cache au repos (sinon chip vide) et revele en mode deplie. */
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li:last-child {
    border-top-color: var(--tp-border) !important;
  }
  body.page-template-user-dashboard-template .jobsearch-employer-dashboard-nav ul li a[href*="delete"] {
    display: none !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover ul li a[href*="delete"] {
    display: flex !important;
  }

  /* 70.5 SURVOL : le rail s'elargit, ombre portee, libelles reveles (overlay).
     Chaque item redevient une pilule pleine largeur ; libelles longs sur 1 ligne. */
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover {
    width: 288px !important;
    max-width: 288px !important;
    z-index: 45 !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover .jobsearch-employer-dashboard-nav {
    box-shadow: 12px 0 40px rgba(10, 31, 68, 0.12) !important;
  }
  /* On garde EXACTEMENT la meme hauteur (44px) et la meme marge verticale (4px)
     qu'au repos : seule la largeur/l'alignement change -> aucun saut vertical. */
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover ul li a {
    width: auto !important;
    height: 44px !important;
    margin: 4px 8px !important;
    padding: 0 14px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover ul li a i {
    font-size: 17px !important;
    width: 22px !important;
    text-align: center !important;
    line-height: 1 !important;
  }
  /* Hover discret sur les items non-actifs (mode deplie) : voile blanc leger. */
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover ul li:not(.current-menu-item):not(.active):not(.jobsearch-current-tab) > a:hover {
    background: var(--tp-bg-soft) !important;
    color: var(--tp-navy) !important;
  }

  /* 70.7 CATEGORIES (titres de groupe injectes par JS). Hauteur FIXE (26px) et
     memes marges verticales au repos et au survol -> aucun saut vertical. Au
     repos : un fin trait separateur (::before). Au survol : le libelle gris. */
  body.page-template-user-dashboard-template aside.jobsearch-column-3 ul li.tp-nav-cat {
    display: flex !important;
    align-items: center !important;
    min-height: 26px !important;
    margin: 6px 12px 2px !important;
    padding: 0 !important;
    list-style: none !important;
    background: transparent !important;
    border: none !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 ul li.tp-nav-cat::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 1px !important;
    background: var(--tp-border) !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3 ul li.tp-nav-cat .tp-nav-cat__label {
    display: none !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover ul li.tp-nav-cat {
    margin: 6px 16px 2px !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover ul li.tp-nav-cat::before {
    display: none !important;
  }
  body.page-template-user-dashboard-template aside.jobsearch-column-3:hover ul li.tp-nav-cat .tp-nav-cat__label {
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--tp-text-faint, #6b7790) !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
  }

  /* 70.6 BARRE D'ADMIN WP (admins connectes) : le header est decale de 32px,
     donc le rail est ancre 32px plus bas (76 + 32 = 108). */
  body.admin-bar.page-template-user-dashboard-template aside.jobsearch-column-3 {
    top: 0 !important;
    height: 100vh !important;
  }
  /* Barre d'admin : le padding-haut du rail est pose par le JS (bottom du header,
     barre incluse), donc rien de special ici. */
}

/* 70.8 CATEGORIES — style de base (mobile / menu empile) : petit entete gris.
   En desktop, la section 70.7 le transforme en separateur/libelle du rail. */
.jobsearch-employer-dashboard-nav ul li.tp-nav-cat {
  list-style: none !important;
  margin: 14px 8px 4px !important;
  padding: 0 6px !important;
}
.jobsearch-employer-dashboard-nav ul li.tp-nav-cat .tp-nav-cat__label {
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--tp-text-faint, #6b7790) !important;
}

/* ===========================================================================
 * 71. DASHBOARD : PAS DE FOOTER (effet application)
 * Le gros footer marketing n'a pas sa place dans l'espace connecte "app" ; il
 * casse l'effet application avec le rail plein-hauteur. On masque le wrapper
 * #careerfy-footer UNIQUEMENT sur la page tableau de bord ; les pages publiques
 * gardent leur footer complet. La bottom-nav mobile (injectee hors
 * #careerfy-footer via wp_footer) n'est pas affectee.
 * --------------------------------------------------------------------------- */
body.page-template-user-dashboard-template #careerfy-footer {
  display: none !important;
}

/* ===========================================================================
 * 72. DASHBOARD : HEADER FIGE EN HAUT (plus d'espace vide au-dessus du rail)
 * Le rail lateral est fixe (top: 76px). Si le header horizontal defile au
 * scroll, un vide (fond de page) apparait au-dessus du rail. On FIGE donc le
 * header en haut sur le dashboard (desktop) : il reste toujours colle au sommet
 * du rail -> aucun vide, comportement "app shell". On compense sa hauteur par un
 * padding-top sur le conteneur de contenu. Desktop uniquement (>=1025px) ; en
 * mobile le rail n'est pas fixe, donc pas de probleme.
 * --------------------------------------------------------------------------- */
@media (min-width: 1025px) {
  /* Header PLEINE LARGEUR fige en haut (logo dedans), rail EN DESSOUS, facon
     Ta'iara Gate. IMPORTANT : on fige .tpa-header (le VRAI header visible), car
     #careerfy-header est en display:contents (body.tpa-active) -> boite absente,
     le figer/mesurer ne servait a RIEN. z-index au-dessus du rail ; opaque pour
     cacher le haut du rail qui passe derriere. */
  body.page-template-user-dashboard-template .tpa-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 100 !important;
    background: #fff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  body.admin-bar.page-template-user-dashboard-template .tpa-header {
    top: 32px !important;
  }
  /* Le contenu demarre sous le header fige (76px) + respiration (20px). On rejoue
     EXACTEMENT le selecteur (2,3,2) de la source de verite (style.css) pour
     l'emporter ; charge apres style.css, donc gagne a specificite egale. */
  html body.page-template-user-dashboard-template .careerfy-wrapper > .jobsearch-main-content:not(#careerfy-header):not(#careerfy-footer) {
    padding-top: calc(var(--tp-header-h, 76px) + 10px) !important;
  }
  html body.admin-bar.page-template-user-dashboard-template .careerfy-wrapper > .jobsearch-main-content:not(#careerfy-header):not(#careerfy-footer) {
    padding-top: calc(var(--tp-header-h, 76px) + 10px) !important; /* var = bas du header, barre admin incluse */
  }
}


/* NB : l'idee "header fige sur TOUTES les pages connectees" (ancienne §73) a ete
 * retiree : sur les pages Elementor le position:fixed ne prenait pas mais le
 * padding de compensation si -> le header etait pousse vers le bas (bande vide).
 * Le header fige reste donc limite au dashboard (§72), qui fonctionne. */


/* NB : le header figé/sticky est volontairement limité au DASHBOARD (§72). Sur
 * les autres pages (connecté ou non), le header garde son comportement normal.
 * (Ancienne §73 "sticky partout en connecté" retiree a la demande.) */

/* ===========================================================================
 * 74. HEADER : NAV ALIGNEE A GAUCHE (cluster logo + nav a gauche, actions a
 * droite), facon Ta'iara Gate, au lieu de la nav centree qui flotte au milieu.
 * S'applique partout (public + connecte) pour rester coherent.
 * --------------------------------------------------------------------------- */
.tpa-header__nav {
  justify-content: flex-start !important;
}

/* ===========================================================================
 * 75. ICONES SVG (LUCIDE) DU RAIL — injectees par JS (.tp-rail-svg > svg).
 * Trait fin, viewBox carre -> centrage parfait (fini les soucis Safari). La
 * couleur suit le texte du lien (navy au repos, blanc sur l'onglet actif) via
 * stroke:currentColor.
 * --------------------------------------------------------------------------- */
body.page-template-user-dashboard-template aside.jobsearch-column-3 .tp-rail-svg {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  line-height: 0 !important;
  color: inherit !important;
}
body.page-template-user-dashboard-template aside.jobsearch-column-3 .tp-rail-svg svg {
  width: 20px !important;
  height: 20px !important;
  display: block !important;
  stroke: currentColor !important;
}
body.page-template-user-dashboard-template aside.jobsearch-column-3:hover .tp-rail-svg svg {
  width: 19px !important;
  height: 19px !important;
}

/* ===========================================================================
 * 77. PHOTO DE PROFIL dans "Mon profil" (widget avatar deplace du rail par JS,
 * cf. relocateAvatarToProfile). Le rail restant purement navigation, la gestion
 * de la photo se fait ici, en tete du formulaire Mon profil.
 * --------------------------------------------------------------------------- */
/* Bloc photo SANS carte imbriquee : il est deja dans la carte de section
 * "Mon profil" -> une 2e bordure faisait "boite dans une boite". On le laisse
 * a plat, separe des champs par un simple filet bas. */
.page-template-user-dashboard-template .tp-profile-avatar {
  margin: 0 0 24px !important;
  padding: 0 0 22px !important;
  background: none !important;
  border: none !important;
  border-bottom: 1px solid var(--tp-border) !important;
  border-radius: 0 !important;
}
.page-template-user-dashboard-template .tp-profile-avatar__label {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--tp-navy) !important;
  margin-bottom: 14px !important;
}
/* Interrupteur "En recherche de stage" placé DANS le titre "Mon profil".
 * Le titre est en flex space-between -> l'interrupteur s'aligne proprement à
 * DROITE, centré verticalement avec le titre. */
.page-template-user-dashboard-template .jobsearch-profile-title.tp-title--with-seeking {
  gap: 16px !important;
  flex-wrap: wrap !important;
}
.page-template-user-dashboard-template .jobsearch-profile-title .tp-seeking-field {
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  float: none !important;
  flex: 0 0 auto !important;
}
.page-template-user-dashboard-template .jobsearch-profile-title .tp-seeking-note {
  display: none !important;
}
/* Pastille (chip) : libellé À GAUCHE, interrupteur À DROITE, teintée si actif. */
.page-template-user-dashboard-template .jobsearch-profile-title .tp-seeking-switch {
  display: inline-flex !important;
  align-items: center !important;
  gap: 11px !important;
  background: var(--tp-bg-soft, #f6f7f9) !important;
  border: 1px solid var(--tp-border, #e6e3da) !important;
  border-radius: 999px !important;
  padding: 7px 9px 7px 16px !important;
  box-shadow: 0 1px 2px rgba(10, 31, 68, 0.04) !important;
  transition: background 0.18s ease, border-color 0.18s ease !important;
}
.page-template-user-dashboard-template .jobsearch-profile-title .tp-seeking-switch:has(input:checked) {
  background: rgba(46, 166, 160, 0.1) !important;
  border-color: rgba(46, 166, 160, 0.45) !important;
}
.page-template-user-dashboard-template .jobsearch-profile-title .tp-seeking-label {
  order: -1 !important;             /* libellé AVANT l'interrupteur */
  font-size: 13.5px !important;
  white-space: nowrap !important;
  font-weight: 600 !important;
  color: var(--tp-navy, #16315c) !important;
}
/* Track dimensionné explicitement (sinon le span se collapse). */
.page-template-user-dashboard-template .jobsearch-profile-title .tp-seeking-track {
  flex: 0 0 auto !important;
  width: 44px !important;
  height: 24px !important;
}
.page-template-user-dashboard-template .jobsearch-profile-title .tp-seeking-knob {
  width: 18px !important;
  height: 18px !important;
  top: 3px !important;
  left: 3px !important;
}
.page-template-user-dashboard-template .jobsearch-profile-title .tp-seeking-switch input:checked + .tp-seeking-track .tp-seeking-knob {
  left: 23px !important;
}
/* La <figure> native : ligne avatar + bouton, styles du rail annules. */
.page-template-user-dashboard-template .tp-profile-avatar .user_img_skillid,
.page-template-user-dashboard-template .tp-profile-avatar > figure {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  text-align: left !important;
}
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-saved-img-holder {
  position: relative !important;
  width: 92px !important;
  height: 92px !important;
  margin: 0 !important;
  border-radius: 50% !important;
  /* overflow VISIBLE : le rond est clippe par le lien image / #circle (a
   * l'interieur) ; on evite ainsi de rogner le bouton supprimer qui deborde. */
  overflow: visible !important;
  cursor: pointer !important;
  background: var(--tp-bg-soft) !important;
  border: 3px solid #fff !important;
  box-shadow: 0 3px 12px rgba(10, 31, 68, 0.12) !important;
  flex-shrink: 0 !important;
  display: block !important;
}
/* Overlay "Changer" au survol : l'image sert de bouton d'upload (le gros bouton
 * bleu est masque, cf. plus bas). pointer-events:none pour ne pas bloquer le
 * clic ; le bouton supprimer (z-index 3) reste au-dessus et cliquable. */
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-saved-img-holder::after {
  content: "Changer" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: rgba(10, 31, 68, 0.5) !important;
  color: #fff !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  opacity: 0 !important;
  transition: opacity 0.15s ease !important;
  pointer-events: none !important;
}
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-saved-img-holder:hover::after {
  opacity: 1 !important;
}
/* #circle + le lien image (PAS le bouton supprimer .user-dashthumb-remove !) :
 * on les cale sur tout le cadre rond. */
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-saved-img-holder #circle,
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-saved-img-holder > a.employer-dashboard-thumb {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 50% !important;
  display: block !important;
}
/* L'<img> reçoit du plugin un <style> inline `#circle img { position:absolute;
 * left:9px; top:9px }` (décalage Jcrop) -> l'image sort du centre. On la force à
 * remplir EXACTEMENT le cadre (inset 0) et à couvrir/centrer. */
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-saved-img-holder #circle img,
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-saved-img-holder img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 50% !important;
  margin: 0 !important;
  display: block !important;
}
.page-template-user-dashboard-template .tp-profile-avatar .user-dashthumb-remove {
  position: absolute !important;
  top: -2px !important;
  right: -2px !important;
  width: 24px !important;
  height: 24px !important;
  background: var(--tp-danger) !important;
  color: #fff !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10px !important;
  z-index: 3 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18) !important;
}
.page-template-user-dashboard-template .tp-profile-avatar figcaption {
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
}
/* Bouton "Changer la photo" MASQUE : l'upload se declenche desormais au clic
 * sur l'image (cf. JS relocateAvatarToProfile). L'<input type=file> interne
 * reste dans le DOM et declenchable via .click(). */
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-fileUpload {
  display: none !important;
}
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-fileUpload span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 9px 18px !important;
  background: #fff !important;
  color: var(--tp-navy) !important;
  border: 1.5px solid var(--tp-navy) !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.18s ease !important;
}
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-fileUpload:hover span {
  background: var(--tp-navy) !important;
  color: #fff !important;
}
.page-template-user-dashboard-template .tp-profile-avatar .jobsearch-fileUpload input[type="file"] {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  cursor: pointer !important;
}
.page-template-user-dashboard-template .tp-profile-avatar .fileUpLoader {
  display: inline-block !important;
  margin-left: 8px !important;
  color: var(--tp-navy) !important;
}

/* ===========================================================================
 * 90. STATUT « EN RECHERCHE DE STAGE » : interrupteur (Mon profil) + badge
 * (profil public, cartes candidat, et CV géré côté PDF).
 * --------------------------------------------------------------------------- */
/* -- Interrupteur (dans le formulaire Mon profil) -- */
.page-template-user-dashboard-template .tp-seeking-field {
  margin: 8px 0 6px !important;
}
.tp-seeking-switch {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  cursor: pointer !important;
  user-select: none !important;
}
.tp-seeking-switch input {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}
.tp-seeking-track {
  position: relative !important;
  flex: 0 0 auto !important;
  width: 46px !important;
  height: 26px !important;
  border-radius: 999px !important;
  background: var(--tp-border, #d9dce3) !important;
  transition: background 0.18s ease !important;
}
.tp-seeking-knob {
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) !important;
  transition: left 0.18s ease !important;
}
.tp-seeking-switch input:checked + .tp-seeking-track {
  background: var(--tp-accent, #2ea6a0) !important;
}
.tp-seeking-switch input:checked + .tp-seeking-track .tp-seeking-knob {
  left: 23px !important;
}
.tp-seeking-label {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  color: var(--tp-navy, #16315c) !important;
}
.tp-seeking-note {
  font-size: 13px !important;
  color: var(--tp-text-muted, #7a8899) !important;
  margin: 8px 0 0 !important;
  line-height: 1.5 !important;
}

/* -- Badge (profil public + cartes ; portée globale) -- */
.tp-seeking-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(46, 166, 160, 0.12);
  color: var(--tp-accent-deep, #0a6e63);
  font-family: "Poppins", "Inter", sans-serif;
  font-weight: 600;
  font-size: 12.5px;
  line-height: 1.2;
  border: 1px solid rgba(46, 166, 160, 0.28);
  white-space: nowrap;
  vertical-align: middle;
}
.tp-seeking-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--tp-accent, #2ea6a0);
  box-shadow: 0 0 0 3px rgba(46, 166, 160, 0.18);
}
.tp-seeking-badge--card {
  font-size: 11.5px;
  padding: 3px 9px;
}

/* =============================================================================
 * §91 — POPUP « Envoyer un message » (dashboard : profils enregistrés /
 * candidatures) harmonisée avec la popup de contact du profil public (.tp-modal).
 * Cible les modales #JobSearchModalSendEmail… + le form .jobsearch-send-message-form.
 * ========================================================================= */
[id^="JobSearchModalSendEmail"] .modal-box-area {
  width: 100% !important;
  max-width: 460px !important;
  background: #fff !important;
  border: none !important;
  border-radius: 20px !important;
  padding: 28px 28px 26px !important;
  box-shadow: 0 30px 60px -20px rgba(18, 37, 63, .5) !important;
}
[id^="JobSearchModalSendEmail"] .modal-close {
  top: 14px !important;
  right: 16px !important;
  color: var(--tp-navy-40, #9ba6b6) !important;
}
[id^="JobSearchModalSendEmail"] .modal-close:hover { color: var(--tp-navy, #16315c) !important; }

/* Titre (la modale native n'en a pas). */
.jobsearch-send-message-form::before {
  content: "Envoyer un message";
  display: block;
  font-family: "Poppins", "Inter", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--tp-navy, #16315c);
  margin: 0 0 18px;
}
.jobsearch-send-message-form .email-fields-list { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.jobsearch-send-message-form .email-fields-list > li { margin: 0 0 14px !important; padding: 0 !important; border: none !important; background: none !important; }
.jobsearch-send-message-form .email-fields-list > li::before,
.jobsearch-send-message-form .email-fields-list > li::marker { content: none !important; }
.jobsearch-send-message-form label {
  display: block !important;
  margin: 0 0 6px !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 11px !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--tp-navy-70, #6b7a90) !important;
  font-weight: 600 !important;
}
.jobsearch-send-message-form .input-field { margin: 0 !important; }
.jobsearch-send-message-form .input-field input[type="text"],
.jobsearch-send-message-form .input-field textarea {
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 11px 13px !important;
  border: 1px solid var(--tp-line, #e4e7ec) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--tp-navy, #16315c) !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 14px !important;
  box-shadow: none !important;
}
.jobsearch-send-message-form .input-field textarea { min-height: 110px !important; resize: vertical !important; }
.jobsearch-send-message-form .input-field input[type="text"]:focus,
.jobsearch-send-message-form .input-field textarea:focus {
  outline: none !important;
  border-color: var(--tp-accent, #2ea6a0) !important;
  box-shadow: 0 0 0 3px rgba(46, 166, 160, .15) !important;
}
.jobsearch-send-message-form .input-field-submit { margin-top: 4px !important; }
.jobsearch-send-message-form .applicantto-email-submit-btn {
  width: 100% !important;
  height: 48px !important;
  margin: 0 !important;
  border: none !important;
  border-radius: 14px !important;
  background: var(--tp-navy, #16315c) !important;
  color: #fff !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background .18s ease !important;
}
.jobsearch-send-message-form .applicantto-email-submit-btn:hover { background: var(--tp-accent, #2ea6a0) !important; }
.jobsearch-send-message-form .terms-priv-chek-con { margin: 12px 0 0 !important; }
.jobsearch-send-message-form .terms-priv-chek-con p {
  display: flex !important; align-items: flex-start !important; gap: 8px !important;
  margin: 0 !important; font-size: 12px !important; line-height: 1.5 !important;
  color: var(--tp-navy-70, #6b7a90) !important;
}

/* =============================================================================
 * §92 — PROFILS ENREGISTRÉS (dashboard recruteur) : on masque les boutons
 * d'en-tête « Liste des candidats » et « Paramètres », et la carte remplace
 * « Message » par « Télécharger le CV » (injection JS -> .tp-dl-cv).
 * ========================================================================= */
.savcands-list-tobtn,
.savcands-setings-tobtn,   /* coquille du plugin : un seul « t » */
.savcands-settings-tobtn { display: none !important; }
/* Filet de sécurité : TOUS les boutons-toggle de l'en-tête de l'onglet
   « profils enregistrés », quelle que soit leur classe exacte. */
#dashboard-tab-resumes .jobsearch-profile-title a.dash-hdtabchng-btn { display: none !important; }

/* Le lien injecté hérite du style natif des options ; on force juste l'icône
   en accent et un survol propre. */
.jobsearch-resumes-options .tp-dl-cv i { color: var(--tp-accent, #2ea6a0) !important; }

/* « Télécharger le CV » natif (dans le nom) masqué en CSS aussi (robuste, sans
   dépendre du JS) : on ne garde que notre bouton « CV » du bas. */
#dashboard-tab-resumes .jobsearch-resumes-download { display: none !important; }

/* ---- Cartes COMPACTES (grille 2-3 par ligne) + secteur + badge ---- */
#dashboard-tab-resumes li.jobsearch-column-6 {
  width: 340px !important;
  max-width: 100% !important;
  display: inline-block !important;
  vertical-align: top !important;
  float: none !important;
  margin: 0 14px 14px 0 !important;
  padding: 0 !important;
}
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap {
  position: relative !important;
  height: 100% !important;
  padding: 16px !important;
  border-radius: 14px !important;
}
/* Pas de coupure en plein mot (« Développemen|t »). */
#dashboard-tab-resumes .jobsearch-pst-title,
#dashboard-tab-resumes .jobsearch-pst-title a,
#dashboard-tab-resumes .tp-savcard-sector {
  word-break: normal !important;
  overflow-wrap: break-word !important;
}
/* Bouton × discret (au lieu du gros carré rouge). */
#dashboard-tab-resumes .jobsearch-rem-empresmue {
  top: 10px !important;
  right: 10px !important;
  width: 24px !important;
  height: 24px !important;
  line-height: 24px !important;
  border-radius: 50% !important;
  background: #f1f3f6 !important;
  color: var(--tp-navy-70, #6b7a90) !important;
  font-size: 12px !important;
  text-align: center !important;
}
#dashboard-tab-resumes .jobsearch-rem-empresmue:hover { background: #ffe3e3 !important; color: #d33 !important; }
/* Avatar + nom sur une ligne, alignés en haut, avatar réduit. */
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap figure {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin: 0 0 12px !important;
  padding-right: 28px !important; /* place pour le × */
}
#dashboard-tab-resumes .jobsearch-resumes-thumb img,
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap figure img {
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}
#dashboard-tab-resumes .jobsearch-resumes-thumb {
  flex: 0 0 auto !important;
  width: 46px !important;
  margin: -2px 0 0 !important; /* remonte l'avatar pour s'aligner sur la 1re ligne du nom */
}
/* Nom sans marge parasite (aligne son sommet sur celui de l'avatar). */
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap figcaption .jobsearch-pst-title { margin-top: 0 !important; padding-top: 0 !important; }
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap figcaption { flex: 1 1 auto !important; min-width: 0 !important; }
#dashboard-tab-resumes .jobsearch-pst-title {
  font-size: 15px !important;
  line-height: 1.3 !important;
  margin: 0 !important;
}
/* On masque les infos natives lourdes (localisation/salaire) : on garde
   secteur + badge injectés. */
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap figcaption > ul { display: none !important; }

/* Secteur injecté (span .tp-savcard-meta dans le h2). */
.tp-savcard-meta {
  display: block !important;
  margin-top: 6px !important;
  font-weight: 400 !important;
}
.tp-savcard-sector {
  display: -webkit-box !important;
  width: 100% !important; /* sinon -webkit-box collapse à 0 de large (invisible) */
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 12px !important;
  color: #3f4f66 !important; /* foncé d'un cran pour la lisibilité */
  line-height: 1.35 !important;
}
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap > .tp-savcard-meta { width: 100% !important; }
/* Secteur déplacé (JS) en LIGNE PLEINE LARGEUR sous l'avatar+nom (enfant direct
   de la carte, avant les boutons). */
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap > .tp-savcard-meta {
  margin: 2px 0 0 !important;
}
/* Avatar+nom un peu plus resserrés maintenant que le secteur est en dessous. */
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap figure { margin-bottom: 10px !important; }

/* Nom : clamp 2 lignes + « … » (gère les prénoms/noms à rallonge).
   IMPORTANT : exclure le lien de téléchargement natif (lui aussi > a du h2),
   sinon ce clamp le force en display:-webkit-box et ANNULE son display:none. */
#dashboard-tab-resumes .jobsearch-pst-title > a:not(.jobsearch-resumes-download):not(.jobsearch-candidate-download-btn) {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
/* Hover de carte : léger relief + bordure accent. */
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap {
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}
#dashboard-tab-resumes .jobsearch-employer-resumes-wrap:hover {
  border-color: var(--tp-accent, #2ea6a0) !important;
  box-shadow: 0 10px 24px -14px rgba(18, 37, 63, .28) !important;
  transform: translateY(-2px) !important;
}

/* Actions : « CV » principal (navy), « Profil » secondaire. */
#dashboard-tab-resumes .jobsearch-resumes-options {
  display: flex !important;
  gap: 8px !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid var(--tp-line, #e4e7ec) !important;
}
#dashboard-tab-resumes .jobsearch-resumes-options > li {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
#dashboard-tab-resumes .jobsearch-resumes-options > li a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  float: none !important;
  padding: 9px 8px !important;
  border: 1px solid var(--tp-line, #e4e7ec) !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: var(--tp-navy, #16315c) !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  transition: border-color .15s ease, color .15s ease, background .15s ease !important;
}
/* Boutons sans icône : libellé seul (« CV » / « Profil »). */
#dashboard-tab-resumes .jobsearch-resumes-options > li a i { display: none !important; }
/* « CV » = action principale (navy -> turquoise au survol). */
#dashboard-tab-resumes .jobsearch-resumes-options > li a.tp-dl-cv {
  background: var(--tp-navy, #16315c) !important;
  border-color: var(--tp-navy, #16315c) !important;
  color: #fff !important;
}
#dashboard-tab-resumes .jobsearch-resumes-options > li a.tp-dl-cv i { color: #fff !important; }
#dashboard-tab-resumes .jobsearch-resumes-options > li a.tp-dl-cv:hover {
  background: var(--tp-accent, #2ea6a0) !important;
  border-color: var(--tp-accent, #2ea6a0) !important;
}
/* « Profil » = secondaire (contour -> accent au survol). */
#dashboard-tab-resumes .jobsearch-resumes-options > li a:not(.tp-dl-cv):hover {
  border-color: var(--tp-accent, #2ea6a0) !important;
  color: var(--tp-accent, #2ea6a0) !important;
}

/* ===========================================================================
 * 93. ATOUTS SUGGÉRÉS — formulaire de PUBLICATION D'OFFRE (recruteur).
 * HTML reconstruit par inc/taiara-suggested-atouts.php (filtre
 * jobsearch_post_job_sugg_skills_html) + réactivité JS (jobsearch-taiara.js).
 * Deux groupes : .taiara-jsug-primary-group (« Suggérés pour ce secteur »,
 * accent) et .taiara-jsug-rest-group (« Tous les atouts / Autres atouts »).
 * Réutilise la base .taiara-suggs (taiara-cv-editor.css) ; ici on donne aux
 * pastilles un vrai look « chip » et on distingue le groupe suggéré.
 * --------------------------------------------------------------------------- */
.taiara-job-suggs .skills-cloud {
  float: none !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 12px !important;
  border: 1px solid var(--tp-line, #e4e7ec) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--tp-navy, #16315c) !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  cursor: pointer !important;
  transition: border-color .15s ease, color .15s ease, background .15s ease !important;
}
.taiara-job-suggs .skills-cloud::before {
  content: "+" !important;
  margin-right: 6px !important;
  font-weight: 700 !important;
  color: var(--tp-accent, #2ea6a0) !important;
}
.taiara-job-suggs .skills-cloud:hover {
  border-color: var(--tp-accent, #2ea6a0) !important;
  color: var(--tp-accent, #2ea6a0) !important;
  background: rgba(46, 166, 160, 0.06) !important;
}
/* Groupe « suggérés pour ce secteur » : accent plus marqué. */
.taiara-job-suggs .taiara-jsug-primary .skills-cloud {
  border-color: var(--tp-accent, #2ea6a0) !important;
  background: rgba(46, 166, 160, 0.08) !important;
}
.taiara-job-suggs .taiara-jsug-primary .skills-cloud:hover {
  background: var(--tp-accent, #2ea6a0) !important;
  color: #fff !important;
}
.taiara-job-suggs .taiara-jsug-primary .skills-cloud:hover::before {
  color: #fff !important;
}

/* ===========================================================================
 * 94. SELECT2 SINGLE (Catégorie d'offre, Durée du stage, Commune) — valeur en
 * « bulle » comme les champs multi (Secteur, Profil, Études…). Ces champs
 * .jobsearch-profile-select rendaient leur valeur en texte simple ; on la met
 * dans une pastille identique à .select2-selection__choice, et on harmonise la
 * hauteur (46px, centrée). La pastille ne s'affiche QUE si une valeur est
 * choisie : le rendu n'est ni vide, ni un placeholder. (On NE se base PAS sur
 * la présence du « × » de nettoyage : les champs requis n'en ont pas, et sur
 * certains champs le « × » est rendu À CÔTÉ du bloc valeur, pas dedans.)
 * --------------------------------------------------------------------------- */
/* Hauteur fixe pour les SINGLE : une seule valeur ou un placeholder, jamais de
 * retour à la ligne -> on fige à 46px (comme les autres champs). Sinon, à vide,
 * le placeholder faisait grandir le conteneur (height:auto) et le champ était
 * plus haut que « Secteur professionnel » & co. */
.jobsearch-profile-select .select2-container .select2-selection--single {
  height: 46px !important;
  min-height: 46px !important;
  flex-wrap: nowrap !important;
  overflow: hidden !important;
}

.jobsearch-profile-select .select2-selection--single .select2-selection__rendered:not(:empty):not(:has(.select2-selection__placeholder)) {
  display: inline-block !important;
  flex: 0 1 auto !important;
  max-width: calc(100% - 26px) !important; /* garde la place du chevron */
  vertical-align: middle !important;
  background: rgba(22, 49, 92, 0.10) !important;
  border: 1px solid rgba(22, 49, 92, 0.20) !important;
  border-radius: 999px !important;
  padding: 3px 12px !important;
  color: var(--tp-navy) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
/* Le « × » de nettoyage : même look que la croix des tags (à gauche, discret). */
.jobsearch-profile-select .select2-selection--single .select2-selection__clear {
  float: none !important;
  display: inline !important;
  margin: 0 6px 0 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  color: var(--tp-navy) !important;
  opacity: 0.6 !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: opacity 0.12s ease, color 0.12s ease !important;
}
.jobsearch-profile-select .select2-selection--single .select2-selection__clear:hover {
  opacity: 1 !important;
  color: #c44 !important;
}

/* ===========================================================================
 * 95. QCM / « Questions pour candidater » (bloc natif du plugin,
 * class-apply-job-questions.php -> .jobsearch-applyquests-dash). Jamais restylé
 * -> aspect brut (interrupteurs rouge/vert criards, densité, hiérarchie floue).
 * On remet tout à la charte : cartes propres, séparation Question / Réponses,
 * interrupteurs sobres (gris éteint / turquoise allumé), inputs alignés 46px.
 * Tout est scopé sous .jobsearch-applyquests-dash. NB : plusieurs .chekunchk-opt-box
 * et .applyquest-options-main sont masqués via un style inline `display:none`
 * (selon le type de question) -> on ne force JAMAIS `display` en !important dessus.
 * --------------------------------------------------------------------------- */

/* --- Carte d'une question ------------------------------------------------- */
.jobsearch-applyquests-dash .applyquest-item-box {
  float: none !important;
  border: 1px solid var(--tp-line, #e4e7ec) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  margin-bottom: 18px !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(16, 49, 92, 0.05) !important;
}

/* --- En-tête de carte : badge type (gauche) + contrôles (droite) ---------- */
.jobsearch-applyquests-dash .applyquest-item-type {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  background: #f7f9fb !important;
  border-bottom: 1px solid var(--tp-line, #e4e7ec) !important;
}
.jobsearch-applyquests-dash .quest-typecon-leftsec,
.jobsearch-applyquests-dash .quest-typecon-ritesec,
.jobsearch-applyquests-dash .quest-sortremve-sec {
  float: none !important;
  margin: 0 !important;
}
.jobsearch-applyquests-dash .quest-typecon-leftsec {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: transparent !important;
}
.jobsearch-applyquests-dash .quest-typecon-leftsec i {
  float: none !important;
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--tp-navy, #16315c) !important;
  color: #fff !important;
  border-radius: 9px !important;
  font-size: 17px !important;
}
.jobsearch-applyquests-dash .quest-typecon-leftsec span {
  float: none !important;
  padding: 0 !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--tp-navy, #16315c) !important;
}
.jobsearch-applyquests-dash .quest-typecon-ritesec {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
}

/* --- Interrupteur (multi / obligatoire / bonne réponse) : label + toggle -- */
.jobsearch-applyquests-dash .chekunchk-opt-box {
  display: inline-flex; /* PAS de !important : respecte le display:none inline */
  float: none !important;
  margin: 0 !important;
  align-items: center !important;
  gap: 8px !important;
}
.jobsearch-applyquests-dash .chk-onoffswitch-title {
  order: -1 !important; /* le libellé à GAUCHE de l'interrupteur */
  float: none !important;
  padding: 0 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--tp-navy, #16315c) !important;
}
/* Piste compacte : gris éteint / turquoise allumé, sans texte Oui/Non (le
 * libellé à gauche suffit). 40×22, pastille 16 (look interrupteur standard). */
.jobsearch-applyquests-dash .chekunchk-opt-boxiner {
  width: 40px !important;
  height: 22px !important;
  vertical-align: middle !important;
}
.jobsearch-applyquests-dash .chekunchk-opt-boxiner label {
  border-radius: 999px !important;
}
.jobsearch-applyquests-dash span.chkunchk-onoffswitch-inner:before,
.jobsearch-applyquests-dash span.chkunchk-onoffswitch-inner:after {
  content: "" !important;
  height: 22px !important;
  line-height: 22px !important;
  padding: 0 !important;
}
.jobsearch-applyquests-dash span.chkunchk-onoffswitch-inner:before {
  background-color: var(--tp-accent, #2ea6a0) !important; /* état ON (allumé) */
}
.jobsearch-applyquests-dash span.chkunchk-onoffswitch-inner:after {
  background-color: #d9dee6 !important; /* état OFF (éteint) */
}
.jobsearch-applyquests-dash .chkunchk-onoffswitch-switch {
  width: 16px !important;
  height: 16px !important;
  top: 3px !important;
  bottom: auto !important; /* le plugin met bottom:0 -> pastille étirée en ovale */
  right: 21px !important;
  margin: 0 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
}
.jobsearch-applyquests-dash .corect-opt-chkunchk:checked + label .chkunchk-onoffswitch-switch {
  right: 3px !important;
}

/* --- Boutons déplacer / supprimer la question ----------------------------- */
.jobsearch-applyquests-dash .quest-sortremve-sec {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-left: 4px !important;
}
.jobsearch-applyquests-dash .quest-sortremve-sec a {
  float: none !important;
  width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  border: 1px solid var(--tp-line, #e4e7ec) !important;
  background: #fff !important;
  color: var(--tp-text-muted, #7a8899) !important;
  transition: all 0.15s ease !important;
}
.jobsearch-applyquests-dash .quest-sortremve-sec a.applyquest-item-drag {
  cursor: move !important;
}
.jobsearch-applyquests-dash .quest-sortremve-sec a:hover {
  border-color: var(--tp-navy, #16315c) !important;
  color: var(--tp-navy, #16315c) !important;
}
.jobsearch-applyquests-dash .quest-sortremve-sec a.applyquest-item-remove:hover {
  border-color: var(--tp-danger, #d64545) !important;
  background: var(--tp-danger-soft, #fdecec) !important;
  color: var(--tp-danger, #d64545) !important;
}

/* --- Corps : la question -------------------------------------------------- */
.jobsearch-applyquests-dash .applyquest-answers-outer {
  float: none !important;
  padding: 18px 16px 14px !important;
}
.jobsearch-applyquests-dash .applyquest-item-queststr {
  float: none !important;
  margin-bottom: 16px !important;
}
.jobsearch-applyquests-dash .quest-hding-optcomb {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-bottom: 8px !important;
}
.jobsearch-applyquests-dash .quest-type-hding {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}
.jobsearch-applyquests-dash .quest-type-hding strong,
.jobsearch-applyquests-dash .applyquest-options-main::before {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  color: var(--tp-text-muted, #7a8899) !important;
}
.jobsearch-applyquests-dash .applyquest-item-queststr input[type="text"] {
  float: none !important;
  width: 100% !important;
  height: 46px !important;
  border: 1px solid var(--tp-border, #e4e7ec) !important;
  border-radius: 10px !important;
  padding: 0 14px !important;
  color: var(--tp-navy, #16315c) !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14.5px !important;
  background: #fff !important;
}
.jobsearch-applyquests-dash input[type="text"]:focus {
  border-color: var(--tp-navy, #16315c) !important;
  box-shadow: 0 0 0 4px rgba(22, 49, 92, 0.12) !important;
  outline: none !important;
}

/* --- Corps : les réponses proposées --------------------------------------- */
.jobsearch-applyquests-dash .applyquest-options-main {
  float: none !important;
  width: 100% !important;
}
.jobsearch-applyquests-dash .applyquest-options-main::before {
  content: "Réponses proposées" !important;
  display: block !important;
  margin-bottom: 10px !important;
}
.jobsearch-applyquests-dash .applyquest-options-apendcon {
  float: none !important;
}
.jobsearch-applyquests-dash .applyquest-option-itm {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-bottom: 10px !important;
  float: none !important;
}
.jobsearch-applyquests-dash .applyquest-option-itm .applyquest-optionstr {
  float: none !important;
  width: auto !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
.jobsearch-applyquests-dash .applyquest-option-itm .applyquest-optionstr input[type="text"] {
  float: none !important;
  width: 100% !important;
  height: 44px !important;
  border: 1px solid var(--tp-border, #e4e7ec) !important;
  border-radius: 10px !important;
  padding: 0 14px !important;
  color: var(--tp-navy, #16315c) !important;
  font-size: 14px !important;
  background: #fff !important;
}
.jobsearch-applyquests-dash .applyquest-opts-btnsec {
  float: none !important;
  width: auto !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 14px !important;
}
.jobsearch-applyquests-dash .applyquest-opts-btnsec .chk-onoffswitch-title {
  padding-top: 0 !important;
}
/* Largeur réservée pour +/− : la 1re option n'a pas de « − », mais on garde la
 * place pour que le « + » et les interrupteurs restent alignés en colonne. */
.jobsearch-applyquests-dash .opts-plusminus-sec {
  float: none !important;
  display: inline-flex !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  min-width: 66px !important;
}
.jobsearch-applyquests-dash .opts-plusminus-sec a {
  float: none !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  border: 1px solid transparent !important;
}
.jobsearch-applyquests-dash .opts-plusminus-sec a.questopt-item-add {
  background: var(--tp-accent, #2ea6a0) !important;
  color: #fff !important;
}
.jobsearch-applyquests-dash .opts-plusminus-sec a.questopt-item-add:hover {
  filter: brightness(0.94) !important;
}
.jobsearch-applyquests-dash .opts-plusminus-sec a.questopt-item-remove {
  background: var(--tp-danger-soft, #fdecec) !important;
  color: var(--tp-danger, #d64545) !important;
  border-color: var(--tp-danger, #d64545) !important;
}
.jobsearch-applyquests-dash .opts-plusminus-sec a.questopt-item-remove:hover {
  background: var(--tp-danger, #d64545) !important;
  color: #fff !important;
}

/* --- Bas de bloc : type de question + bouton d'ajout ---------------------- */
.jobsearch-applyquests-dash .addnew-questtypes-btnscon {
  float: none !important;
  text-align: center !important;
  margin-top: 6px !important;
}
.jobsearch-applyquests-dash .select-questype-hding {
  float: none !important;
  width: 100% !important;
}
.jobsearch-applyquests-dash .select-questype-hding strong {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--tp-navy, #16315c) !important;
  margin-bottom: 14px !important;
}
.jobsearch-applyquests-dash .addnew-questtypes-btnsiner {
  float: none !important;
}
.jobsearch-applyquests-dash .addnew-questtypes-btnsiner a {
  padding: 0 16px 0 0 !important;
  margin: 0 8px 10px 0 !important;
  border: 1px solid var(--tp-line, #e4e7ec) !important;
  border-radius: 10px !important;
  color: var(--tp-navy, #16315c) !important;
  line-height: 2.6 !important;
  background: #fff !important;
}
.jobsearch-applyquests-dash .addnew-questtypes-btnsiner a i {
  padding: 9px 12px !important;
  margin-right: 14px !important;
  border-right: 1px solid var(--tp-line, #e4e7ec) !important;
  font-size: 16px !important;
  color: var(--tp-text-muted, #7a8899) !important;
}
.jobsearch-applyquests-dash .addnew-questtypes-btnsiner a.active-type-itm,
.jobsearch-applyquests-dash .addnew-questtypes-btnsiner a:hover {
  background: rgba(22, 49, 92, 0.05) !important;
  border-color: var(--tp-navy, #16315c) !important;
  color: var(--tp-navy, #16315c) !important;
}
.jobsearch-applyquests-dash .addnew-questtypes-btnsiner a.active-type-itm i,
.jobsearch-applyquests-dash .addnew-questtypes-btnsiner a:hover i {
  color: var(--tp-navy, #16315c) !important;
  border-right-color: var(--tp-navy, #16315c) !important;
}
.jobsearch-applyquests-dash .addnew-aplyquestbtn-con {
  float: none !important;
  margin: 8px 0 10px !important;
}
.jobsearch-applyquests-dash .add-new-applyquestbtn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 22px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  background: var(--tp-navy, #16315c) !important;
  color: #fff !important;
  border: 1px solid var(--tp-navy, #16315c) !important;
  cursor: pointer !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}
.jobsearch-applyquests-dash .add-new-applyquestbtn:hover {
  background: var(--tp-accent, #2ea6a0) !important;
  border-color: var(--tp-accent, #2ea6a0) !important;
  color: #fff !important;
}

/* ---------------------------------------------------------------------------
 * 95.b — Un SEUL type de question activé (QCM). On simplifie la présentation :
 *  - le sélecteur « Type de question » (un unique choix) devient inutile -> on
 *    le MASQUE (mais on le garde dans le DOM : le bouton « Ajouter une question »
 *    lit son data-type en JS ; le retirer casserait l'ajout).
 *  - le badge « Cases à cocher (QCM) » répété sur chaque carte est redondant ->
 *    on le remplace par un numéro « Question 1 / Question 2… » (compteur CSS,
 *    se recalcule tout seul à l'ajout / suppression / réordonnancement).
 * ------------------------------------------------------------------------- */

/* Masque le choix de type (titre + chips), garde le bouton d'ajout. */
.jobsearch-applyquests-dash .select-questype-hding,
.jobsearch-applyquests-dash .addnew-questtypes-btnsiner {
  display: none !important;
}
.jobsearch-applyquests-dash .addnew-questtypes-btnscon {
  margin-top: 0 !important;
}

/* Numérotation automatique des cartes de question. */
.jobsearch-applyquests-dash .dash-applyquests-apendcon {
  counter-reset: tp-qcm;
}
.jobsearch-applyquests-dash .applyquest-item-box {
  counter-increment: tp-qcm;
}
/* Remplace le libellé du type par « Question N » (on garde l'icône). */
.jobsearch-applyquests-dash .quest-typecon-leftsec span {
  display: none !important;
}
.jobsearch-applyquests-dash .quest-typecon-leftsec::after {
  content: "Question " counter(tp-qcm) !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--tp-navy, #16315c) !important;
}

/* ===========================================================================
 * 96 — MODALE « Télécharger le CV » (profil candidat, achat d'un point).
 * Rendu serveur #JobSearchDLoadResModal{id} : <h4> message + .shortlisting-user-info
 * (photo + poste + « Inscrit depuis ») + boutons Confirmer / Annuler.
 * Harmonisée à la charte. PIÈGE réparé : le bouton « Annuler » porte la classe
 * .modal-close -> notre règle générale (§ modales) le transformait en CROIX RONDE
 * flottée en haut à droite (d'où le chevauchement avec le titre). On annule ce
 * traitement et on le remet en bouton secondaire dans la rangée.
 * --------------------------------------------------------------------------- */
[id^="JobSearchDLoadResModal"] .modal-box-area {
  max-width: 460px !important;
  margin: 0 auto !important;
  padding: 30px 32px 26px !important;
  text-align: center !important;
}
[id^="JobSearchDLoadResModal"] .user-shortlist-area { text-align: center !important; }
[id^="JobSearchDLoadResModal"] .user-shortlist-area h4 {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  color: var(--tp-navy, #16315c) !important;
  margin: 0 !important;
}
[id^="JobSearchDLoadResModal"] .shortlisting-user-info { margin: 18px 0 22px !important; }
[id^="JobSearchDLoadResModal"] .shortlisting-user-info figure { margin: 0 0 10px !important; }
[id^="JobSearchDLoadResModal"] .shortlisting-user-info figure img {
  width: 76px !important;
  height: 76px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 3px solid var(--tp-bg-soft, #eef1f5) !important;
}
[id^="JobSearchDLoadResModal"] .shortlisting-user-info p {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--tp-navy, #16315c) !important;
  margin: 0 !important;
}
[id^="JobSearchDLoadResModal"] .shortlisting-user-info small {
  font-size: 12.5px !important;
  color: var(--tp-text-muted, #7a8899) !important;
}

/* Rangée de boutons centrée sous le contenu. */
[id^="JobSearchDLoadResModal"] .jobsearch-emp-pkg-popup-btns {
  display: flex !important;
  justify-content: center !important;
  gap: 12px !important;
  margin: 0 !important;
  flex-wrap: wrap !important;
}
/* Bouton principal « Télécharger le CV » (ex-Confirm) = navy -> turquoise au survol. */
[id^="JobSearchDLoadResModal"] a.jobsearch-emp-pkg-cunfirm {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 24px !important;
  border-radius: 10px !important;
  background: var(--tp-navy, #16315c) !important;
  color: #fff !important;
  border: 1px solid var(--tp-navy, #16315c) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}
[id^="JobSearchDLoadResModal"] a.jobsearch-emp-pkg-cunfirm:hover {
  background: var(--tp-accent, #2ea6a0) !important;
  border-color: var(--tp-accent, #2ea6a0) !important;
  color: #fff !important;
}
/* Bouton « Annuler » (ex-Cancel) : il porte .modal-close -> on ANNULE le traitement
   « croix ronde » (float/width/height/border-radius) et on en fait un bouton
   secondaire propre dans la rangée. */
[id^="JobSearchDLoadResModal"] a.jobsearch-emp-pkg-close.modal-close {
  position: static !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  border-radius: 10px !important;
  padding: 12px 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #fff !important;
  color: var(--tp-navy, #16315c) !important;
  border: 1px solid var(--tp-border, #e4e7ec) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: border-color 0.15s ease, color 0.15s ease !important;
}
[id^="JobSearchDLoadResModal"] a.jobsearch-emp-pkg-close.modal-close:hover {
  border-color: var(--tp-navy, #16315c) !important;
  color: var(--tp-navy, #16315c) !important;
  background: #fff !important;
}

/* ===========================================================================
 * 97 — CŒUR « AJOUTER AUX FAVORIS » masqué sur les cartes d'offres (listing).
 * Le bouton .like-btn (contenant a.jobsearch-job-like / .jobsearch-add-job-to-
 * favourite) n'est pas souhaité sur la page des offres publiées. On masque le
 * conteneur (pas d'espace résiduel) + le lien par sécurité.
 * --------------------------------------------------------------------------- */
.jobsearch-job .like-btn,
.jobsearch-joblisting-classic .like-btn,
.jobsearch-job-userlist .like-btn,
.jobsearch-job-userlist a.jobsearch-job-like,
.jobsearch-job a.jobsearch-job-like {
  display: none !important;
}