/*
 Theme Name:  Divi Child – Programma Integra
 Description: Child theme di Divi per Programma Integra
 Author:      Stefano Cocca
 Template:    Divi
 Version:     1.0.0
 Text Domain: divi-child
*/

/* ==========================================================
   CSS spostato da Divi → Theme Options → Custom CSS
   ========================================================== */

.et_pb_blog_grid .et_pb_post {
	padding: 30px;
	background: #f2f2f2;
	border-radius: 10px;
	-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
	page-break-inside: avoid; /* Firefox */
	break-inside: avoid; /* IE 10+ */
	-webkit-box-shadow: 5px 5px 14px 0px rgba(0,0,0,0.44);
	box-shadow: 5px 5px 14px 0px rgba(0,0,0,0.44);
}



/*style the Divi Blurb link as a button*/

a.pa-blurb-button {
	color: #ffffff;
	background: #0071fc;
	border: 2px solid #0070fc;
	padding: .7em 1.3em;
	margin-top: 20px;
	border-radius: 50px;
	text-transform: capitalize;
	display: inline-block;
	transition: all 0.3s ease-in-out;
}


/*style the Divi Blurb link text as a button on hover*/

a.pa-blurb-button:hover {
	background: transparent;
	color: #0070fc;
	border: 2px solid #0070fc;
	cursor: pointer;
	transition: all 0.3s ease-in-out;
}

.et_pb_menu .et-menu>li {
    padding-left: 20px;
    padding-right: 20px;
}


/*style the wp-pagenavi pagination links*/

.wp-pagenavi a,
.wp-pagenavi span {
	color: #000000;
	background: #f1f3f5;
	font-size: 1em !important;
	line-height: 1em;
	font-weight: bold !important;
	padding: 0.45em 0.8em !important;
	border-radius: 100px;
  border: none;
	transition: all .5s;
}

.et_pb_gutters3 .et_pb_column_4_4 .et_pb_grid_item, .et_pb_gutters3 .et_pb_column_4_4 .et_pb_shop_grid .woocommerce ul.products li.product, .et_pb_gutters3 .et_pb_column_4_4 .et_pb_widget, .et_pb_gutters3.et_pb_row .et_pb_column_4_4 .et_pb_grid_item, .et_pb_gutters3.et_pb_row .et_pb_column_4_4 .et_pb_shop_grid .woocommerce ul.products li.product, .et_pb_gutters3.et_pb_row .et_pb_column_4_4 .et_pb_widget
{
    width: 100%;
}

.the_champ_sharing_title
{
	margin-top: 30px;

}

/*add icon to Divi main menu items

nav li a:before {
    font-family: 'ETMODULES';
    content: '\24';
    text-align: center;
    vertical-align: middle;
    margin-right: 10px;
    margin-left: -10px;
    color: #2cba6c;
    font-size: 1em;
    transition: all .3s ease;
}
*/
/*add icon to Divi submenu items

nav li li a:before {
    font-family: 'ETMODULES';
    content: '\24';
    text-align: center;
    vertical-align: middle;
    margin-right: 10px;
    margin-left: -10px;
    color: #2cba6c;
    font-size: 1em;
    transition: all .3s ease;
}
*/
/*change color and position of submenu icon on hover

nav li ul li a:hover:before {
    margin-left: -7px;
    color: #e03574 !important;
    transition: all .3s ease;
}
*/

.slider_restyle .et_pb_slide_title
{
	/*margin-top:160px!important;*/


}
/*
.pa-custom-background-pattern-1 .et_pb_background_pattern {
      background-image: url("https://staging2.programmaintegra.it/wp/wp-content/uploads/2023/12/LOGO_PI_Solo-1.png")!important;
}
*/


/*style the Divi blog link text as a button*/

.et_pb_post a.more-link {
  color: #ffffff;
	background: #0071fc;
	border: 2px solid #0070fc;
	padding: .7em 1.3em;
	margin-top: 20px;
	border-radius: 50px;
	text-transform: capitalize;
	display: inline-block;
	transition: all 0.3s ease-in-out;
}


/*style the Divi blog link text as a button on hover*/

.et_pb_post a.more-link:hover {
	background: transparent;
	color: #0070fc;
	border: 2px solid #0070fc;
	transition: all 0.3s ease-in-out;
}

/* Hide image titles on hover */ img { pointer-events:none; }
/*add an icon to the Divi blog read more button

.et_pb_post .more-link:after {
	content: "\24";
	font-family: ETModules;
	vertical-align: middle;
	margin-left: 10px;
}
*/
.llms-lesson-button-wrapper
 {
    margin-bottom: 30px;
    width: 100%;
    display: block;
    clear: both;
    text-align: center;
}

.bacheca-pulsante a {
    text-decoration: underline !important;
}

/* ==========================================================
   LifterLMS – colori Programma Integra
   Magenta per i pulsanti principali, arancio per gli accenti.
   Verde/rosso di quiz superato/non superato invariati.
   ========================================================== */

:root {
	--pi-arancio: #ff8800;
	--pi-magenta: #dd3355;
	--pi-testo-scuro: #1a1a1a;
}

/* --- Pulsanti principali: Continua, Segna come completato, Inizia quiz --- */
body .llms-button-primary,
body .llms-button-primary.wp-element-button {
	background: var(--pi-magenta) !important;
	border-color: var(--pi-magenta) !important;
	color: #fff !important;
}
body .llms-button-primary:hover,
body .llms-button-primary:focus,
body .llms-button-primary:active {
	background: var(--pi-arancio) !important;
	border-color: var(--pi-arancio) !important;
	color: var(--pi-testo-scuro) !important;
}

/* --- Pulsanti azione: Iscriviti, Invia quiz --- */
body .llms-button-action,
body .llms-button-action.wp-element-button {
	background: var(--pi-arancio) !important;
	border-color: var(--pi-arancio) !important;
	color: var(--pi-testo-scuro) !important;
}
body .llms-button-action:hover,
body .llms-button-action:focus,
body .llms-button-action.clicked {
	background: var(--pi-magenta) !important;
	border-color: var(--pi-magenta) !important;
	color: #fff !important;
}

/* --- Pulsanti secondari: Lezione precedente, Indietro --- */
body .llms-button-secondary,
body .llms-button-secondary.wp-element-button {
	background: #fff !important;
	border: 2px solid var(--pi-magenta) !important;
	color: var(--pi-magenta) !important;
}
body .llms-button-secondary:hover,
body .llms-button-secondary:focus,
body .llms-button-secondary:active {
	background: var(--pi-magenta) !important;
	color: #fff !important;
}

/* --- Box Docente del corso --- */
.llms-instructor-info .llms-instructors .llms-author {
	border-top-color: var(--pi-arancio);
}
.llms-instructor-info .llms-instructors .llms-author .avatar {
	background: var(--pi-arancio);
	border-color: var(--pi-arancio);
}

/* --- Popup "lezione completata" --- */
.llms-notification {
	border-top-color: var(--pi-arancio);
}

/* --- Barra di avanzamento: sfumatura arancio → magenta --- */
.llms-progress .progress-bar-complete {
	background: linear-gradient(90deg, var(--pi-arancio), var(--pi-magenta));
}

/* --- Spunte lezioni completate, badge Free, titoli al passaggio del mouse --- */
.llms-widget-syllabus .llms-lesson-complete.done,
.llms-widget-syllabus .lesson-complete-placeholder.done,
.llms-lesson-preview.is-free .llms-lesson-complete,
.llms-lesson-preview.is-complete .llms-lesson-complete,
.llms-loop-item-content .llms-loop-title:hover {
	color: var(--pi-magenta);
}
.llms-lesson-preview .llms-icon-free,
.llms-access-plan.featured .llms-access-plan-featured {
	background: var(--pi-magenta);
}

/* --- Cerchio del voto (superato/non superato restano verde/rosso) --- */
.llms-donut {
	color: var(--pi-magenta);
}
.llms-donut svg path {
	stroke: var(--pi-magenta);
}

/* --- Avvisi informativi --- */
.llms-notice {
	background: rgba(255, 136, 0, .12);
	border-color: var(--pi-arancio);
}

/* --- Quiz: risposta selezionata --- */
.llms-question-wrapper .llms-question-choices .llms-choice input:checked + label:before {
	background: var(--pi-magenta);
}
.llms-question-wrapper .llms-question-choices .llms-choice input:focus + label:before,
.llms-question-wrapper .llms-question-choices .llms-choice input:not(:checked) + label.hovered:before {
	-webkit-box-shadow: 0 0 8px var(--pi-magenta);
	box-shadow: 0 0 8px var(--pi-magenta);
}

/* --- Campi dei form selezionati --- */
.llms-form-field input:focus,
.llms-form-field input:focus-visible,
.llms-form-field select:focus {
	border-color: var(--pi-arancio);
}

/* --- Titolo del piano di accesso (es. "Corso Gratis") --- */
.llms-access-plan-title {
	background: var(--pi-arancio);
	color: var(--pi-testo-scuro);
}

/* --- Barra "Hai completato il corso" sotto i risultati del quiz --- */
.pi-completion-bar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	padding: 15px 20px;
	background: linear-gradient(90deg, var(--pi-arancio), var(--pi-magenta));
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	box-shadow: 0 -2px 10px rgba(0,0,0,.2);
}
.pi-completion-bar__btn {
	background: #fff;
	color: var(--pi-magenta) !important;
	padding: .6em 1.6em;
	border-radius: 50px;
	text-decoration: none !important;
}
.pi-completion-bar__btn:hover {
	background: var(--pi-testo-scuro);
	color: #fff !important;
}

/* --- Badge "Lezione completata" --- */
.pi-lesson-complete {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 22px 10px 12px;
	background: rgba(77, 141, 60, .12);
	border: 2px solid #4d8d3c;
	border-radius: 50px;
	color: #2f6b22;
	font-size: 17px;
	font-weight: bold;
	line-height: 1;
}
.pi-lesson-complete__icon {
	position: relative;
	flex: 0 0 28px;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: #4d8d3c;
}
.pi-lesson-complete__icon::after {
	content: "";
	position: absolute;
	left: 10px;
	top: 5px;
	width: 7px;
	height: 13px;
	border: solid #fff;
	border-width: 0 3px 3px 0;
	transform: rotate(45deg);
}