con immagine */
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
display: block;
}
.gud-piante-container.gud-piante-grid .gud-item-thumbnail img {
display: block;
width: 100%;
height: 100%;
object-fit: cover; /* Questa è la chiave per coprire */
}
.gud-piante-container.gud-piante-grid .gud-item-content { /* Titolo e icona, dentro image-container */
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 10px; /* Leggermente ridotto */
z-index: 2;
background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 100%);
text-align: left;
}
.gud-piante-container.gud-piante-grid .gud-item-title {
margin-top: 0;
margin-bottom: 0;
font-size: 1.2em; /* Adattato */
color: #ffffff !important; /* Forzato bianco */
line-height: 1.2;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.gud-piante-container.gud-piante-grid .gud-item-title a {
text-decoration: none;
color: inherit;
}
/* Icona "Vedi Dettagli" (lente) all'hover */
.gud-piante-container.gud-piante-grid .gud-hover-icon {
position: absolute; /* Rispetto a .gud-pianta-item */
top: 10px; /* Posizionamento in alto a destra */
right: 10px;
width: 36px;
height: 36px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 4; /* Sopra l'overlay del titolo e l'icona cuore */
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0s linear 0.3s, background-color 0.3s ease, color 0.3s ease;
background-color: rgba(255,255,255,0.8);
border-radius: 50%;
color: #333;
}
.gud-piante-container.gud-piante-grid .gud-pianta-item:hover .gud-hover-icon {
opacity: 1;
visibility: visible;
transition-delay: 0s;
}
.gud-piante-container.gud-piante-grid .gud-hover-icon:hover {
background-color: rgba(255,255,255,1);
}
.gud-piante-container.gud-piante-grid .gud-hover-icon .gud-icon-image.dashicons {
font-size: 20px;
line-height: 1;
width: auto;
height: auto;
}
/* Stili per il wrapper del pulsante di adozione (icona cuore) */
.gud-piante-container.gud-piante-grid .gud-pianta-item .gud-adopt-hover-action {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
opacity: 0;
visibility: hidden;
transition: opacity 0.2s ease, visibility 0s linear 0.2s;
z-index: 3; /* Sopra l'immagine, sotto l'icona "vedi dettagli" se si sovrappongono */
display: flex; /* Per centrare il contenuto del pulsante se necessario */
align-items: center;
justify-content: center;
}
.gud-piante-container.gud-piante-grid .gud-pianta-item:hover .gud-adopt-hover-action {
opacity: 1;
visibility: visible;
transition-delay: 0s; /* Mostra immediatamente all'hover sulla card */
}
/* Stili per il pulsante di adozione e messaggi di stato (quando sono l'icona hover) */
.gud-adopt-hover-action .gud-support-button,
.gud-adopt-hover-action .gud-pianta-gia-sostenuta,
.gud-adopt-hover-action .gud-pianta-gia-sostenuta-icon, /* Per l'icona cuore pieno */
.gud-adopt-hover-action .gud-pianta-limite-raggiunto,
.gud-adopt-hover-action .gud-login-required {
background-color: rgba(0,0,0,0.65) !important;
color: white !important;
border: none !important;
border-radius: 50% !important;
width: 54px !important; /* Dimensione del cerchio */
height: 54px !important;
padding: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
box-shadow: 0 2px 6px rgba(0,0,0,0.3) !important;
cursor: pointer;
transition: background-color 0.2s ease;
}
.gud-adopt-hover-action .gud-support-button:hover {
background-color: rgba(0,0,0,0.8) !important;
}
/* Stili per l'icona dashicon dentro il pulsante/messaggio */
.gud-adopt-hover-action .gud-support-button .dashicons-heart,
.gud-adopt-hover-action .gud-pianta-gia-sostenuta-icon .dashicons-heart {
font-size: 28px !important; /* Dimensione dell'icona cuore */
line-height: 1 !important;
width: auto;
height: auto;
}
.gud-adopt-hover-action .gud-pianta-gia-sostenuta-icon .gud-icon-filled {
/* Se si usa un'icona diversa per "già adottata", stilizzarla qui */
/* Esempio: color: #ff6b6b; per un cuore rosso pieno */
}
/* Nascondi testo per i messaggi di stato se si vuole solo l'icona (o un'icona diversa) */
.gud-adopt-hover-action .gud-pianta-gia-sostenuta,
.gud-adopt-hover-action .gud-pianta-limite-raggiunto,
.gud-adopt-hover-action .gud-login-required {
/* Se questi devono mostrare testo, andranno stilizzati diversamente.
Per ora, se appaiono (es. login richiesto), saranno un cerchio con testo.
Se si vuole un'icona specifica per questi stati, la logica in render_pulsante_adozione
dovrebbe cambiare il testo_pulsante per includere la dashicon appropriata. */
font-size: 9px; /* Testo molto piccolo se deve rimanere */
text-align: center;
line-height: 1.2;
padding: 5px !important; /* Un po' di padding per il testo */
width: auto !important; /* Adatta larghezza al testo */
height: auto !important;
min-width: 54px; /* Mantiene una dimensione minima */
border-radius: 20px !important; /* Rettangolo arrotondato per testo */
}
.gud-piante-container.gud-piante-grid .gud-card-description {
display: none; /* Nasconde la descrizione per la vista griglia */
}
.gud-piante-container.gud-piante-grid .gud-pianta-item:hover {
box-shadow: 0 8px 24px rgba(0,0,0,0.2);
transform: translateY(-2px);
}
.gud-piante-container.gud-piante-grid .gud-pianta-adottata { /* Stile per messaggio "Adottata" se necessario */
position: absolute;
top: 10px;
left: 10px;
background-color: rgba(0,0,0,0.5);
color: white;
padding: 3px 7px;
border-radius: 3px;
font-size: 0.8em;
z-index: 3;
}
/* Card "Dona una Pianta" */
.gud-piante-container.gud-piante-grid .gud-add-plant-card {
/* aspect-ratio: 1 / 1; già ereditato da .gud-pianta-item */
border: 2px dashed #a0a0a0;
background-color: #f5f5f5;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
cursor: pointer;
text-decoration: none;
transition: background-color 0.2s ease, border-color 0.2s ease;
color: #555;
}
.gud-piante-container.gud-piante-grid .gud-add-plant-card:hover {
background-color: #e9e9e9;
border-color: #888;
color: #333;
}
.gud-add-plant-card .gud-add-plant-plus-icon.dashicons {
font-size: 48px; /* Dimensione icona + */
width: 48px;
height: 48px;
line-height: 1;
margin-bottom: 8px;
color: #a0a0a0;
transition: color 0.2s ease;
}
.gud-add-plant-card:hover .gud-add-plant-plus-icon.dashicons {
color: #777;
}
.gud-add-plant-card .gud-add-plant-text {
font-size: 1em;
font-weight: 500;
}
/* --- Fine Stili Piante Grid --- */
/* --- Stili per Layout Lista (Generale per Giardini e Piante) --- */
.gud-giardini-container.gud-giardini-list .gud-giardino-item,
.gud-piante-container.gud-piante-list .gud-pianta-item {
display: flex;
gap: 20px;
margin-bottom: 25px;
padding-bottom: 25px;
border-bottom: 1px solid #eee;
align-items: flex-start; /* Allinea in alto per testi lunghi */
/* Reset delle proprietà che potrebbero causare problemi dalla vista grid */
position: static;
aspect-ratio: auto;
border-radius: 0;
overflow: visible;
background-color: transparent;
box-shadow: none;
transition: none;
max-width: none;
}
.gud-giardini-container.gud-giardini-list .gud-giardino-item:hover,
.gud-piante-container.gud-piante-list .gud-pianta-item:hover {
transform: none;
box-shadow: none;
}
.gud-giardini-container.gud-giardini-list .gud-item-thumbnail,
.gud-piante-container.gud-piante-list .gud-item-thumbnail {
flex: 0 0 80px;
width: 80px;
height: 80px;
overflow: hidden;
border-radius: 8px;
/* Reset */
position: static;
}
.gud-giardini-container.gud-giardini-list .gud-item-thumbnail img,
.gud-piante-container.gud-piante-list .gud-item-thumbnail img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
/* Reset */
transition: none;
}
.gud-giardini-container.gud-giardini-list .gud-item-thumbnail img:hover,
.gud-piante-container.gud-piante-list .gud-item-thumbnail img:hover {
transform: none;
}
.gud-giardini-container.gud-giardini-list .gud-item-content,
.gud-piante-container.gud-piante-list .gud-item-content {
flex: 1 1 auto;
display: flex;
flex-direction: column;
/* Reset */
position: static;
padding: 0;
background: none;
min-height: auto;
}
.gud-giardini-container.gud-giardini-list .gud-item-title,
.gud-piante-container.gud-piante-list .gud-item-title {
margin-top: 0;
margin-bottom: 0.5em;
/* Reset */
color: inherit !important; /* Rimuove forzatura bianco */
font-size: 1.3em; /* O dimensione standard del tema per h3 */
line-height: 1.3;
-webkit-line-clamp: unset;
-webkit-box-orient: unset;
overflow: visible;
}
.gud-giardini-container.gud-giardini-list .gud-item-title a,
.gud-piante-container.gud-piante-list .gud-item-title a {
color: inherit !important; /* Rimuove forzatura bianco */
}
.gud-giardini-container.gud-giardini-list .gud-item-excerpt,
.gud-piante-container.gud-piante-list .gud-item-excerpt {
display: block !important; /* Assicura che sia visibile */
flex-grow: 1;
margin-bottom: 1em;
font-size: 0.9em;
color: #555;
line-height: 1.5;
}
.gud-giardini-container.gud-giardini-list .gud-item-readmore.button,
.gud-piante-container.gud-piante-list .gud-item-readmore.button {
display: inline-block !important; /* Assicura che sia visibile */
margin-top: auto;
align-self: flex-start;
padding: 6px 12px;
font-size: 0.9em;
}
.gud-piante-container.gud-piante-list .gud-support-button,
.gud-piante-container.gud-piante-list .gud-pianta-adottata,
.gud-piante-container.gud-piante-list .gud-login-required {
margin-top: 10px;
align-self: flex-start;
}
/* --- Fine Stili Lista --- */
/* Stili per Dettaglio Pianta/Giardino (Shortcode [gud_dettaglio_*]) */
.gud-dettaglio {
margin-bottom: 2em;
}
.gud-dettaglio-pianta .gud-pianta-immagine,
.gud-dettaglio-giardino .gud-giardino-immagine {
margin-bottom: 1.5em;
max-width: 100%;
}
.gud-dettaglio-pianta .gud-pianta-immagine img,
.gud-dettaglio-giardino .gud-giardino-immagine img {
display: block;
max-width: 100%;
height: auto;
border-radius: 4px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.gud-dettaglio .gud-pianta-meta,
.gud-dettaglio .gud-giardino-meta {
background-color: #f9f9f9;
border: 1px solid #eee;
padding: 15px;
margin-bottom: 1.5em;
border-radius: 4px;
}
.gud-dettaglio .gud-pianta-meta p,
.gud-dettaglio .gud-giardino-meta p {
margin: 0 0 0.5em 0;
line-height: 1.5;
}
.gud-dettaglio .gud-pianta-meta strong {
margin-right: 5px;
}
.gud-dettaglio .gud-pianta-descrizione,
.gud-dettaglio .gud-giardino-descrizione {
line-height: 1.6;
margin-bottom: 1.5em;
}
.gud-dettaglio .gud-pianta-info-link {
margin-top: 1em;
font-size: 0.9em;
}
.gud-dettaglio .gud-pianta-azione {
margin-top: 1.5em;
margin-bottom: 1.5em;
}
.gud-dettaglio .gud-support-button,
.gud-dettaglio .gud-pianta-adottata,
.gud-dettaglio .gud-login-required {
display: inline-block;
padding: 10px 20px;
font-size: 1em;
}
.gud-dettaglio .gud-pianta-adottata {
background-color: #e0e0e0;
color: #555;
border: 1px solid #ccc;
border-radius: 3px;
}
/* Stili per Mappa Frontend */
/* Assicura che il contenitore wrapper della mappa possa espandersi */
.gud-map-container-wrapper {
width: 100% !important; /* Forza la larghezza al 100% del suo contenitore genitore */
max-width: none !important; /* Rimuove eventuali limiti di larghezza massima */
box-sizing: border-box; /* Buona pratica per il box model */
}
.gud-map-container {
margin-bottom: 1.5em;
width: 100%; /* Assicura che il contenitore possa essere full-width */
}
.gud-map {
border: 1px solid #ccc;
border-radius: 4px;
width: 100%; /* La mappa riempie il contenitore */
height: 100%; /* L'altezza effettiva è data dall'attributo height dello shortcode applicato a questo div */
max-height: 700px; /* O l'altezza che preferisci */
position: relative !important; /* FONDAMENTALE PER IL POSIZIONAMENTO ABSOLUTE DEI FIGLI */
}
/* Stili per i Circle Marker personalizzati della mappa */
.gud-map-circle-marker {
stroke-linecap: round; /* Rende i bordi del cerchio più smussati */
stroke-linejoin: round;
filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.4));
-webkit-filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.4)); /* Per browser più vecchi */
}
/* --- Stili per la Barra dei Controlli della Mappa --- */
/* Sovrascriviamo il posizionamento di Leaflet per centrare la barra in basso */
.gud-map .gud-map-controls-bar {
/* Modificato per posizionamento assoluto rispetto al contenitore .gud-map */
position: absolute !important;
bottom: 35px !important; /* Distanza dal fondo del contenitore mappa */
left: 50% !important;
transform: translateX(-50%) !important;
/* Resetta gli stili di posizionamento angolare di Leaflet che potrebbero interferire */
top: auto !important;
right: auto !important;
float: none !important;
margin: 0 !important; /* Rimuove margini che potrebbero interferire */
width: auto !important; /* Larghezza fissa calcolata in base ai pulsanti, gap e padding */
/* Stili di aspetto forniti dall'utente e precedenti */
background-color: #1818189C;
padding: 8px 12px;
border-radius: 30px;
box-shadow: 0 2px 8px rgba(0,0,0,0.25);
z-index: 1000; /* Sotto i popup Leaflet (che sono ~700), sopra i marker (~600) */
display: flex !important; /* Torniamo a flex ora che la larghezza è fissa */
flex-direction: row;
gap: 8px;
align-items: center;
visibility: visible !important;
opacity: 1 !important;
border: none;
}
/* Stili per i pulsanti interni, con selettore più specifico */
/* Modificato selettore per non dipendere da .leaflet-control e aggiunto !important per sovrascrivere il tema */
.gud-map .gud-map-controls-bar .gud-control-button {
background-color: #ffffff !important;
border: 1px solid #cccccc !important;
border-radius: 50% !important;
color: #333333 !important; /* Colore testo/icona di fallback */
cursor: pointer !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 42px !important;
height: 42px !important;
padding: 0 !important; /* Rimuove padding per far sì che l'immagine possa riempire meglio */
margin: 0 !important;
box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
transition: background-color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
font-size: inherit !important; /* Eredita o imposta una dimensione specifica se necessario */
line-height: 1 !important; /* Per flex, ma utile se ci fosse testo */
text-decoration: none !important;
appearance: none !important;
-webkit-appearance: none !important;
outline: none !important;
}
.gud-map .gud-map-controls-bar .gud-control-button:hover {
background-color: #f0f0f0 !important;
border-color: #bbbbbb !important;
box-shadow: 0 2px 5px rgba(0,0,0,0.15) !important;
}
/* Modificato selettore per le immagini dentro i pulsanti */
.gud-map .gud-map-controls-bar .gud-control-button img {
max-width: 30px !important;
max-height: 30px !important;
width: auto !important; /* Permette all'immagine di scalare mantenendo l'aspect ratio */
height: auto !important;
object-fit: contain !important;
display: block !important;
border-radius: 0 !important; /* Assicura che l'immagine non abbia bordi arrotondati strani */
box-shadow: none !important;
}
/* Stile per l'effetto pulsing (usato per il geolocate) */
.gud-pulsing {
animation: gudPulse 1.5s infinite ease-in-out;
}
@keyframes gudPulse { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } }
/* --- Fine Stili Barra Controlli Mappa --- */
/* --- Stili per Loghi Indicatori Layer Attivi --- */
.gud-map .gud-active-layers-indicator-container {
position: absolute;
top: 10px; /* Distanza dall'alto della mappa */
right: 10px; /* Distanza da destra della mappa */
z-index: 900; /* Sotto i controlli Leaflet (che sono z-index 1000) ma sopra i tile layer */
display: flex;
flex-direction: column; /* Loghi uno sopra l'altro */
gap: 5px; /* Spazio tra i loghi */
}
.gud-map .gud-active-layer-logo {
width: 32px; /* Dimensione desiderata per i loghi */
height: 32px;
background-color: rgba(255, 255, 255, 0.8); /* Sfondo semi-trasparente */
border-radius: 4px;
padding: 3px;
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
object-fit: contain; /* Assicura che l'immagine sia contenuta e non distorta */
}
/* Se vuoi stili specifici per ogni logo, puoi usare le classi: */
/* .gud-map .gud-plants-active-logo {} */
/* .gud-map .gud-fontanelle-active-logo {} */
/* Stili per Form Donazione (e Proposta Pianta/Giardino) */
.gud-form-donazione-container, /* Vecchio nome, mantenuto per retrocompatibilità */
.gud-form-proponi-pianta-container,
.gud-form-proponi-giardino-container {
border: 1px dotted #e0e0e0;
padding: 20px;
background-color: #333;
border-radius: 4px;
margin-bottom: 2em;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
.gud-form-donazione-container h2,
.gud-form-proponi-pianta-container h2,
.gud-form-proponi-giardino-container h2 {
margin-top: 0;
margin-bottom: 1em;
font-size: 1.6em;
text-align: center;
}
.gud-form-donazione-container .form-row,
.gud-propose-plant-actual-form .form-row, /* Specifico per il form pianta */
.gud-propose-garden-actual-form .form-row { /* Specifico per il form giardino */
margin-bottom: 18px;
}
.gud-form-donazione-container label,
.gud-propose-plant-actual-form label,
.gud-propose-garden-actual-form label {
display: block;
margin-bottom: 6px;
font-weight: 500;
color: #333;
}
.gud-form-donazione-container input[type="text"],
.gud-form-donazione-container textarea,
.gud-form-donazione-container select,
.gud-propose-plant-actual-form input[type="text"],
.gud-propose-plant-actual-form textarea,
.gud-propose-plant-actual-form select,
.gud-propose-garden-actual-form input[type="text"],
.gud-propose-garden-actual-form textarea,
.gud-propose-garden-actual-form select {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 3px;
box-sizing: border-box;
font-size: 1em;
}
.gud-form-donazione-container textarea,
.gud-propose-plant-actual-form textarea,
.gud-propose-garden-actual-form textarea {
min-height: 80px;
resize: vertical;
}
.gud-form-donazione-container .required,
.gud-propose-plant-actual-form .required,
.gud-propose-garden-actual-form .required {
color: #d9534f; /* Rosso per l'obbligatorietà */
margin-left: 3px;
font-weight: bold;
}
.gud-propose-plant-actual-form .gud-location-fieldset,
.gud-propose-garden-actual-form .gud-location-fieldset {
border: 1px solid #ddd;
padding: 15px 20px 20px;
margin-bottom: 20px;
border-radius: 4px;
background-color: #f9f9f9;
}
.gud-propose-plant-actual-form .gud-location-fieldset legend,
.gud-propose-garden-actual-form .gud-location-fieldset legend {
font-weight: bold;
padding: 0 8px;
margin-left: -8px;
font-size: 1.1em;
color: #333;
}
#gud_get_location_button,
#gud_get_garden_location_button {
margin-bottom: 10px;
padding: 8px 15px;
background-color: #5cb85c; /* Verde per azione positiva */
color: white;
border: none;
cursor: pointer;
}
#gud_get_location_button:hover,
#gud_get_garden_location_button:hover {
background-color: #4cae4c;
}
.gud-location-feedback-inline {
display: block; /* Sotto il pulsante */
margin-top: 5px;
font-style: italic;
font-size: 0.9em;
min-height: 1.2em; /* Per evitare salti di layout */
}
.gud-location-feedback-inline.gud-success { color: #28a745; }
.gud-location-feedback-inline.gud-error { color: #dc3545; }
.gud-form-donazione-container .gud-image-uploader,
.gud-propose-plant-actual-form .gud-image-uploader,
.gud-propose-garden-actual-form .gud-image-uploader {
display: flex;
align-items: flex-start; /* Allinea gli elementi in alto */
gap: 10px; /* Spazio tra anteprima e pulsanti */
}
.gud-form-donazione-container .gud-image-uploader .gud-image-preview,
.gud-propose-plant-actual-form .gud-image-uploader .gud-image-preview,
.gud-propose-garden-actual-form .gud-image-uploader .gud-image-preview {
width: 100px;
height: 100px;
border: 1px solid #ccc;
background-color: #f0f0f0;
background-size: cover;
background-position: center;
display: flex; /* Per centrare il placeholder */
align-items: center;
justify-content: center;
border-radius: 3px;
overflow: hidden; /* Per contenere l'immagine */
}
.gud-form-donazione-container .gud-image-uploader .gud-image-preview .gud-no-image-placeholder,
.gud-propose-plant-actual-form .gud-image-uploader .gud-image-preview .gud-no-image-placeholder,
.gud-propose-garden-actual-form .gud-image-uploader .gud-image-preview .gud-no-image-placeholder {
font-size: 0.85em;
color: #777;
text-align: center;
padding: 5px;
}
.gud-form-donazione-container .gud-image-uploader .gud-image-preview img,
.gud-propose-plant-actual-form .gud-image-uploader .gud-image-preview img,
.gud-propose-garden-actual-form .gud-image-uploader .gud-image-preview img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.gud-form-donazione-container .gud-image-uploader .gud-uploader-buttons,
.gud-propose-plant-actual-form .gud-image-uploader .gud-uploader-buttons,
.gud-propose-garden-actual-form .gud-image-uploader .gud-uploader-buttons {
display: flex;
flex-direction: column; /* Pulsanti uno sopra l'altro */
gap: 8px;
}
.gud-form-donazione-container .gud-image-uploader .gud-upload-button,
.gud-form-donazione-container .gud-image-uploader .gud-remove-button,
.gud-propose-plant-actual-form .gud-image-uploader .gud-upload-button,
.gud-propose-plant-actual-form .gud-image-uploader .gud-remove-button,
.gud-propose-garden-actual-form .gud-image-uploader .gud-upload-button,
.gud-propose-garden-actual-form .gud-image-uploader .gud-remove-button {
padding: 8px 12px;
}
.gud-form-donazione-container .form-submit,
.gud-propose-plant-actual-form .form-submit,
.gud-propose-garden-actual-form .form-submit {
margin-top: 25px;
text-align: center; /* Centra il pulsante di invio */
}
.gud-form-donazione-container .form-submit .button-primary,
.gud-propose-plant-actual-form .form-submit .button-primary,
.gud-propose-garden-actual-form .form-submit .button-primary {
padding: 12px 25px;
font-size: 1.1em;
}
.gud-propose-plant-actual-form #gud_giardino_destinazione_row .required {
/* L'asterisco per il giardino di destinazione è già gestito da JS */
}
.gud-feedback {
padding: 15px;
margin-bottom: 20px;
border: 1px solid transparent;
border-radius: 4px;
text-align: center;
}
.gud-feedback-success {
color: #3c763d;
background-color: #dff0d8;
border-color: #d6e9c6;
}
.gud-feedback-error {
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;
}
/* --- Stili per Modale Generico (Centrato e Migliorato) --- */
.gud-modal {
display: none;
position: fixed;
z-index: 100000;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0, 0, 0, 0.75);
align-items: center;
justify-content: center;
padding: 20px;
box-sizing: border-box;
}
.gud-modal.gud-modal-open {
display: flex;
}
.gud-modal-content {
background-color: #333;
margin: auto;
padding: 25px 30px;
border: none;
width: 100%;
max-width: 780px;
border-radius: 10px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
position: relative;
animation: gudModalFadeIn 0.3s ease-out forwards;
transform: scale(0.95);
opacity: 0;
max-height: fit-content;
overflow-y: auto;
}
.gud-modal.gud-modal-open .gud-modal-content {
transform: scale(1);
opacity: 1;
}
@keyframes gudModalFadeIn {
from {
opacity: 0;
transform: scale(0.95) translateY(15px);
}
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
.gud-modal-close {
color: #777;
position: absolute;
top: 15px;
right: 18px;
font-size: 20PX;
font-weight: bold;
line-height: 1;
background: none;
border: none;
cursor: pointer;
padding: 0;
transition: color 0.2s ease, transform 0.2s ease;
width: 100PX;
}
.gud-modal-close:hover,
.gud-modal-close:focus {
color: #333;
transform: scale(1.1);
text-decoration: none;
}
.gud-modal-content h2.gud-modal-title {
margin-top: 0;
margin-bottom: 20px;
font-size: 1.7em;
color: #2c3e50;
text-align: center;
font-weight: 600;
line-height: 1.3;
}
.gud-modal-content .gud-modal-body p {
margin-bottom: 18px;
line-height: 1.7;
color: #ffffff;
font-size: 1em;
}
.gud-modal-actions {
margin-top: 25px;
display: flex;
flex-direction: column;
gap: 12px;
}
.gud-modal-actions .button {
width: 100%;
text-align: center;
padding: 12px 18px;
font-size: 1.05em;
border-radius: 6px;
}
.gud-modal-image-container {
text-align: center;
margin-bottom: 20px;
}
.gud-modal-image {
max-width: 160px;
height: auto;
border-radius: 6px;
}
/* Stili specifici per il modale del form di donazione/proposta pianta/giardino */
#gud-donation-form-modal .gud-modal-content,
#gud-propose-garden-modal .gud-modal-content {
max-width: 780px; /* Più largo per i form */
max-height: fit-content;
}
/* Stili per il feedback nel modale */
.gud-modal .gud-feedback {
margin-top: -10px;
margin-bottom: 15px;
padding: 10px 15px;
border: 1px solid transparent;
border-radius: 4px;
font-size: 0.95em;
}
.gud-modal .gud-feedback-success {
background-color: #d4edda;
color: #155724;
border: 1px solid #c3e6cb;
}
.gud-modal .gud-feedback-error {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
/* Responsive per i modali */
@media (max-width: 600px) {
.gud-modal-content {
width: 95%;
padding: 20px 20px; /* Padding laterale ridotto */
}
.gud-modal-content h2.gud-modal-title {
font-size: 1.4em;
}
.gud-modal-actions .button {
font-size: 1em;
padding: 10px 15px;
}
}
/* Impedisce lo scroll della pagina principale quando il modale è aperto */
body.gud-modal-body-open {
overflow: hidden;
}
/* --- Fine Stili Modale Generico --- */
/* Adattamenti Responsive Generali */
@media (max-width: 768px) {
.gud-giardini-container.gud-giardini-grid {
grid-template-columns: repeat(auto-fit, minmax(110px, 240px)) !important;
}
.gud-piante-container.gud-piante-grid {
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important; /* Adattato per card "Dona" */
}
.gud-giardini-container.gud-grid-cols-1,
.gud-piante-container.gud-grid-cols-1 {
grid-template-columns: 1fr !important;
}
}
@media (max-width: 480px) {
.gud-giardini-container.gud-giardini-grid {
grid-template-columns: repeat(auto-fit, minmax(100px, 240px)) !important;
}
.gud-piante-container.gud-piante-grid {
grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)) !important; /* Adattato per card "Dona" */
}
/* General list item stacking on mobile */
.gud-giardini-container.gud-giardini-list .gud-giardino-item,
.gud-piante-container.gud-piante-list .gud-pianta-item {
flex-direction: column; /* Stack items vertically */
align-items: center; /* Center items horizontally when stacked */
}
/* General list item thumbnail on mobile */
.gud-giardini-container.gud-giardini-list .gud-item-thumbnail,
.gud-piante-container.gud-piante-list .gud-item-thumbnail {
width: 100%; /* Full width thumbnail */
aspect-ratio: 1 / 1; /* Keep aspect ratio */
flex-basis: auto;
margin-bottom: 15px; /* Space below thumbnail */
overflow: hidden;
position: static !important;
}
/* Specific styles for the GARDEN list items in the DASHBOARD on mobile */
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-giardino-item {
flex-direction: column !important;
align-items: center !important;
gap: 10px !important;
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-item-thumbnail {
width: 100% !important;
height: auto !important;
aspect-ratio: 1 / 1 !important;
flex-basis: auto !important;
margin-bottom: 10px !important;
position: static !important;
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardino-item.gud-add-item-placeholder-lista {
flex-direction: row !important;
align-items: center !important;
gap: 15px !important;
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardino-item.gud-add-item-placeholder-lista .gud-item-thumbnail.gud-placeholder-thumbnail-lista {
flex: 0 0 60px !important;
width: 60px !important;
height: 60px !important;
aspect-ratio: auto !important;
margin-bottom: 0 !important;
}
.gud-piante-container.gud-piante-list .gud-item-readmore.button,
.gud-piante-container.gud-piante-list .gud-support-button,
.gud-piante-container.gud-piante-list .gud-pianta-adottata,
.gud-piante-container.gud-piante-list .gud-login-required {
align-self: stretch;
text-align: center;
}
}
/* --- Stili Specifici per Messaggio "Nessuna Pianta" in Area Utente --- */
.gud-pagina-utente .gud-no-plants-message p {
margin-bottom: 20px;
}
body .gud-pagina-utente .gud-no-plants-message a.button.button-primary.gud-adopt-now-button,
body .gud-pagina-utente .gud-no-plants-message a.button.button-primary.gud-adopt-now-button:link,
body .gud-pagina-utente .gud-no-plants-message a.button.button-primary.gud-adopt-now-button:visited {
display: inline-block !important;
background-color: #0073aa !important;
color: #ffffff !important;
text-decoration: none !important;
border: 1px solid #0073aa !important;
border-radius: 3px !important;
cursor: pointer !important;
text-align: center !important;
padding: 6px 12px !important;
font-size: 0.9em !important;
line-height: normal !important;
box-shadow: none !important;
transition: background-color 0.2s ease-in-out;
}
body .gud-pagina-utente .gud-no-plants-message a.button.button-primary.gud-adopt-now-button:hover {
background-color: #005a87 !important;
color: #ffffff !important;
}
/* --- Stili per Layout Pagina Singola Pianta (via the_content filter) --- */
.gud-plant-details-wrapper {
margin-top: 20px;
margin-bottom: 30px;
clear: both;
}
.gud-plant-main-info-flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 25px;
margin-bottom: 25px;
}
.gud-plant-thumbnail-column {
flex: 1 1 300px;
max-width: 35%;
}
.gud-plant-thumbnail-column .gud-plant-image {
width: 100%;
aspect-ratio: 1 / 1;
object-fit: cover;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
display: block;
}
.gud-plant-thumbnail-column .gud-adopt-button,
.gud-plant-thumbnail-column .gud-plant-adopted-message,
.gud-plant-thumbnail-column .gud-login-to-adopt-message {
margin-top: 15px;
display: block;
width: 100%;
text-align: center;
}
.gud-plant-meta-details-column {
flex: 2 1 60%;
min-width: 280px;
background-color: #b88a071c;
padding: 20px;
border-radius: 20px;
}
.gud-plant-meta-details-column h2 {
margin-top: 0;
font-size: 1.8em;
margin-bottom: 15px;
color: #333;
}
.gud-plant-meta-details-column h3 {
font-size: 1.1em;
margin-top: 0;
margin-bottom: 10px;
color: #444;
font-weight: bold;
}
.gud-plant-meta-details-column p {
margin-bottom: 0.75em;
line-height: 1.65;
font-size: 0.95em;
color: #555;
}
.gud-plant-meta-details-column p strong {
color: #333;
margin-right: 6px;
}
.gud-plant-meta-details-column em {
font-style: italic;
}
.gud-plant-map-section {
margin-top: 30px;
padding-top: 20px;
padding-bottom: 80px;
border-top: 1px solid #eee;
clear: both;
}
.gud-plant-map-section h3 {
font-size: 1.6em;
margin-bottom: 15px;
color: #333;
}
#gud-plant-map-container {
height: 400px;
width: 100%;
border: 1px solid #ddd;
border-radius: 4px;
background-color: #f0f0f0;
margin-bottom: 20px;
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.gud-map-unavailable {
padding: 15px;
background-color: #f9f9f9;
border: 1px dashed #ddd;
color: #777;
text-align: center;
margin-top: 20px;
}
@media (max-width: 768px) {
.gud-plant-main-info-flex-container {
flex-direction: column;
}
.gud-plant-thumbnail-column {
max-width: 100%;
margin-bottom: 20px;
}
.gud-plant-thumbnail-column .gud-plant-image {
max-width: 400px;
margin-left: auto;
margin-right: auto;
}
.gud-plant-meta-details-column {
flex-basis: 100%;
}
}
/* --- Stili per Layout Pagina Singola Giardino --- */
.gud-giardino-details-wrapper {
margin-top: 20px;
margin-bottom: 30px;
clear: both;
}
.gud-giardino-details-wrapper > h2 {
font-size: 2.2em;
margin-bottom: 20px;
color: #333;
}
.gud-giardino-top-flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 30px;
margin-bottom: 30px;
}
.gud-giardino-image-column {
flex: 1 1 40%;
min-width: 280px;
display: flex;
/* Aggiunto per limitare la larghezza massima del contenitore immagine */
max-width: 100%; /* Default per desktop, può essere sovrascritto sotto */
flex-direction: column;
justify-content: flex-start;
}
.gud-giardino-detail-thumbnail-container {
width: 100%;
aspect-ratio: 1 / 1;
overflow: hidden;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
background-color: #f0f0f0;
/* Limita la dimensione massima del contenitore thumbnail - Aumentata a 400px */
max-width: 400px;
}
.gud-giardino-detail-thumbnail-container.gud-no-thumbnail {
display: flex;
align-items: center;
justify-content: center;
color: #888;
font-style: italic;
border: 1px dashed #ccc;
}
.gud-giardino-detail-thumbnail-container .gud-giardino-detail-image {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.gud-giardino-map-column {
flex: 1 1 55%;
min-width: 300px;
}
#gud-giardino-map-container {
height: auto;
width: 100%;
aspect-ratio: 1 / 1;
border: 1px solid #ddd;
border-radius: 4px;
background-color: #f0f0f0;
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.gud-giardino-plants-section {
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid #eee;
}
.gud-giardino-plants-section h3 {
font-size: 1.6em;
margin-bottom: 20px;
color: #333;
}
.gud-giardino-plants-section .gud-no-plants-message {
font-style: italic;
color: #777;
}
.gud-giardino-description-section {
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid #eee;
}
.gud-giardino-description-section h3 {
font-size: 1.6em;
margin-top: 0;
margin-bottom: 15px;
color: #333;
}
.gud-giardino-main-content {
line-height: 1.7;
}
.gud-giardino-main-content p:first-child {
margin-top: 0;
}
/* Rimuovo gli stili generici per .gud-giardino-meta-section che erano pensati per quando era sotto le colonne.
Gli stili specifici per quando è dentro .gud-giardino-image-column verranno aggiunti sotto.
Se questa sezione meta viene usata altrove con la vecchia struttura, questi stili potrebbero essere ancora necessari.
Per ora, li commento per evitare conflitti con il nuovo layout.
.gud-giardino-meta-section {
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid #eee;
background-color: #f8f9fa;
padding: 20px;
border-radius: 5px;
}
.gud-giardino-meta-section h3 {
font-size: 1.4em;
margin-top: 0;
margin-bottom: 10px;
color: #444;
}
.gud-giardino-meta-section p {
margin-bottom: 0.75em;
line-height: 1.6;
font-size: 0.95em;
color: #555;
}
.gud-giardino-meta-section p strong {
color: #333;
margin-right: 6px;
}
*/
/* Stili per le piante associate nella pagina dettaglio giardino */
.gud-associated-plants-list {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); /* Ridotto minmax per più colonne (obiettivo 6+) */
gap: 15px;
padding: 0;
}
.gud-associated-plant-card {
border: 1px solid #e9e9e9;
border-radius: 6px;
overflow: hidden; /* Per arrotondare l'immagine interna se necessario */
background-color: #fff;
transition: box-shadow 0.2s ease-in-out;
display: flex;
flex-direction: column;
}
.gud-associated-plant-card:hover {
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.gud-associated-plant-card-link {
text-decoration: none;
color: inherit;
display: flex;
flex-direction: column;
height: 100%; /* Per far sì che il link occupi tutta la card */
}
.gud-associated-plant-card-image-wrapper {
width: 100%;
aspect-ratio: 1 / 1; /* Immagine quadrata */
overflow: hidden;
background-color: #f0f0f0; /* Sfondo per immagini mancanti */
}
.gud-associated-plant-card-image-wrapper img {
display: block;
width: 100%;
height: 100%;
object-fit: cover; /* Immagine copre l'area */
transition: transform 0.2s ease-in-out;
}
.gud-associated-plant-card:hover .gud-associated-plant-card-image-wrapper img {
transform: scale(1.05);
}
.gud-associated-plant-card-title {
font-size: 0.85em;
line-height: 1.3;
text-align: center;
color: #333;
font-weight: 600;
padding: 8px 5px;
margin: 0;
flex-grow: 1; /* Permette al titolo di occupare spazio se la card è più alta */
display: flex;
align-items: center; /* Centra verticalmente se c'è spazio */
justify-content: center;
}
@media (max-width: 768px) {
.gud-giardino-top-flex-container {
flex-direction: column;
}
.gud-giardino-map-column,
.gud-giardino-image-column {
flex-basis: 100%;
max-width: 100%;
}
.gud-giardino-detail-thumbnail-container {
max-width: 100%;
}
#gud-giardino-map-container {
/* Mantiene l'aspect-ratio 1:1 anche su mobile, ma con una max-height */
aspect-ratio: 1 / 1;
height: auto; /* Permette all'aspect-ratio di funzionare */
max-height: 350px; /* Evita che la mappa diventi troppo alta su mobile */
}
.gud-giardino-image-column {
order: -1;
}
}
/* --- Stili per Modulo Ricerca Piante --- */
.gud-plant-search-container {
margin-bottom: 20px;
padding: 15px;
background-color: #f9f9f9;
border: 1px solid #e0e0e0;
border-radius: 4px;
}
.gud-search-main-input-group {
display: flex;
gap: 5px;
margin-bottom: 10px;
}
.gud-plant-search-term {
flex-grow: 1;
padding: 8px 10px;
border: 1px solid #ccc;
border-radius: 3px;
}
.gud-plant-search-submit {
padding: 8px 12px;
background-color: #0073aa; /* Colore primario WordPress */
color: white;
border: none;
border-radius: 3px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.gud-plant-search-submit .dashicons {
font-size: 18px;
line-height: 1;
}
.gud-plant-search-toggle-filters {
background: none;
border: 1px solid #ccc;
color: #555;
padding: 6px 10px;
cursor: pointer;
border-radius: 3px;
display: inline-flex;
align-items: center;
gap: 5px;
}
.gud-plant-search-toggle-filters .dashicons {
transition: transform 0.2s ease-in-out;
}
.gud-plant-search-toggle-filters[aria-expanded="true"] .dashicons {
transform: rotate(180deg);
}
.gud-plant-search-advanced-filters {
padding: 15px;
border: 1px solid #e0e0e0;
border-top: none; /* Per attaccarsi bene al toggle o input group */
background-color: #fff;
border-radius: 0 0 4px 4px;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 15px;
}
.gud-filter-group {
margin-bottom: 10px;
}
.gud-filter-group label {
display: block;
font-weight: bold;
margin-bottom: 5px;
}
.gud-filter-group select,
.gud-filter-group input[type="text"] { /* Se aggiungi filtri testuali */
width: 100%;
padding: 6px;
border: 1px solid #ccc;
border-radius: 3px;
}
.gud-filter-checkbox-group label {
display: block;
font-weight: normal;
margin-bottom: 3px;
}
.gud-filter-checkbox-group input[type="checkbox"] {
margin-right: 5px;
}
.gud-filter-actions {
grid-column: 1 / -1; /* Occupa tutta la larghezza */
text-align: right;
margin-top: 10px;
}
/* --- Stili per Overlay Risultati Ricerca --- */
.gud-plant-search-results-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.75);
z-index: 100000;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
box-sizing: border-box;
}
.gud-overlay-content {
background-color: #fff;
padding: 25px;
border-radius: 5px;
width: 90%;
max-width: 960px; /* O la larghezza che preferisci */
height: 85vh; /* Altezza massima */
display: flex;
flex-direction: column;
position: relative;
box-shadow: 0 5px 20px rgba(0,0,0,0.3);
}
.gud-overlay-close {
position: absolute;
top: 10px;
right: 15px;
font-size: 30px;
font-weight: bold;
color: #888;
background: none;
border: none;
cursor: pointer;
line-height: 1;
}
.gud-overlay-close:hover {
color: #333;
}
#gud-overlay-title {
margin-top: 0;
margin-bottom: 15px;
font-size: 1.6em;
color: #333;
padding-right: 30px; /* Spazio per il pulsante chiudi */
}
.gud-overlay-results-list {
flex-grow: 1;
overflow-y: auto;
margin-bottom: 15px;
/* Qui potresti riutilizzare gli stili di .gud-piante-container.gud-piante-grid */
}
.gud-overlay-results-list .gud-piante-container.gud-piante-grid {
/* Adatta le colonne per l'overlay, es. 3 o 4 */
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
}
#gud-overlay-pagination {
text-align: center;
padding-top: 15px;
border-top: 1px solid #eee;
}
#gud-overlay-pagination .page-numbers {
padding: 5px 10px;
margin: 0 2px;
border: 1px solid #ccc;
text-decoration: none;
color: #0073aa;
border-radius: 3px;
}
#gud-overlay-pagination .page-numbers.current,
#gud-overlay-pagination .page-numbers:hover {
background-color: #0073aa;
color: white;
border-color: #0073aa;
}
.gud-loading-results,
.gud-no-results,
.gud-error-results {
text-align: center;
padding: 20px;
font-size: 1.1em;
color: #555;
}
.gud-error-results {
color: #d9534f;
}
/* Blocca scroll pagina principale quando overlay è aperto */
body.gud-overlay-open {
overflow: hidden;
}
/* --- Fine Stili Ricerca --- */
/* --- Stili per Popup di Benvenuto Mappa --- */
#gud-welcome-popup-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.65);
z-index: 100000; /* Sopra tutto, inclusi i popup Leaflet */
display: flex;
align-items: flex-end; /* Allinea il contenuto in basso */
justify-content: center; /* Centra orizzontalmente */
padding: 20px;
box-sizing: border-box;
}
#gud-welcome-popup-content {
background-color: #fff;
padding: 25px 30px;
border-radius: 8px;
width: 90%;
max-width: 600px; /* Leggermente più largo per la visualizzazione in basso */
max-height: 90vh;
overflow-y: auto;
box-shadow: 0 5px 20px rgba(0,0,0,0.25);
position: relative;
text-align: center;
margin-bottom: 0; /* Rimuove eventuale margine inferiore se era centrato verticalmente */
}
#gud-welcome-popup-close {
position: absolute;
top: 10px;
right: 15px;
font-size: 28px;
font-weight: bold;
color: #aaa;
background: none;
border: none;
cursor: pointer;
line-height: 1;
padding: 0;
}
#gud-welcome-popup-close:hover {
color: #333;
}
#gud-welcome-popup-content h2 {
margin-top: 0;
margin-bottom: 15px;
font-size: 1.8em;
color: #333;
}
.gud-welcome-popup-image {
max-width: 100%;
height: auto;
max-height: 200px; /* Limita altezza immagine */
margin-bottom: 15px;
border-radius: 4px;
}
.gud-welcome-popup-message {
margin-bottom: 20px;
font-size: 1.05em;
line-height: 1.6;
color: #555;
text-align: left;
}
#gud-welcome-popup-understand.button {
display: inline-block;
padding: 10px 25px;
font-size: 1.1em;
}
/* --- Stili Dashboard Utente --- */
.gud-pagina-utente.gud-wrap { /* Aggiunta .gud-wrap per specificità se necessario */
max-width: 960px; /* O la larghezza che preferisci per la dashboard */
margin-left: auto;
margin-right: auto;
padding-top: 20px;
padding-bottom: 20px;
}
.gud-pagina-utente .gud-dashboard-header {
display: flex;
flex-wrap: wrap; /* Permette al contenuto di andare a capo su schermi piccoli */
align-items: center;
gap: 20px;
padding: 20px;
background-color: #f8f9fa;
border: 1px solid #e0e0e0;
border-radius: 8px;
margin-bottom: 30px;
}
.gud-pagina-utente .gud-dashboard-avatar {
flex-shrink: 0;
width: 100px; /* Leggermente più piccolo */
height: 100px;
border-radius: 50%;
overflow: hidden;
border: 3px solid #fff;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.gud-pagina-utente .gud-dashboard-avatar img.gud-avatar { /* Classe aggiunta a get_avatar */
width: 100%;
height: 100%;
object-fit: cover;
}
.gud-pagina-utente .gud-dashboard-welcome {
flex-grow: 1;
}
.gud-pagina-utente .gud-dashboard-welcome h1 {
margin-top: 0;
margin-bottom: 5px;
font-size: 2em;
color: #333;
}
.gud-pagina-utente .gud-dashboard-nome-giardiniere {
font-size: 1.1em;
color: #555;
margin-bottom: 10px;
}
.gud-pagina-utente .gud-dashboard-nav a,
.gud-pagina-utente .gud-dashboard-nav .gud-logout-link {
margin-right: 15px;
text-decoration: none;
color: #0073aa;
font-size: 0.9em;
}
.gud-pagina-utente .gud-dashboard-nav a:hover,
.gud-pagina-utente .gud-dashboard-nav .gud-logout-link:hover {
text-decoration: underline;
}
.gud-pagina-utente .gud-dashboard-crea-contenuto, /* Rinominato da azioni-rapide */
.gud-pagina-utente .gud-dashboard-piante-sostenute,
.gud-pagina-utente .gud-dashboard-giardini-gestiti,
.gud-pagina-utente .gud-dashboard-proposte-recenti {
margin-bottom: 30px;
padding-bottom: 20px;
border-bottom: 1px dashed #eee;
clear: both; /* Aggiunto per evitare sovrapposizioni se le card sono float */
}
.gud-pagina-utente .gud-dashboard-crea-contenuto:last-child,
.gud-pagina-utente .gud-dashboard-piante-sostenute:last-child,
.gud-pagina-utente .gud-dashboard-giardini-gestiti:last-child,
.gud-pagina-utente .gud-dashboard-proposte-recenti:last-child {
border-bottom: none;
margin-bottom: 0;
}
.gud-pagina-utente .gud-dashboard-crea-contenuto h2, /* Rinominato */
.gud-pagina-utente .gud-dashboard-piante-sostenute h2,
.gud-pagina-utente .gud-dashboard-giardini-gestiti h2,
.gud-pagina-utente .gud-dashboard-proposte-recenti h2 {
font-size: 1.3em; /* Titoli sezioni rimpiccioliti */
margin-top: 0;
margin-bottom: 12px; /* Leggermente ridotto */
color: #444;
}
.gud-pagina-utente .gud-azioni-container {
display: flex;
gap: 15px;
flex-wrap: wrap;
}
/* Stili per i quadratini "Aggiungi" nella sezione "Crea Nuovo Contenuto" */
.gud-pagina-utente .gud-dashboard-crea-contenuto .gud-azione-quadrato {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 120px;
height: 120px;
border: 2px dashed #ccc;
border-radius: 8px;
text-decoration: none;
color: #555;
transition: all 0.2s ease-in-out;
text-align: center;
padding: 10px;
box-sizing: border-box;
background-color: transparent; /* Sfondo trasparente */
}
.gud-pagina-utente .gud-dashboard-crea-contenuto .gud-azione-quadrato:hover {
border-color: #888;
color: #333;
background-color: rgba(0,0,0,0.03); /* Leggero hover */
}
.gud-pagina-utente .gud-dashboard-crea-contenuto .gud-azione-quadrato .gud-azione-icon {
width: 48px; /* Dimensione per l'immagine */
height: 48px; /* Dimensione per l'immagine */
margin-bottom: 8px;
display: flex;
align-items: center;
justify-content: center;
}
.gud-pagina-utente .gud-dashboard-crea-contenuto .gud-azione-quadrato .gud-azione-icon img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
}
/* === Stili Popup Leaflet (Generali e Giardino) - RIPRISTINATI DA BACKUP e RIDOTTI === */
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) {
border-radius: 6px !important;
box-shadow: 0 2px 8px rgba(0,0,0,0.12);
background-color: #aedc07;
width: auto !important;
height: auto !important;
min-width: 180px !important;
max-width: 280px !important; /* Ridotto da 320px */
}
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .leaflet-popup-content {
margin: 0 !important;
padding: 0 !important;
width: 260px !important; /* Ridotto da 300px */
line-height: 1.4;
}
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-popup-image {
display: block;
width: 100%;
height: auto;
max-height: 130px; /* Ridotto da 150px */
object-fit: cover;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-popup-text-content {
padding: 8px 10px 10px; /* Ridotto */
font-size: 16px; /* Ridotto da 19px */
}
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-popup-text-content strong {
display: block;
margin-bottom: 4px;
font-size: 16px; /* Ridotto da 19px */
color: #333;
}
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-popup-text-content a {
color: #0073aa;
text-decoration: none;
}
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-popup-text-content a:hover {
text-decoration: underline;
}
.leaflet-popup-tip-container:not(.gud-plant-leaflet-popup .leaflet-popup-tip-container) .leaflet-popup-tip {
background: #aedc07;
}
.leaflet-popup-bottom-tip:not(.gud-plant-leaflet-popup .leaflet-popup-bottom-tip) { border-top-color: #aedc07; }
.leaflet-popup-top-tip:not(.gud-plant-leaflet-popup .leaflet-popup-top-tip) { border-bottom-color: #aedc07; }
.leaflet-popup-left-tip:not(.gud-plant-leaflet-popup .leaflet-popup-left-tip) { border-right-color: #aedc07; }
.leaflet-popup-right-tip:not(.gud-plant-leaflet-popup .leaflet-popup-right-tip) { border-left-color: #aedc07; }
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-popup-link {
display: inline-block;
margin-bottom: 6px;
font-size: 0.85em;
}
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-toggle-plants-button {
display: block;
width: 100%;
margin-top: 6px;
padding: 6px 8px;
font-size: 0.85em;
text-align: center;
cursor: pointer;
}
/* Stili per il trigger della Guida nel popup del giardino (MANTENUTO) */
.leaflet-popup-content .gud-popup-guida-trigger {
display: flex;
align-items: center;
gap: 4px;
margin-top: 6px;
font-size: 0.9em;
color: #0073aa;
cursor: pointer;
text-decoration: underline;
transition: color 0.2s ease;
}
.leaflet-popup-content .gud-popup-guida-trigger:hover {
color: #005a87;
text-decoration: none;
}
.leaflet-popup-content .gud-popup-guida-trigger .dashicons {
font-size: 16px;
width: 16px;
height: 16px;
line-height: 1;
}
/* === Fine Stili Popup Leaflet (Generali e Giardino) === */
/* === Stili per Popup Pianta Circolare (.gud-plant-leaflet-popup) === */
.gud-plant-leaflet-popup .leaflet-popup-content-wrapper {
border-radius: 50% !important;
background-color: #fff !important;
padding: 0 !important;
box-shadow: 0 2px 8px rgba(0,0,0,0.25) !important;
width: 70px !important;
height: 70px !important;
min-width: 70px !important;
max-width: 70px !important;
overflow: hidden !important;
border: 2px solid #28a745;
box-sizing: border-box;
}
.gud-plant-leaflet-popup .leaflet-popup-content {
width: 100% !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.gud-plant-leaflet-popup .gud-plant-popup-link-wrapper {
display: block;
width: 100%;
height: 100%;
text-decoration: none;
color: inherit;
border-radius: 50%;
overflow: hidden;
position: relative;
}
.gud-plant-leaflet-popup .gud-plant-popup-link-wrapper .gud-popup-image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 50%;
}
.gud-plant-leaflet-popup .gud-plant-popup-link-wrapper .gud-popup-plant-title {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-size: 10px;
color: #fff;
background-color: rgba(0, 0, 0, 0.7);
padding: 5px;
box-sizing: border-box;
white-space: normal;
overflow: hidden;
text-overflow: ellipsis;
line-height: 1.3;
opacity: 0;
transition: opacity 0.3s ease;
}
.gud-plant-leaflet-popup .leaflet-popup-content-wrapper:hover .gud-plant-popup-link-wrapper .gud-popup-plant-title {
opacity: 1;
}
.gud-plant-leaflet-popup .leaflet-popup-close-button {
display: none !important;
}
.gud-plant-leaflet-popup .leaflet-popup-tip-container {
display: block !important;
top: 68px !important;
}
.gud-plant-leaflet-popup .leaflet-popup-tip {
background: #28a745;
border-width: 18px !important;
}
.gud-plant-leaflet-popup.leaflet-popup-bottom .leaflet-popup-tip { border-top-color: #28a745 !important; border-bottom: none !important; }
.gud-plant-leaflet-popup.leaflet-popup-top .leaflet-popup-tip { border-bottom-color: #28a745 !important; border-top: none !important; }
.gud-plant-leaflet-popup.leaflet-popup-left .leaflet-popup-tip { border-right-color: #28a745 !important; border-left: none !important; }
.gud-plant-leaflet-popup.leaflet-popup-right .leaflet-popup-tip { border-left-color: #28a745 !important; border-right: none !important; }
.gud-plant-leaflet-popup.leaflet-popup-bottom .leaflet-popup-tip-container {
margin-top: 17px !important;
}
/* === Fine Stili Popup Pianta Circolare === */
/* === Stili per Indicatore di Caricamento nel Popup === */
.gud-popup-loading-content .gud-spinner {
border: 4px solid #f3f3f3;
border-top: 4px solid #aedc07;
border-radius: 50%;
width: 30px;
height: 30px;
animation: gud-spin 1s linear infinite;
margin: 0 auto 10px auto;
}
@keyframes gud-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-popup-text-content .gud-close-popup-button {
background-color: #fff;
color: #333;
border: 1px solid #ccc;
padding: 6px 12px;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.2s ease;
font-size: 0.9em;
display: inline-block;
}
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-popup-text-content .gud-close-popup-button:hover {
background-color: #f0f0f0;
}
.leaflet-popup-content-wrapper:not(.gud-plant-leaflet-popup .leaflet-popup-content-wrapper) .gud-popup-text-content p {
margin-bottom: 10px;
font-size: 1em;
}
/* === Fine Stili Indicatore di Caricamento === */
/* Modifiche Modale Video */
#gud-video-player-modal .gud-modal-title#gud-modal-title-video,
#gud-video-player-modal .gud-modal-video-garden-name {
display: none !important; /* Nasconde il titolo statico e il nome del giardino */
}
#gud-video-player-modal .gud-video-player-body {
padding: 0; /* Rimuove padding per far sì che il video tocchi i bordi del content */
}
#gud-video-player-modal #gud-garden-video-player {
width: 100%;
height: auto; /* L'altezza si adatterà all'aspect ratio */
aspect-ratio: 1 / 1;
object-fit: contain;
background-color: #000;
display: block; /* Rimuove eventuale spazio sotto */
max-height: calc(80vh - 80px); /* Lascia spazio per controlli e link Spotify */
border-radius: 6px; /* Arrotonda gli angoli del video se il contenuto del modale è arrotondato */
}
#gud-video-player-modal .gud-video-modal-actions {
text-align: center;
margin-top: 15px;
padding-bottom: 10px; /* Aggiunge un po' di spazio sotto il link Spotify */
}
#gud-video-player-modal .gud-video-modal-actions .button {
width: auto; /* Non full width */
padding: 8px 15px;
font-size: 0.95em;
}
/* === Correzione Icone Mancanti === */
.dashicons,
.dashicons-before:before {
font-family: 'Dashicons' !important; /* Assicura che usa il font corretto */
font-style: normal !important;
font-weight: normal !important;
text-decoration: inherit !important;
}
/* NUOVI STILI PER PAGINA DETTAGLIO GIARDINO - INFO SOTTO IMMAGINE */
.gud-giardino-details-wrapper .gud-giardino-image-column .gud-giardino-meta-section {
margin-top: 20px;
padding: 15px;
background-color: #aedc1329;
border-radius: 15px;
border: 1px solid #e9ecef;
max-width: 400px;
}
.gud-giardino-details-wrapper .gud-giardino-image-column .gud-giardino-meta-section h3 {
font-size: 1.3em; /* Dimensione titolo sezione */
margin-top: 0;
margin-bottom: 12px;
color: #333;
}
.gud-giardino-details-wrapper .gud-giardino-image-column .gud-giardino-meta-section ul {
list-style: none; /* Rimuove i pallini della lista */
padding-left: 0;
margin-bottom: 0;
}
.gud-giardino-details-wrapper .gud-giardino-image-column .gud-giardino-meta-section li {
margin-bottom: 8px; /* Spazio tra gli elementi della lista */
font-size: 0.95em;
color: #555;
line-height: 1.5;
}
.gud-giardino-details-wrapper .gud-giardino-image-column .gud-giardino-meta-section li strong {
color: #222;
margin-right: 5px;
}
.gud-giardino-detail-thumbnail-container.gud-no-thumbnail .gud-no-image-placeholder { /* Se usi uno span interno */
padding: 10px;
}
/* FINE NUOVI STILI PER PAGINA DETTAGLIO GIARDINO */
/* Stili per Modale Proposta Pianta/Giardino con Sfondo Scuro */
#gud-donation-form-modal .gud-modal-content,
#gud-propose-garden-modal .gud-modal-content {
background-color: #2d2d2d;
color: #f0f0f0; /* Colore testo chiaro di base */
border: 1px solid #444; /* Bordo leggermente più chiaro dello sfondo */
}
/* Sovrascrivi colore testo per elementi specifici dentro i modal scuri */
#gud-donation-form-modal .gud-modal-content h2.gud-modal-title,
#gud-propose-garden-modal .gud-modal-content h2.gud-modal-title {
color: #ffffff; /* Titolo bianco */
}
#gud-donation-form-modal .gud-modal-content label,
#gud-propose-garden-modal .gud-modal-content label {
color: #e0e0e0; /* Label leggermente meno brillanti del bianco puro */
font-weight: 500;
}
#gud-donation-form-modal .gud-modal-content p,
#gud-donation-form-modal .gud-modal-content .description,
#gud-propose-garden-modal .gud-modal-content p,
#gud-propose-garden-modal .gud-modal-content .description {
color: #cccccc; /* Testo descrittivo */
}
#gud-donation-form-modal .gud-modal-content input[type="text"],
#gud-donation-form-modal .gud-modal-content textarea,
#gud-donation-form-modal .gud-modal-content select,
#gud-propose-garden-modal .gud-modal-content input[type="text"],
#gud-propose-garden-modal .gud-modal-content textarea,
#gud-propose-garden-modal .gud-modal-content select {
background-color: #3a3a3a; /* Sfondo input più scuro */
color: #f0f0f0; /* Testo input chiaro */
border: 1px solid #555; /* Bordo input */
}
#gud-donation-form-modal .gud-modal-content input[type="text"]::placeholder,
#gud-donation-form-modal .gud-modal-content textarea::placeholder,
#gud-propose-garden-modal .gud-modal-content input[type="text"]::placeholder,
#gud-propose-garden-modal .gud-modal-content textarea::placeholder {
color: #888; /* Colore placeholder */
}
/* Stili per fieldset e legend */
#gud-donation-form-modal .gud-modal-content .gud-location-fieldset,
#gud-propose-garden-modal .gud-modal-content .gud-location-fieldset {
background-color: #333333; /* Sfondo fieldset leggermente diverso */
border-color: #4a4a4a;
}
#gud-donation-form-modal .gud-modal-content .gud-location-fieldset legend,
#gud-propose-garden-modal .gud-modal-content .gud-location-fieldset legend {
color: #e0e0e0;
}
/* Stili per pulsanti (da adattare se usano classi diverse da quelle standard di WP) */
#gud-donation-form-modal .gud-modal-content .button-primary,
#gud-propose-garden-modal .gud-modal-content .button-primary {
background-color: #aedc07; /* Colore primario GUD */
border-color: #aedc07;
color: #2d2d2d; /* Testo scuro su sfondo chiaro */
text-shadow: none;
}
#gud-donation-form-modal .gud-modal-content .button-primary:hover,
#gud-propose-garden-modal .gud-modal-content .button-primary:hover {
background-color: #9ccb06;
border-color: #9ccb06;
color: #2d2d2d;
}
#gud-donation-form-modal .gud-modal-content .button, /* Pulsanti generici */
#gud-propose-garden-modal .gud-modal-content .button {
background-color: #555;
border-color: #555;
color: #f0f0f0;
}
#gud-donation-form-modal .gud-modal-content .button:hover,
#gud-propose-garden-modal .gud-modal-content .button:hover {
background-color: #666;
border-color: #666;
color: #fff;
}
/* Stili per il nuovo uploader di immagini */
.gud-image-upload-dropzone {
border: 2px dashed #777; /* Bordo trattegiato più chiaro */
border-radius: 8px;
padding: 30px;
text-align: center;
cursor: pointer;
background-color: #3a3a3a; /* Sfondo interno dropzone */
transition: background-color 0.2s ease, border-color 0.2s ease;
margin-bottom: 15px;
position: relative; /* Per posizionare l'input file nascosto */
}
.gud-image-upload-dropzone:hover,
.gud-image-upload-dropzone.gud-dragover { /* Classe da aggiungere con JS on dragover */
background-color: #4a4a4a;
border-color: #999;
}
.gud-image-upload-dropzone .gud-upload-text {
color: #ccc;
font-size: 0.9em;
}
.gud-image-upload-dropzone .gud-upload-text strong {
color: #aedc07; /* Evidenzia "clicca per caricare" */
}
/* Stile per la nuova icona macchina fotografica */
.gud-image-upload-dropzone .gud-upload-icon.dashicons-camera {
font-size: 52px; /* Dimensione icona macchina fotografica */
color: #aedc07; /* Colore icona GUD */
margin-bottom: 30px; /* Spazio sotto l'icona */
margin-left: 47%;
display: block; /* Per permettere il margin auto se necessario per centrare */
}
.gud-image-upload-dropzone .gud-upload-text strong {
color: #aedc07; /* Evidenzia "clicca per caricare" */
}
.gud-image-upload-dropzone input[type="file"] {
/* Nasconde l'input file ma lo mantiene accessibile */
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
cursor: pointer;
z-index: 10;
}
/* Anteprima immagine sotto la dropzone */
.gud-image-upload-preview-container {
margin-top: 15px;
text-align: center; /* Centra l'anteprima se più piccola del contenitore */
}
.gud-image-upload-preview-container img {
max-width: 100%;
max-height: 200px; /* Limita altezza anteprima */
border-radius: 4px;
border: 1px solid #555; /* Bordo per l'anteprima */
display: block; /* Per margin auto se necessario */
margin: 0 auto 10px auto;
}
.gud-image-upload-preview-container .gud-remove-image-button {
/* Stile per il pulsante rimuovi immagine, se necessario */
}
/* Stili per le opzioni di upload mobile */
.gud-image-upload-dropzone .gud-mobile-upload-options {
display: none; /* Nascosto di default su desktop */
flex-direction: column;
gap: 10px;
margin-top: 15px;
align-items: center;
}
.gud-image-upload-dropzone .gud-mobile-upload-options .button,
.gud-image-upload-dropzone .gud-mobile-upload-options button { /* Per coprire entrambi i casi */
background-color: #555;
color: #f0f0f0;
border: 1px solid #666;
padding: 10px 15px;
border-radius: 5px;
text-decoration: none;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
width: 80%;
max-width: 250px;
}
.gud-image-upload-dropzone .gud-mobile-upload-options .button:hover,
.gud-image-upload-dropzone .gud-mobile-upload-options button:hover {
background-color: #666;
}
.gud-image-upload-dropzone .gud-mobile-upload-options .dashicons {
font-size: 20px;
}
/* Nascondi il vecchio uploader se presente (da decidere se rimuovere o adattare) */
/*
#gud-donation-form-modal .gud-modal-content .gud-image-uploader,
#gud-propose-garden-modal .gud-modal-content .gud-image-uploader {
display: none;
}
*/
/* ============================================= */
/* STILI SPECIFICI PER PAGINA PROFILO UTENTE GUD */
/* Aggiungere alla fine di public.css per priorità */
/* ============================================= */
/* --- Layout per "I Tuoi Giardini" nella Pagina Utente (Desktop) --- */
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-giardino-item-lista-utente {
display: flex !important;
flex-direction: row !important; /* Assicura layout orizzontale per desktop */
align-items: flex-start !important;
gap: 10px !important;
margin-bottom: 25px !important;
padding: 5px !important;
border: 1px solid #e0e0e0 !important;
border-radius: 5px !important;
/* background-color: #f9f9f9 !important; Rimossa per rendere lo sfondo trasparente */
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-item-thumbnail-container {
flex-shrink: 0 !important;
width: 80px !important; /* Larghezza fissa per thumbnail quadrata */
height: 80px !important; /* Altezza fissa per thumbnail quadrata */
overflow: hidden !important;
border-radius: 4px !important;
background-color: #e9e9e9 !important; /* Sfondo per placeholder */
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-item-thumbnail-container .gud-item-thumbnail {
display: block !important;
width: 100% !important;
height: 100% !important;
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-item-thumbnail-container .gud-item-thumbnail img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important; /* Copre l'area mantenendo le proporzioni */
display: block !important;
border-radius: 0 !important; /* L'arrotondamento è sul container */
}
/* Placeholder testuale se l'immagine del giardino manca */
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-item-thumbnail-container .gud-no-thumbnail-placeholder {
display: flex !important;
align-items: center !important;
justify-content: center !important;
font-size: 24px !important;
color: #aaa !important;
text-decoration: none !important;
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-item-thumbnail-container .gud-no-thumbnail-placeholder span {
display: block !important;
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-item-content {
flex-grow: 1 !important;
display: flex !important;
flex-direction: column !important;
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-item-title {
margin-top: 0 !important;
margin-bottom: 8px !important;
font-size: 1.1em !important;
}
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-item-excerpt {
font-size: 0.9em !important;
color: #555 !important;
line-height: 1.5 !important;
}
/* --- Stili per Placeholder Piante Sostenute in Orizzontale (Pagina Utente) --- */
.gud-pagina-utente .gud-dashboard-piante-sostenute .gud-piante-placeholder-row {
display: flex !important;
flex-direction: row !important;
gap: 5px !important; /* Spazio tra i placeholder */
justify-content: flex-start; /* Allinea a sinistra, o usa 'center' se preferisci */
flex-wrap: wrap; /* Permette di andare a capo se non c'è abbastanza spazio */
}
/* --- Placeholder per "Le Tue Piante Sostenute" (Pagina Utente) --- */
/* Stile per il singolo placeholder, ora figlio di .gud-piante-placeholder-row */
.gud-pagina-utente .gud-dashboard-piante-sostenute .gud-piante-placeholder-row .gud-pianta-item-dashboard.gud-item-placeholder {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
border: 2px dashed #d0d0d0 !important;
background-color: #f7f7f736 !important;
padding: 15px !important;
box-sizing: border-box !important;
aspect-ratio: 1 / 1 !important; /* Rende i placeholder quadrati */
border-radius: 4px !important;
min-height: 120px !important; /* Altezza minima per visibilità */
width: 120px !important; /* Larghezza fissa per i placeholder in riga */
}
.gud-pagina-utente .gud-dashboard-piante-sostenute .gud-piante-placeholder-row .gud-pianta-item-dashboard.gud-item-placeholder .gud-placeholder-thumbnail {
width: 60px !important; /* Dimensione del quadratino interno */
height: 60px !important;
background-color: #e0e0e0 !important;
border-radius: 4px !important;
display: block !important; /* Assicura che sia un blocco */
}
/* --- Thumbnail per Piante Sostenute REALI (Pagina Utente) --- */
.gud-pagina-utente .gud-dashboard-piante-sostenute .gud-piante-utente-container .gud-pianta-item-dashboard .gud-pianta-item-dashboard-thumbnail {
width: 100% !important;
aspect-ratio: 1 / 1 !important; /* Rende l'area della thumbnail quadrata */
overflow: hidden !important;
border-radius: 4px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
background-color: #f0f0f0 !important; /* Sfondo per immagini mancanti o placeholder testuali */
}
.gud-pagina-utente .gud-dashboard-piante-sostenute .gud-piante-utente-container .gud-pianta-item-dashboard .gud-pianta-item-dashboard-thumbnail img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important; /* Assicura che l'immagine copra l'area mantenendo le proporzioni */
display: block !important;
}
/* Placeholder testuale (es. prima lettera) se l'immagine della pianta manca */
.gud-pagina-utente .gud-dashboard-piante-sostenute .gud-piante-utente-container .gud-pianta-item-dashboard .gud-pianta-item-dashboard-thumbnail .gud-placeholder-text {
font-size: 24px !important;
color: #aaa !important;
}
/* --- Icone Pulsanti Azione (Pagina Utente) --- */
.gud-pagina-utente .gud-dashboard-crea-contenuto .gud-azione-quadrato .gud-azione-icon.dashicons {
font-size: 48px !important;
width: 48px !important;
height: 48px !important;
line-height: 1 !important;
color: #797b7ea8 !important
}
.gud-pagina-utente .gud-dashboard-crea-contenuto .gud-azione-quadrato:hover .gud-azione-icon.dashicons {
color: #388E3C !important;
}
/* Stile per l'anteprima immagine */
.gud-image-preview-container {
margin-top: 10px;
border: 1px solid #ddd;
padding: 5px;
background-color: #fff;
text-align: center; /* Centra l'immagine */
}
.gud-image-preview-container img {
display: block; /* Rimuove spazio extra sotto l'immagine */
margin: 0 auto; /* Centra l'immagine */
max-width: 100%; /* Assicura che l'immagine non esca dal contenitore */
height: auto;
}
.gud-image-preview-container .gud-no-image-placeholder {
display: block;
padding: 20px;
color: #999;
font-style: italic;
}
/* Stile per il pulsante Rimuovi Immagine */
.gud-remove-image-button {
margin-top: 5px;
}
/* Mostra le opzioni mobile e nascondi testo/icona desktop su schermi piccoli */
@media (max-width: 768px) {
.gud-image-upload-dropzone .gud-upload-icon,
.gud-image-upload-dropzone .gud-upload-text {
display: none; /* Nasconde icona e testo desktop su mobile */
}
.gud-image-upload-dropzone .gud-mobile-upload-options {
display: flex; /* Mostra i pulsanti mobile */
}
}
/* Stile per la mappa nei form */
.gud-form-map {
height: 250px; /* Altezza predefinita, puoi regolarla */
width: 100%;
border: 1px solid #ccc;
margin-bottom: 15px;
background-color: #eee; /* Sfondo mentre carica */
}
/* --- Stili per User Posts Stream --- */
.gud-user-posts-stream {
margin-top: 20px;
}
.gud-stream-examples-section {
margin-bottom: 30px;
padding-bottom: 20px;
border-bottom: 1px solid #e0e0e0;
}
.gud-stream-examples-section h2,
.gud-user-posts-stream > h2 { /* Titolo per i post reali */
font-size: 1.6em;
color: #333;
margin-bottom: 15px;
padding-bottom: 5px;
border-bottom: 2px solid #aedc07;
display: inline-block;
}
.gud-stream-item-example {
background-color: #f9f9f9; /* Sfondo leggermente diverso per gli esempi */
border-left: 4px solid #aedc07; /* Bordo laterale per distinguerli */
}
.gud-stream-item-example .gud-stream-meta em {
color: #555; /* Rende il nome utente fittizio leggermente diverso */
}
.gud-stream-item {
border: 1px dotted #eee;
padding: 15px;
margin-bottom: 20px;
border-radius: 4px;
background-color: #333;
}
.gud-stream-item h3 {
margin-top: 0;
margin-bottom: 8px;
font-size: 1.4em;
}
.gud-stream-meta {
font-size: 0.85em;
color: #777;
margin-bottom: 10px;
}
.gud-stream-excerpt {
font-size: 0.95em;
line-height: 1.6;
}
.gud-stream-separator {
border: 0;
height: 1px;
background-color: #ddd;
margin: 30px 0;
}
.gud-spotify-box {
background-color: #333; /* Sfondo scuro */
border-radius: 25px; /* Angoli arrotondati */
height: auto; /* Altezza automatica in base al contenuto */
padding: 25px; /* Spaziatura interna per il contenuto */
color: #ffffff; /* Colore del testo bianco per contrasto */
text-align: center; /* Centra il testo all'interno del box (opzionale) */
min-height: 150px; /* Altezza minima per renderlo visibile anche con poco contenuto */
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); /* Ombra leggera per dare profondità (opzionale) */
display: flex; /* Opzionale: per centrare verticalmente il contenuto se necessario */
flex-direction: column; /* Opzionale: per impilare gli elementi verticalmente */
justify-content: center;/* Opzionale: per centrare verticalmente il contenuto */
align-items: center; /* Opzionale: per centrare orizzontalmente il contenuto */
}
.gud-spotify-box h3 {
margin-top: 0;
margin-bottom: 15px;
color: #1DB954; /* Colore verde Spotify per il titolo */
}
.gud-spotify-box p {
margin-bottom: 20px;
line-height: 1.6;
}
.gud-spotify-box .gud-spotify-link {
display: inline-block;
padding: 10px 20px;
background-color: #1DB954; /* Colore verde Spotify per il pulsante/link */
color: #ffffff;
text-decoration: none;
border-radius: 50px; /* Pulsante arrotondato */
font-weight: bold;
transition: background-color 0.3s ease;
}
.gud-spotify-box .gud-spotify-link:hover {
background-color: #1aa34a; /* Verde più scuro all'hover */
}
/* Stili per i Controlli della Mappa e Tooltip Personalizzati */
.gud-map-controls-bar .gud-control-button {
position: relative; /* Necessario per posizionare il tooltip rispetto al pulsante */
}
.gud-map-tooltip {
visibility: hidden;
width: 160px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 8px;
position: absolute;
z-index: 1001; /* Sopra la mappa e altri elementi */
bottom: 125%; /* Posiziona sopra il pulsante */
left: 50%;
margin-left: -80px; /* Metà della larghezza per centrare */
opacity: 0;
transition: opacity 0.3s;
font-size: 0.85em;
pointer-events: none; /* Per non interferire con il click sul pulsante */
}
.gud-map-tooltip::after { /* Freccia del tooltip */
content: "";
position: absolute;
top: 100%; /* In basso al tooltip */
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
}
.gud-tooltip-parent:hover .gud-map-tooltip,
.gud-tooltip-parent:focus .gud-map-tooltip { /* Mostra anche su focus per accessibilità */
visibility: visible;
opacity: 1;
}
/* Stili per il Modale di Invito al Login */
#gud-login-required-modal .gud-modal-body {
text-align: center;
padding: 20px;
}
#gud-login-required-modal .gud-modal-body p {
margin-bottom: 20px;
font-size: 1.1em;
}
#gud-login-required-modal .gud-login-modal-button {
display: inline-block;
padding: 10px 20px;
/* Aggiungi altri stili per il pulsante se necessario */
}
/* --- Fine Stili User Posts Stream --- */
/* ============================================= */
/* FINE STILI SPECIFICI PER PAGINA PROFILO UTENTE */
/* ============================================= */
/* --- STILI PER TOUR GUIDE MAPPA --- */
#gud-tour-overlay {
/* Gli stili principali (position, top, left, width, height, backgroundColor, zIndex, display)
sono già impostati dinamicamente via JavaScript.
Puoi aggiungere qui eventuali sovrascritture o stili aggiuntivi se necessario. */
}
#gud-tour-box {
/* Gli stili principali (position, backgroundColor, padding, borderRadius, boxShadow, zIndex,
maxWidth, minWidth, display) sono già impostati dinamicamente via JavaScript. */
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; /* Font di sistema comune */
line-height: 1.5;
color: #333; /* Colore testo predefinito per il box */
}
#gud-tour-box h3#gud-tour-title {
margin-top: 0;
margin-bottom: 10px;
font-size: 1.2em; /* Leggermente più grande del testo normale */
color: #1d2327; /* Colore scuro per il titolo, simile a WP Admin */
font-weight: 600;
}
#gud-tour-box p#gud-tour-text {
margin-bottom: 0; /* Lo spazio è dato dal div di navigazione sotto */
font-size: 0.95em;
color: #444; /* Colore testo leggermente più chiaro */
}
#gud-tour-box #gud-tour-navigation {
margin-top: 20px;
display: flex;
justify-content: space-between;
align-items: center;
}
#gud-tour-box #gud-tour-navigation label {
font-size: 0.8em;
color: #555;
display: flex;
align-items: center;
font-weight: normal; /* Assicura che non sia bold se ereditato */
color: #a0a0a0;
}
/* Stile base per l'highlight (può essere usato anche su altri elementi non pulsanti) */
.gud-tour-highlight {
position: relative !important; /* Necessario per z-index */
z-index: 10000 !important; /* Sopra l'overlay, sotto il box del tour */
/* Rimosso box-shadow e border-radius da qui per gestirli in modo più specifico.
La transizione per outline può rimanere se si prevede di animarla. */
transition: outline 0.25s ease-in-out;
}
/* Stile specifico per l'highlight QUANDO applicato ai pulsanti dei controlli della mappa */
/* Questo selettore è più specifico e sovrascriverà l' `outline: none !important` del pulsante */
.gud-map .gud-map-controls-bar .gud-control-button.gud-tour-highlight {
background-color: #ffffff !important; /* Forza lo sfondo bianco del pulsante */
opacity: 1 !important; /* Forza l'opacità completa del pulsante */
border-radius: 50% !important; /* Mantiene il pulsante circolare per l'outline */
box-shadow: none !important; /* Assicura che non ci siano altri box-shadow */
outline: 3px solid rgba(255, 51, 0, 0.9) !important; /* Cerchiatura arancione, leggermente più opaca */
outline-offset: 3px !important; /* Spazio aumentato tra pulsante e cerchiatura per migliore visibilità */
}
/* Stile per il box del tour */
#gud-tour-box {
/* Stili base del box del tour, precedentemente in JS, ora centralizzati qui */
background-color: rgba(51, 51, 51, 0.95); /* Sfondo scuro, quasi opaco */
color: #f1f1f1; /* Testo bianco/molto chiaro di default */
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 15px rgba(0,0,0,0.2);
border: 1px solid #555; /* Bordo sottile per definizione su overlay scuro */
z-index: 10001 !important; /* Assicura che sia sopra l'highlight e l'overlay */
max-width: 400px;
min-width: 300px;
/* position: absolute e display: none sono gestiti da JS */
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
line-height: 1.5;
}
/* Stili per la "punta" (freccia/callout) del popup del tour */
/* La variabile --gud-tour-arrow-left è usata da JS per aggiustare la freccia su mobile */
#gud-tour-box::after {
content: "";
position: absolute;
/* Usa una variabile CSS per la posizione 'left', con un fallback a 50% */
left: var(--gud-tour-arrow-left, 50%);
transform: translateX(-50%); /* Centra la freccia orizzontalmente */
width: 0;
height: 0;
border-style: solid;
}
/* Freccia che punta verso il basso (quando il box è SOPRA l'elemento) */
#gud-tour-box.gud-tour-box-arrow-down::after {
top: 100%; /* Posiziona la base della freccia al bordo inferiore del box */
border-width: 10px 10px 0 10px; /* Crea un triangolo che punta verso il basso */
border-color: rgba(51, 51, 51, 0.95) transparent transparent transparent; /* Colore uguale allo sfondo del box */
}
/* Freccia che punta verso l'alto (quando il box è SOTTO l'elemento) */
#gud-tour-box.gud-tour-box-arrow-up::after {
bottom: 100%; /* Posiziona la base della freccia al bordo superiore del box */
border-width: 0 10px 10px 10px; /* Crea un triangolo che punta verso l'alto */
border-color: transparent transparent rgba(51, 51, 51, 0.95) transparent; /* Colore uguale allo sfondo del box */
}
/* Adattamenti Mobile per il Tour Box */
@media (max-width: 600px) {
#gud-tour-box { /* Stili del box su mobile */
max-width: 280px !important; /* Riduci la larghezza massima del box */
padding: 15px !important; /* Padding interno ridotto */
min-width: 0 !important; /* Permetti al box di restringersi ulteriormente se necessario */
}
#gud-tour-box h3#gud-tour-title { /* Titolo del tour su mobile */
font-size: 1em !important; /* Riduci la dimensione del font del titolo */
margin-bottom: 8px !important; /* Riduci il margine inferiore del titolo */
}
#gud-tour-box p#gud-tour-text { /* Testo su mobile */
font-size: 0.85em !important; /* Riduci la dimensione del font del testo */
}
#gud-tour-box #gud-tour-navigation { /* Contenitore navigazione su mobile */
margin-top: 15px !important;
flex-direction: column; /* Elementi impilati verticalmente */
align-items: center; /* Centra orizzontalmente gli elementi figli */
gap: 15px; /* Spazio tra gruppo pulsanti e checkbox */
}
#gud-tour-box .gud-tour-buttons-group { /* Gruppo pulsanti su mobile */
order: 2; /* Pulsanti dopo la checkbox su mobile */
justify-content: center; /* Centra i pulsanti al suo interno */
width: 100%;
gap: 10px; /* Spazio tra i pulsanti Salta e Avanti */
}
#gud-tour-box #gud-tour-navigation .gud-tour-skip-label { /* Checkbox "Non mostrare più" su mobile */
order: 2; /* Checkbox dopo i pulsanti su mobile */
font-size: 0.8em !important; /* Riduci font checkbox */
justify-content: center; /* Centra il testo della checkbox */
width: 25%;
text-align: center;
color: #a3a3a3;
}
#gud-tour-box #gud-tour-navigation #gud-tour-skip,
#gud-tour-box #gud-tour-navigation #gud-tour-next {
padding: 6px 8px !important; /* Padding pulsanti per mobile */
font-size: 0.8em !important; /* Testo pulsanti per mobile */
flex-grow: 0; /* Impedisce ai pulsanti di espandersi a tutta larghezza */
margin: 0 !important;
}
}
/* --- FINE STILI PER TOUR GUIDE MAPPA --- */
/* Stili Desktop per la navigazione del tour (fuori dalla media query mobile) */
#gud-tour-box #gud-tour-navigation {
display: flex;
flex-direction: column; /* Elementi impilati verticalmente */
align-items: center; /* Centra orizzontalmente gli elementi figli (gruppo pulsanti e checkbox) */
/* justify-content: center; Non più necessario per questo layout */
gap: 15px; /* Spazio verticale tra il gruppo pulsanti e la checkbox */
}
#gud-tour-box .gud-tour-buttons-group {
display: flex;
justify-content: center; /* Centra i pulsanti "Salta" e "Avanti" al suo interno */
gap: 10px; /* Spazio tra Salta e Avanti */
width: 100%; /* Permette a justify-content: center di funzionare correttamente */
}
/* Stili per i pulsanti "Salta" e "Avanti" su desktop */
#gud-tour-box .gud-tour-buttons-group .button {
font-size: 0.85em; /* Dimensione testo pulsanti desktop */
padding: 6px 12px; /* Padding pulsanti desktop */
line-height: 1.4;
}
#gud-tour-box #gud-tour-navigation .gud-tour-skip-label {
font-size: 0.8em; /* Testo piccolo per la checkbox */
white-space: nowrap; /* Assicura che il testo della label non vada a capo */
}
/* Rimuovi lo stile inline `margin-right:8px;` dal pulsante #gud-tour-skip nel JS
se questo CSS per .gud-tour-buttons-group viene applicato correttamente. */
/* === STILI PER PAGINA DI REGISTRAZIONE (Template GUD Pagina Registrazione Pulita) === */
body.gud-registration-page-template {
background-color: #2c3e50; /* Stesso sfondo della pagina di login, o cambialo come preferisci */
/* Se preferisci un'immagine di sfondo:
background-image: url('../images/tuo-sfondo-registrazione.jpg');
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
*/
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 100vh;
margin: 0;
padding: 20px;
box-sizing: border-box;
color: #333; /* Colore testo di default per il contenuto del form */
}
/* Contenitore principale per la pagina di registrazione (se usi #gud-page-container nel template) */
.gud-registration-page-template #gud-page-container {
width: 100%;
max-width: 420px; /* Larghezza massima del box del form, simile al login */
background-color: #ffffff; /* Sfondo bianco per il box del form */
padding: 30px 25px 40px;
border-radius: 8px;
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
text-align: left; /* Assicura che il testo interno sia allineato a sinistra */
}
/* Stili specifici per il form generato da [gud_registration_form] */
/* Dovrai adattare i selettori se il tuo shortcode genera HTML diverso */
.gud-registration-page-template .gud-registration-form-wrapper, /* Ipotetico wrapper per il form */
.gud-registration-page-template form[id^="gud-registration-form"], /* Se il form ha un ID che inizia con... */
.gud-registration-page-template form.gud-registration-form { /* Se il form ha una classe specifica */
margin-top: 0; /* Rimuove margine se il padding è già sul container */
}
.gud-registration-page-template .gud-registration-form-wrapper h2,
.gud-registration-page-template form[id^="gud-registration-form"] h2,
.gud-registration-page-template form.gud-registration-form h2 { /* Titolo del form, se presente */
margin-top: 0;
margin-bottom: 20px;
font-size: 1.5em;
text-align: center;
color: #333;
}
.gud-registration-page-template .form-row, /* Classe comune per le righe del form WordPress */
.gud-registration-page-template .gud-form-field { /* O una classe custom del tuo form */
margin-bottom: 18px;
}
.gud-registration-page-template label {
display: block;
margin-bottom: 6px;
font-weight: 500;
color: #555;
}
.gud-registration-page-template input[type="text"],
.gud-registration-page-template input[type="email"],
.gud-registration-page-template input[type="password"],
.gud-registration-page-template input[type="url"],
.gud-registration-page-template input[type="tel"],
.gud-registration-page-template input[type="number"],
.gud-registration-page-template textarea,
.gud-registration-page-template select {
width: 100%;
padding: 10px 12px;
border: 1px solid #ccd0d4;
border-radius: 4px;
box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
background-color: #fff;
color: #32373c;
font-size: 16px;
box-sizing: border-box;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.gud-registration-page-template input[type="text"]:focus,
.gud-registration-page-template input[type="email"]:focus,
.gud-registration-page-template input[type="password"]:focus,
.gud-registration-page-template input[type="url"]:focus,
.gud-registration-page-template input[type="tel"]:focus,
.gud-registration-page-template input[type="number"]:focus,
.gud-registration-page-template textarea:focus,
.gud-registration-page-template select:focus {
border-color: #aedc07; /* Colore GUD per il focus */
box-shadow: 0 0 0 1px #aedc07;
outline: none;
}
.gud-registration-page-template .submit .button, /* Se il pulsante è in un */
.gud-registration-page-template input[type="submit"].button-primary, /* O un input type submit */
.gud-registration-page-template button[type="submit"].button-primary { /* O un button type submit */
background: #aedc07 !important;
border-color: #9ccb06 #8ab905 #8ab905 !important;
box-shadow: 0 1px 0 #8ab905 !important;
color: #2c3e50 !important;
text-decoration: none !important;
text-shadow: none !important;
border-radius: 4px !important;
padding: 10px 20px !important;
font-size: 16px !important;
font-weight: 600 !important;
width: 100%;
box-sizing: border-box;
cursor: pointer;
}
.gud-registration-page-template .submit .button:hover,
.gud-registration-page-template input[type="submit"].button-primary:hover,
.gud-registration-page-template button[type="submit"].button-primary:hover {
background: #9ccb06 !important;
border-color: #8ab905 !important;
}
/* Messaggi di errore/successo (se il tuo form li genera con classi standard) */
.gud-registration-page-template .gud-message, /* Se usi una classe custom */
.gud-registration-page-template .woocommerce-error, /* Esempio per WooCommerce */
.gud-registration-page-template .woocommerce-message {
margin-bottom: 20px;
padding: 15px;
border-radius: 4px;
border-width: 1px;
border-style: solid;
}
.gud-registration-page-template .gud-message.gud-success,
.gud-registration-page-template .woocommerce-message {
background-color: #dff0d8;
border-color: #d6e9c6;
color: #3c763d;
}
.gud-registration-page-template .gud-message.gud-error,
.gud-registration-page-template .woocommerce-error {
background-color: #f2dede;
border-color: #ebccd1;
color: #a94442;
}
/* Link "Hai già un account? Accedi" (se presente nel form di registrazione) */
.gud-registration-page-template .gud-login-link {
text-align: center;
margin-top: 20px;
font-size: 0.9em;
}
.gud-registration-page-template .gud-login-link a {
color: #f0f0f0; /* Link chiaro sullo sfondo scuro del body */
text-decoration: none;
}
.gud-registration-page-template .gud-login-link a:hover {
color: #aedc07; /* Colore GUD per hover */
text-decoration: underline;
}
/* === FINE STILI PAGINA REGISTRAZIONE === */
/*
NOTA: Per frecce laterali (sinistra/destra), dovresti aggiungere:
1. Logica JS in showStep() per determinare quando posizionare il box lateralmente e aggiungere classi come 'gud-tour-box-arrow-left' o 'gud-tour-box-arrow-right'.
2. Regole CSS corrispondenti per #gud-tour-box.gud-tour-box-arrow-left::after e #gud-tour-box.gud-tour-box-arrow-right::after,
aggiustando 'top', 'left', 'right', 'bottom', 'margin', e 'border-color' / 'border-width' per creare la freccia laterale.
Esempio per freccia a sinistra (box a destra dell'elemento):
#gud-tour-box.gud-tour-box-arrow-left::after {
right: 100%; top: 50%; margin-top: -10px;
border-width: 10px 10px 10px 0;
border-color: transparent rgba(51, 51, 51, 0.95) transparent transparent;
}
/* --- FINE STILI PER TOUR GUIDE MAPPA --- */
/* Stili per la funzionalità "Mostra tutti" nella dashboard utente */
.gud-pagina-utente .gud-dashboard-giardini-gestiti .gud-giardini-utente-container.gud-giardini-list .gud-user-gardens-list-container.collapsed .gud-giardino-item.gud-giardino-item-lista-utente:nth-child(n+5) {
display: none !important; /* Aggiunto !important e selettore più specifico */
}
.gud-user-gardens-list-container .gud-giardino-item {
/* Aggiungi uno stile per assicurare che gli elementi siano blocchi o inline-block
se necessario per il corretto funzionamento di :nth-child in alcuni layout */
display: block; /* o flex, grid-item, a seconda del tuo layout esistente */
/* Potrebbe essere necessario aggiungere altri stili per la coerenza visiva */
}
.gud-toggle-all-gardens {
margin-top: 15px;
display: block; /* O inline-block, a seconda del layout desiderato */
width: fit-content;
margin-left: auto;
margin-right: auto;
/* Aggiungi qui altri stili per il pulsante se necessario (es. padding, background, etc.) */
}