/*
 * Footer component styles
 *
 * Nota: estratto da global.css (Step 7) per ridurre il CSS globale.
 */

/*
 * Stili Specifici per il Footer di BresciaPC.
 * Questi stili gestiscono l'intera struttura del footer, includendo colonne,
 * testi, link, icone social e la sezione copyright.
 *
 * @version 2.0.0
 */


/*
╔══════════════════════════════════════════════════════════════════════════╗
║ Section: STILI GENERALI DEL FOOTER                                        ║
╚══════════════════════════════════════════════════════════════════════════╝
*/
.bresciapc-main-footer {
	background-color: var(--bspc-bg-light);
	color: var(--bspc-text-light);
	font-size: 13px;
	line-height: 1.6;
	padding: 50px 0 30px;
	border-top: 1px solid var(--bspc-border-medium);
}

.bresciapc-main-footer .footer-container {
	/* La larghezza e il padding sono gestiti dalla classe .bpc-section
	   aggiunta nel file footer.php, quindi non è necessario ripeterli qui. */
}

/*
╔══════════════════════════════════════════════════════════════════════════╗
║ Section: LAYOUT DESKTOP (>= 768px)                                        ║
╚══════════════════════════════════════════════════════════════════════════╝
*/
@media (min-width: 768px) {
	/* --- Navigazione a Colonne --- */
	.bresciapc-main-footer .footer-nav {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
		gap: 30px 20px;
		padding-bottom: 30px;
		margin-bottom: 30px;
		border-bottom: 1px solid var(--bspc-border-medium);
	}

	.bresciapc-main-footer .footer-column .footer-column-title {
		display: block;
		color: var(--bspc-text-primary);
		font-size: 14px;
		font-weight: 600;
		margin: 0 0 15px 0;
		cursor: default;
	}

	/* Nascondi l'icona +/- su desktop */
	.bresciapc-main-footer .footer-column .footer-column-title::after {
		display: none;
	}

	.bresciapc-main-footer .footer-column ul.footer-links {
		list-style: none;
		padding: 0;
		margin: 0;
	}

	.bresciapc-main-footer .footer-column ul.footer-links li {
		margin-bottom: 10px;
	}

	.bresciapc-main-footer .footer-column ul.footer-links a {
		text-decoration: none;
		color: var(--bspc-text-secondary);
		transition: color 0.2s ease;
	}

	.bresciapc-main-footer .footer-column ul.footer-links a:hover,
	.bresciapc-main-footer .footer-column ul.footer-links a:focus {
		color: var(--bspc-blue-primary);
		text-decoration: underline;
	}

	/* --- Parte Inferiore del Footer --- */
	.bresciapc-main-footer .footer-bottom {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: baseline;
		gap: 15px 20px;
		font-size: 12px;
		color: #86868b;
	}

	.bresciapc-main-footer .footer-copyright {
		margin-right: 20px;
	}

	.bresciapc-main-footer ul.footer-legal-links {
		list-style: none;
		padding: 0;
		margin: 0;
		display: flex;
		flex-wrap: wrap;
		gap: 5px 15px;
	}

	.bresciapc-main-footer ul.footer-legal-links li {
		position: relative;
		padding-right: 18px;
	}

	.bresciapc-main-footer ul.footer-legal-links li:not(:last-child)::after {
		content: '|';
		position: absolute;
		right: 6px;
		top: 50%;
		transform: translateY(-50%);
		color: var(--bspc-border-medium);
		pointer-events: none;
	}

	.bresciapc-main-footer ul.footer-legal-links a {
		text-decoration: none;
		color: var(--bspc-text-secondary);
		transition: color 0.2s ease;
	}

	.bresciapc-main-footer ul.footer-legal-links a:hover,
	.bresciapc-main-footer ul.footer-legal-links a:focus {
		color: var(--bspc-blue-primary);
		text-decoration: underline;
	}
}

/*
 * ---------------------------------------------------------------------------
 * Sezione: Contenuto Extra (Contatti) nel Footer
 *
 * Lo spazio .footer-extra può ospitare informazioni supplementari come
 * contatti aziendali, orari di apertura e icone social. Qui definiamo
 * l'aspetto di base per la classe .footer-contact stampata dal tema. Le
 * informazioni sono organizzate in colonna con margine ridotto e font
 * leggermente più grande su dispositivi desktop. Su mobile vengono
 * mantenute leggibilità e spaziatura.
 */
@media (min-width: 768px) {
    .bresciapc-main-footer .footer-extra .footer-contact {
        display: flex;
        flex-direction: column;
        gap: 4px;
        font-size: 13px;
        color: var(--bspc-text-secondary);
    }
    .bresciapc-main-footer .footer-extra .footer-contact a {
        color: var(--bspc-blue-primary);
        text-decoration: none;
    }
    .bresciapc-main-footer .footer-extra .footer-contact a:hover,
    .bresciapc-main-footer .footer-extra .footer-contact a:focus {
        text-decoration: underline;
    }
}
@media (max-width: 767px) {
    .bresciapc-main-footer .footer-extra .footer-contact {
        margin-top: 10px;
        font-size: 12px;
        line-height: 1.4;
        color: var(--bspc-text-secondary);
    }
    .bresciapc-main-footer .footer-extra .footer-contact a {
        color: var(--bspc-blue-primary);
        text-decoration: none;
    }
    .bresciapc-main-footer .footer-extra .footer-contact a:hover,
    .bresciapc-main-footer .footer-extra .footer-contact a:focus {
        text-decoration: underline;
    }
}

/*
╔══════════════════════════════════════════════════════════════════════════╗
║ Section: LAYOUT MOBILE (<= 767px) - ACCORDION                             ║
╚══════════════════════════════════════════════════════════════════════════╝
*/
@media (max-width: 767px) {
    .bresciapc-main-footer {
        /* Maggiore spazio inferiore per evitare che la barra home di iOS copra il contenuto */
        padding: 30px 0 36px;
    }

	/* --- Accordion --- */
	.bresciapc-main-footer .footer-nav {
		border-bottom: none;
	}

	.bresciapc-main-footer .footer-column {
		border-bottom: 1px solid var(--bspc-border-medium);
	}
	.bresciapc-main-footer .footer-column:last-of-type {
		border-bottom: none;
	}

	.bresciapc-main-footer .footer-column .footer-column-title {
		display: block;
		width: 100%;
		font-size: 13px;
		font-weight: 500;
		padding: 12px 30px 12px 0; /* Spazio a destra per icona */
		cursor: pointer;
		position: relative;
		color: var(--bspc-text-primary);
		border: none;
		background: none;
		text-align: left;
	}

	/* Icona +/- */
	.bresciapc-main-footer .footer-column .footer-column-title::after {
		content: '+';
		position: absolute;
		right: 10px;
		top: 50%;
		transform: translateY(-50%);
		font-size: 18px;
		font-weight: normal;
		color: #86868b;
		transition: transform 0.3s ease;
	}

	/* Icona quando aperto (classe .open aggiunta da JS) */
	.bresciapc-main-footer .footer-column.open > .footer-column-title::after {
		content: '\2013'; /* Minus sign */
	}

	/* Lista link (pannello accordion) */
	.bresciapc-main-footer .footer-column ul.footer-links {
		list-style: none;
		margin: 0;
		padding: 0 0 0 10px;
		overflow: hidden;
		max-height: 0; /* Nascosto di default */
		transition: max-height 0.4s ease-out, padding-top 0.4s ease-out, padding-bottom 0.4s ease-out;
		background-color: rgba(0, 0, 0, 0.02);
	}

	/* Stile quando aperto (classe .open aggiunta da JS) */
	.bresciapc-main-footer .footer-column.open ul.footer-links {
		padding-top: 10px;
		padding-bottom: 15px;
		/* max-height viene impostato da JS per l'animazione */
	}

	/* --- Parte Inferiore del Footer --- */
	.bresciapc-main-footer .footer-bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
		margin-top: 25px;
		border-top: 1px solid var(--bspc-border-medium);
		padding-top: 25px;
	}

	.bresciapc-main-footer ul.footer-legal-links {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}

	.bresciapc-main-footer ul.footer-legal-links li {
		padding-right: 0;
	}

	.bresciapc-main-footer ul.footer-legal-links li::after {
		display: none;
	}
}/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~                 DESIGN IMPROVEMENTS – FOOTER               ~
~  HOVER/FOCUS COERENTI                                      ~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/


/* === Custom Footer v2.0 (Apple Style) === */

.bpc-footer {
    background-color: var(--bspc-bg-section, #f5f5f7);
    color: var(--bspc-text-secondary, #86868b);
    font-size: 13px;
    line-height: 1.5;
    padding: 60px 0 30px;
    border-top: 1px solid var(--bspc-border-light, #e5e5e5);
    margin-top: auto;
}

.bpc-footer-grid {
    display: grid;
    gap: 40px;
}

@media (min-width: 992px) {
    .bpc-footer-grid {
        grid-template-columns: 280px 1fr;
        align-items: start;
    }
    .bpc-footer-links-wrapper {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }
}

@media (max-width: 991px) {
    .bpc-footer-links-wrapper {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}

.bpc-footer-brand {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.bpc-footer .footer-logo img {
    display: block;
    max-width: 140px;
    height: auto;
    opacity: 0.9;
}

.bpc-footer .footer-contact-info p {
    margin: 0 0 6px;
    font-size: 13px;
}

.bpc-footer .footer-contact-info a {
    color: var(--bspc-text-primary, #1d1d1f);
    text-decoration: none;
    transition: color 0.2s ease;
}
.bpc-footer .footer-contact-info a:hover {
    color: var(--bspc-blue-primary, #0071e3);
}

.bpc-footer .footer-socials {
    display: flex;
    gap: 15px;
    margin-top: 10px;
}
.bpc-footer .footer-socials a {
    color: var(--bspc-text-secondary);
    transition: color 0.2s ease, transform 0.2s ease;
}
.bpc-footer .footer-socials a:hover {
    color: var(--bspc-blue-primary);
    transform: translateY(-2px);
}

.bpc-footer .footer-col-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--bspc-text-primary, #1d1d1f);
    margin: 0 0 12px;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.bpc-footer .footer-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.bpc-footer .footer-menu li {
    margin-bottom: 8px;
}

.bpc-footer .footer-menu a {
    color: var(--bspc-text-secondary);
    text-decoration: none;
    transition: color 0.2s ease;
}

.bpc-footer .footer-menu a:hover {
    color: var(--bspc-text-primary);
    text-decoration: underline;
}

@media (max-width: 767px) {
    .bpc-footer {
        padding: 40px 0 20px;
        text-align: left;
    }
    .bpc-footer-grid {
        display: block;
    }
    .bpc-footer-brand {
        margin-bottom: 30px;
        padding-bottom: 20px;
        border-bottom: 1px solid var(--bspc-border-light);
    }
    .bpc-footer-links-wrapper {
        display: block;
    }
    .bpc-footer .footer-col {
        border-bottom: 1px solid var(--bspc-border-light);
    }
    .bpc-footer .footer-col-title {
        margin: 0;
        padding: 14px 0;
        cursor: pointer;
        position: relative;
        display: flex;
        justify-content: space-between;
        align-items: center;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
    }
    .bpc-footer .footer-col-title::after {
        content: '+';
        font-size: 16px;
        font-weight: 400;
        transition: transform 0.3s ease;
    }
    .bpc-footer .footer-col.open .footer-col-title::after {
        transform: rotate(45deg);
    }
    .bpc-footer .footer-menu {
        display: none;
        padding-bottom: 15px;
    }
    .bpc-footer .footer-col.open .footer-menu {
        display: block;
        animation: bpcFooterFadeIn 0.3s ease;
    }
}

/* [Theme Architect] Prefisso keyframes per evitare collisioni tra CSS caricati su pagine diverse. */
@keyframes bpcFooterFadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

.bpc-footer-bottom {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid var(--bspc-border-light);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}
.bpc-footer .footer-legal {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}
.bpc-footer .copyright {
    margin: 0;
    font-size: 12px;
    color: #999;
}
.bpc-footer .legal-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 15px;
}
.bpc-footer .legal-menu a {
    color: var(--bspc-text-secondary);
    text-decoration: none;
    font-size: 12px;
    padding-right: 15px;
    border-right: 1px solid #d2d2d7;
    line-height: 1;
}
.bpc-footer .legal-menu li:last-child a {
    border-right: none;
    padding-right: 0;
}
.bpc-footer .legal-menu a:hover {
    text-decoration: underline;
}
@media (max-width: 768px) {
    .bpc-footer-bottom {
        flex-direction: column;
        align-items: flex-start;
    }
    .bpc-footer .footer-legal {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    .bpc-footer .legal-menu {
        flex-wrap: wrap;
    }
}
/* ------------------------------------------------------------------
   Footer overrides (kept)
------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */
/* Existing footer.css overrides (kept) */
/* -------------------------------------------------------------------------- */

/*
 * Footer component
 *
 * Core styling is intentionally kept in /core/global.css (legacy merged)
 * to avoid duplications.
 * This file contains only safe, component-scoped micro-fixes.
 */

/* When the mobile accordion is active, titles become interactive. */
.bpc-footer .footer-col-title[role="button"] {
  cursor: pointer;
}