/* Fusion des styles boutons : structure/button.css + design/buttons/buttons.css */

/* Boutons dynamiques du portfolio */
.folio_button, .folio-button {
	color: var(--portfolios-button-text-color, #fff)!important;
	background: var(--portfolios-button-background-color, #222);
	border: var(--portfolios-button-border-width, 0px) var(--portfolios-button-border-type, solid) var(--portfolios-button-border-color, #222);
	border-radius: var(--portfolios-button-radius, 0px);
	padding: var(--portfolios-button-padding-y, 10px) var(--portfolios-button-padding-x, 24px);
	transition: box-shadow 0.2s, border 0.2s, background 0.2s, color 0.2s, filter 0.18s, transform 0.18s;
	box-shadow: var(--portfolios-button-box-shadow, none);
	font-family: var(--portfolios-button-font-family, inherit);
	font-size: var(--portfolios-button-font-size, 1rem);
	font-weight: var(--portfolios-button-font-weight, 500);
	letter-spacing: var(--portfolios-button-letter-spacing, normal);
	text-transform: none;
	cursor: var(--portfolios-button-cursor, pointer);
	opacity: var(--portfolios-button-opacity, 1);
	display: inline-block;
	align-items: center;
	gap: var(--portfolios-button-gap, 0.5em);
	outline: var(--portfolios-button-outline-width, 0px) var(--portfolios-button-outline-style, solid) var(--portfolios-button-outline-color, transparent);
	filter: brightness(100%);
	justify-content: center;
	max-width: max-content;
}

.folio_button svg, .folio-button svg {
    width: 15px;
}

.folio_button.gradient, .folio-button.gradient {
	background: var(--portfolios-button-gradient);
}
.folio_button.shadow, .folio-button.shadow {
	border: none;
	box-shadow: 0px 2px 10px 0px var(--portfolios-button-border-color, #222);
}
.folio_button.glow, .folio-button.glow {
	box-shadow: var(--portfolios-button-glow, 0 0 8px 2px var(--portfolios-button-border-color, #ff0));
}
.folio_button:hover, .folio-button:hover {
	color: var(--portfolios-button-hover-text-color);
	background: var(--portfolios-button-hover-background);
	box-shadow: var(--portfolios-button-hover-box-shadow, var(--portfolios-button-box-shadow));
	transform: var(--portfolios-button-hover-transform, none);
	filter: var(--portfolios-button-hover-filter, brightness(100%)) !important;
}
.folio_button:active, .folio-button:active {
	color: var(--portfolios-button-click-text-color, var(--portfolios-button-hover-text-color));
	background: var(--portfolios-button-click-background, var(--portfolios-button-hover-background));
	box-shadow: var(--portfolios-button-click-effect, none);
	transform: var(--portfolios-button-click-transform, scale(0.95));
	filter: var(--portfolios-button-hover-filter, brightness(100%)) !important;
}
.folio_button:disabled, .folio-button:disabled {
	opacity: var(--portfolios-button-disabled-opacity, 0.5);
	cursor: not-allowed;
}

/* Effets avancés réutilisables */
.button-gradient {
    background: linear-gradient(90deg, #ff6600, #ffcc00);
}
.button-hover-translate:hover {
    transform: translateY(-4px);
    transition: transform 0.2s;
}
.button-hover-scale:hover {
    transform: scale(1.08);
    transition: transform 0.2s;
}
.button-hover-rotate:hover {
    transform: rotate(-3deg);
    transition: transform 0.2s;
}
.button-hover-invert:hover {
    filter: invert(1);
    transition: filter 0.2s;
}
.button-click-down:active {
    transform: scale(0.95);
    transition: transform 0.1s;
}

/* Accueil (#hero) : le bloc texte peut imposer couleur / fond ; on réapplique le thème bouton. */
#portfolio_page #hero #title-home a.folio_button,
#portfolio_page #hero #title-home a.folio-button {
	background: var(--portfolios-button-background-color, #222) !important;
	color: var(--portfolios-button-text-color, #fff) !important;
	border-color: var(--portfolios-button-border-color, #222);
}
#portfolio_page #hero #title-home a.folio_button:hover,
#portfolio_page #hero #title-home a.folio-button:hover {
	color: var(--portfolios-button-hover-text-color, var(--portfolios-button-text-color, #fff)) !important;
	background: var(--portfolios-button-hover-background, var(--portfolios-button-background-color, #333)) !important;
}