/* Styles personnalisés pour la barre de profil avec bouton follow */

/* Style spécifique pour la barre de profil */
[data-app="profile"] .timeline-header__botline {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	position: relative !important;
}

/* Partie gauche : bouton back + pseudo */
.timeline-header__botline .lp.lp-profile {
	position: relative !important;
	z-index: 10 !important;
	max-width: calc(50% - 30px) !important;
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	overflow: visible !important;
}

.timeline-header__botline .lp.lp-profile .nav-link-holder {
	display: flex !important;
	flex-shrink: 0 !important;
}

/* Bouton back plus visible */
.timeline-header__botline .lp.lp-profile .nav-link-holder .go-back {
	width: 40px !important;
	height: 40px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 50% !important;
	background: var(--cl-secondary-bg-color) !important;
	opacity: 1 !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
}

.timeline-header__botline .lp.lp-profile .nav-link-holder .go-back:hover {
	background: var(--cl-primary-color) !important;
	opacity: 1 !important;
}

.timeline-header__botline .lp.lp-profile .nav-link-holder .go-back svg {
	width: 24px !important;
	height: 24px !important;
}

.timeline-header__botline .lp.lp-profile .nav-link-holder .go-back svg path {
	fill: var(--cl-primary-text-color) !important;
}

.timeline-header__botline .lp.lp-profile .nav-link-holder .go-back:hover svg path {
	fill: #ffffff !important;
}

.timeline-header__botline .lp.lp-profile .profile-username-holder {
	display: flex !important;
	align-items: center !important;
	overflow: hidden !important;
}

.timeline-header__botline .lp.lp-profile .profile-username-holder a.profile-header-name {
	font-size: 17px !important;
	line-height: 17px !important;
	font-weight: 700 !important;
	color: var(--cl-primary-text-color) !important;
	text-decoration: none !important;
	display: flex !important;
	align-items: center !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
}

.timeline-header__botline .lp.lp-profile .profile-username-holder a.profile-header-name span.user-name-holder {
	display: flex !important;
	align-items: center !important;
	gap: 4px !important;
	overflow: hidden !important;
}

.timeline-header__botline .lp.lp-profile .profile-username-holder a.profile-header-name span.user-name-holder span.user-name-holder__name {
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
}

.timeline-header__botline .lp.lp-profile .profile-username-holder a.profile-header-name span.user-name-holder span.user-name-holder__badge {
	flex-shrink: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
}

/* Centre : logo seul - vraiment centré */
[data-app="profile"] .timeline-header__botline .cp {
	position: absolute !important;
	left: 50% !important;
	top: 50% !important;
	transform: translate(-50%, -50%) !important;
	z-index: 5 !important;
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
}

[data-app="profile"] .timeline-header__botline .cp a {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

/* Styles pour le bouton follow dans la barre (à droite) - plus grand */
.timeline-header__botline .rp {
	position: relative !important;
	z-index: 10 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
}

.timeline-header__botline .rp div.header-follow-holder {
	display: flex !important;
	align-items: center !important;
}

.timeline-header__botline .rp div.header-follow-holder button {
	white-space: nowrap !important;
	padding: 10px 20px !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	min-height: 40px !important;
	border-radius: 20px !important;
}

/* Animation d'apparition du bouton */
#profile-header-follow-btn {
	display: none !important;
	transition: all 0.2s ease-in-out;
}

#profile-header-follow-btn.show {
	display: flex !important;
}

/* TOUS les boutons Unfollow/Pending transparents avec bordure */
/* Surcharge globale pour tous les contextes */
body button.btn-custom.main-inline,
body div.btn-custom.main-inline,
body .btn.btn-custom.main-inline,
.user-profile__controls button.btn-custom.main-inline,
.sidebar-users__item-action button.btn-custom.main-inline,
.sidebar-users__item-action .sidebar-follow-btn.btn.btn-custom.main-inline,
.sidebar-users__item-action button.sidebar-follow-btn.main-inline,
.timeline-header__botline button.btn-custom.main-inline,
[data-app="profile"] button.btn-custom.main-inline {
	background: transparent !important;
	background-color: transparent !important;
	border: 1px solid var(--cl-primary-color) !important;
	color: var(--cl-primary-text-color) !important;
}

body button.btn-custom.main-inline:hover,
body button.btn-custom.main-inline:active,
body button.btn-custom.main-inline:focus,
body div.btn-custom.main-inline:hover,
body div.btn-custom.main-inline:active,
body div.btn-custom.main-inline:focus,
body .btn.btn-custom.main-inline:hover,
.user-profile__controls button.btn-custom.main-inline:hover,
.sidebar-users__item-action button.btn-custom.main-inline:hover,
.sidebar-users__item-action .sidebar-follow-btn.btn.btn-custom.main-inline:hover,
.sidebar-users__item-action button.sidebar-follow-btn.main-inline:hover,
.timeline-header__botline button.btn-custom.main-inline:hover,
[data-app="profile"] button.btn-custom.main-inline:hover {
	background: var(--cl-secondary-bg-color) !important;
	background-color: var(--cl-secondary-bg-color) !important;
	border: 1px solid var(--cl-primary-color) !important;
	color: var(--cl-primary-text-color) !important;
	opacity: 1 !important;
}

/* Pour le thème vert spécifiquement */
body[data-skin=green] button.btn-custom.main-inline,
body[data-skin=green] div.btn-custom.main-inline {
	background: transparent !important;
	background-color: transparent !important;
	border: 1px solid #2fbf63 !important;
	color: var(--cl-primary-text-color) !important;
}

body[data-skin=green] button.btn-custom.main-inline:hover,
body[data-skin=green] div.btn-custom.main-inline:hover {
	background: var(--cl-secondary-bg-color) !important;
	opacity: 1 !important;
}

/* Barre du thread - même style que le profil */
[data-app="thread"] .timeline-header__botline .lp.lp-thread {
	position: relative !important;
	z-index: 10 !important;
	max-width: calc(50% - 30px) !important;
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	overflow: visible !important;
}

[data-app="thread"] .timeline-header__botline .lp.lp-thread .nav-link-holder {
	display: flex !important;
	flex-shrink: 0 !important;
}

/* Bouton back plus visible */
[data-app="thread"] .timeline-header__botline .lp.lp-thread .nav-link-holder .go-back {
	width: 40px !important;
	height: 40px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 50% !important;
	background: var(--cl-secondary-bg-color) !important;
	opacity: 1 !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
}

[data-app="thread"] .timeline-header__botline .lp.lp-thread .nav-link-holder .go-back:hover {
	background: var(--cl-primary-color) !important;
	opacity: 1 !important;
}

[data-app="thread"] .timeline-header__botline .lp.lp-thread .nav-link-holder .go-back svg {
	width: 24px !important;
	height: 24px !important;
}

[data-app="thread"] .timeline-header__botline .lp.lp-thread .nav-link-holder .go-back svg path {
	fill: var(--cl-primary-text-color) !important;
}

[data-app="thread"] .timeline-header__botline .lp.lp-thread .nav-link-holder .go-back:hover svg path {
	fill: #ffffff !important;
}

[data-app="thread"] .timeline-header__botline .lp.lp-thread .thread-title-holder {
	display: flex !important;
	align-items: center !important;
	overflow: hidden !important;
}

[data-app="thread"] .timeline-header__botline .lp.lp-thread .thread-title-holder a {
	font-size: 17px !important;
	line-height: 17px !important;
	font-weight: 700 !important;
	color: var(--cl-primary-text-color) !important;
	text-decoration: none !important;
	display: flex !important;
	align-items: center !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
}

/* Bouton Reply dans la barre du thread */
[data-app="thread"] .timeline-header__botline .rp {
	position: relative !important;
	z-index: 10 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
}

[data-app="thread"] .timeline-header__botline .rp .header-reply-holder {
	display: flex !important;
	align-items: center !important;
}

[data-app="thread"] .timeline-header__botline .rp .header-reply-holder button {
	white-space: nowrap !important;
	padding: 10px 20px !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	min-height: 40px !important;
	border-radius: 20px !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	background: transparent !important;
	border: 1px solid var(--cl-primary-color) !important;
	color: var(--cl-primary-text-color) !important;
}

[data-app="thread"] .timeline-header__botline .rp .header-reply-holder button:hover {
	background: var(--cl-secondary-bg-color) !important;
}

/* Cacher l'icône du bouton Reply */
[data-app="thread"] .timeline-header__botline .rp .header-reply-holder button svg {
	display: none !important;
}