/* --- Wrapper per la checkbox --- */
.pejanken-checkbox-wrapper {
    margin-top: 20px;
    font-family: Arial, sans-serif;
    font-size: 14px;
}

.pejanken-checkbox-wrapper label {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pejanken-trade-row {
    display: flex; /* Abilita Flexbox */
    align-items: center; /* Allinea verticalmente i contenuti */
    gap: 20px; /* Spazio tra i due div */
}

.pejanken-card {
    flex: 1; /* Ogni card occupa lo stesso spazio */
    text-align: center; /* Centra il contenuto all'interno delle card */
    max-width:300px;
}



#pejanken-card-status,
#pejanken-card-tradeable,
#pejanken-card-sellable {
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.pejanken-checkbox-label {
    color: #333;
    font-weight: bold;
    font-size: 16px;
    cursor: pointer;
}

/* --- Stato della card: Disponibile / Non Disponibile --- */
/*GRG inizia forse togli*/
.pejanken-in-stock-card, .pejanken-in-stock-sellable {
    color: #4CAF50;
    font-weight: bold;
    border: 2px solid #4CAF50;
    border-radius: 10px;
    padding: 5px 10px;
    display: inline-block;
    font-size: 16px;
}

.pejanken-non-stock-card, .pejanken-non-stock-sellable {
    color: #8B0000;
    font-weight: bold;
    border: 2px solid #8B0000;
    border-radius: 10px;
    padding: 5px 10px;
    display: inline-block;
    font-size: 16px;
}
/*GRG FINE  forse togli*/

/*----- stile delle card nella visualizazione -----*/
/* Layout a lista */
.pejanken-list-view {
    display: flex;
    flex-direction: column;
    gap: 10px; /* Spazio tra le righe */
}

/* Layout a lista */
.pejanken-card-list-item {
    gap: 20px; /* Spazio tra le colonne */
    align-items: flex-start;
    padding: 10px;
    display: flex;
    width: 100%;
    margin-bottom: 20px;
    border: 1px solid #ddd;
    border-radius: 20px;
    overflow: hidden;
    /*background: #fff;*/
    background-color: #C6D7ED;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 18px 0px;
}


/* Colonna 1: Immagine */
.pejanken-card-image {
    flex: 1; /* 1/6 della larghezza */
    display: flex;
    align-items: center;
    justify-content: center;
}
.pejanken-card-image img {
    max-width: 100%;
    height: auto;
}



/* Colonna 2: Informazioni */
.pejanken-card-info {
    flex: 4; /* 3/6 della larghezza */
    gap: 10px;
    display: flex;
    flex-direction: column;
    
    padding: 10px;
    justify-content: space-between;
    background-color: #c6d7ed;
    border-radius: 15px;
}
.pejanken-card-title {
    font-size: 18px;
    font-weight: bold;
    color: #333;
}
.pejanken-card-details {
    display: flex;
    gap: 10px;
    font-size: 14px;
    color: #555;
}

/* Colonna 3: Prezzo e Azioni */
.pejanken-card-actions {
    flex: 1; /* 2/6 della larghezza */
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.pejanken-card-price {
    font-size: 20px;
    font-weight: bold;
    color: #0D0035;
}
.pejanken-card-icons {
    display: flex;
    gap: 10px;
    font-size: 20px;
}
.pejanken-card-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-weight:bold;
    color:#040E38;
}
.propose-trade-button {
    padding: 10px;
    background-color: #040e38;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

/* ---- definiamo gli stili del menu -------*/

/* ridefinisce il contenitore principale del menu di WP*/

/* Contenitore principale del menu */
.et_pb_menu_inner_container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.et_pb_menu__wrap {
    width: 100% !important; /* Forza il contenitore a occupare tutta la larghezza */
    max-width: none !important; /* Rimuovi eventuali limiti di larghezza massima */
}

.et_pb_menu__menu {
    width: 100%; /* Forza il contenitore a occupare tutta la larghezza */
    display: flex;
    justify-content: center; /* Centra orizzontalmente gli elementi */
    align-items: center; /* Allinea verticalmente gli elementi */
}

.et-menu-nav {
    width: 100%!important; /* Assicura che il menu occupi tutta la larghezza */
    display: flex;
    justify-content: center; /* Centra orizzontalmente le voci del menu */
    gap: 15px; /* Distanza tra gli elementi del menu */
}

/*personalizzo il menu principale*/
#menu-menu-home{
    width: 100%!important; /* Assicura che il menu occupi tutta la larghezza */
}

.et-menu li {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 45px;
    flex-grow: 1; /* Espandi le voci del menu per occupare lo spazio disponibile */
    text-align: center;
}

.invia-carte-button {
    /*margin-left: 40px !important;
    margin-right: 40px !important;*/
    margin-left: 5% !important;
    margin-right: 5% !important;
    padding: 8px 16px;
    background-color: #040E38;
    border: none;
    border-radius: 35px;
    cursor: pointer;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 45px;
    flex-shrink: 0; /* Impedisce al pulsante di ridursi in larghezza */
}

.et_pb_menu_0.et_pb_menu ul li.invia-carte-button a,
.et_pb_menu_1.et_pb_menu ul li.invia-carte-button a {
    color: #ffffff !important;
    padding-bottom: 18px;
    padding-top: 8px;
}

/* Stile per le voci di menu successive */
.item-menu-dopo-carte {
    display: flex;
    align-items: center;
    height: 45px;
    padding: 10px 0px;
}




/*-------- stili pulsanti scambio --------*/

/* Stile per il pulsante "Proponi uno scambio" */

#propose-trade-button {
    padding: 15px 20px;
    border-radius: 100px;
    /*background-color: #595F72;*/
    /*color: white;*/
    background-color:#040e38;
    color: #ffffff;
    border: none;
    cursor: pointer;
    font-size: 14px;
    font-family: 'Inter', Helvetica, Arial, Lucida, sans-serif !important;
    font-weight: 700;
    transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2); /* 🔥 Ombra leggera */
    padding: 14px 24px;
}

#propose-trade-button:hover {
    /*background-color: #6a6d72;
    color: #0D0035;   */
    background-color: #c6d7ed;
    color: #040e38;
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.3); /* 🔥 Aumenta l’ombra al passaggio */
}


/* 🔄 Stile per lo stato di scambio e vendita */
.pejanken-status-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-top: 10px;
}

/* ✅ Stile per stato DISPONIBILE/NON DISPONIBILE */
.pejanken-status {
    display: flex;
    align-items: center;
    gap: 8px; /* 🔥 Uniforma la distanza tra icona e testo */
    padding: 8px 12px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: bold;
    color: white;
    min-width: 340px;
    max-width: 350px;
    text-align: left; /* 🔥 Allinea il testo a sinistra */
    justify-content: flex-start; /* 🔥 Allinea contenuti all'inizio */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 🔴 Stato NON DISPONIBILE */
.pejanken-status.pejanken-non-stock {
    /*background-color: #8B0000;*/ /* Rosso */
    color: #8B0000;
}

/* 🟢 Stato DISPONIBILE */
.pejanken-status.pejanken-in-stock {
    /*background-color: #4CAF50;*/ /* Verde */
    color: #70AD47;
}

/* 🎨 Aggiunta delle icone */
.pejanken-status .pejanken-sale-icon::before,
.pejanken-status .pejanken-trade-icon::before {
    font-size: 20px;
    display: inline-block;
}

/* 🔥 Rimuove margini e padding extra sulle icone */
.pejanken-sale-icon,
.pejanken-trade-icon {
    margin: 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
}

/* 🔥 Sposta le icone più vicino al testo */
.pejanken-status .pejanken-sale-icon::before {
    content: "💰";
    margin-right: 5px; /* 🔥 Uniforma lo spazio tra icona e testo */
}

.pejanken-status .pejanken-trade-icon::before {
    content: "🔄";
    margin-right: 5px; /* 🔥 Stessa distanza per coerenza */
}
/* ------------- */

/* ---------  stili per le proposte di scambio ricevute --------- */

/* Contenitore principale della proposta di scambio */
.trade-proposal-item {
    list-style: none;
    padding: 10px;
    border-bottom: 1px solid #ddd;
    display: flex;
    flex-direction: column; /* Default per dispositivi piccoli */
    align-items: flex-start;
}

/* 🔄 Contenitore della card: allinea immagine e info in orizzontale */
/* Contenitore principale della proposta di scambio */
.trade-proposal-item {
    list-style: none;
    padding: 10px;
    border-bottom: 1px solid #ddd;
}

/* 🔄 Contenitore della card: allinea immagine e info in orizzontale */
.trade-card {
    display: flex;
    flex-wrap: wrap; /* 🔥 Permette a trade-card-actions di andare sotto */
    align-items: center;
    gap: 15px; /* 🔥 Spazio tra immagine e testo */
    width: 100%;
}

/* 🎴 Immagine della card */
.trade-card-image {
    width: 70px; /* Mantieni dimensione immagine */
    flex-shrink: 0; /* 🔥 Evita il ridimensionamento */
}

/* ℹ️ Info della card: titolo e prezzo */
.trade-card-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex-grow: 1; /* 🔥 Occupa lo spazio disponibile accanto all'immagine */
}

.trade-card-title {
    color:#0D0035;
}

/* 🎯 Pulsanti di azione: si posizionano sotto */
.trade-card-actions {
    width: 100%; /* 🔥 Occupa tutta la larghezza del contenitore padre */
    display: flex;
    justify-content: left; /* 🔥 i pulsanti a sinistra */
    margin-top: 10px;
    gap: 10px; /* 🔥 Spazio tra i pulsanti */
}

/* 🔘 Stile per i pulsanti */
.reject-all,
.accept-trade-button,
.reject-trade-button {
    padding: 8px 12px;
    border-radius: 10px;
    border: none;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s ease-in-out;
}

/* ✅ Pulsante "Accetta" */
.accept-trade-button {
    background-color: #4CAF50;
    color: white;
}

.accept-trade-button:hover {
    background-color: #45a049;
}

/* ❌ Pulsante "Rifiuta" */
.reject-all,
.reject-trade-button {
    background-color: #8B0000;
    color: white;
}
.reject-all:hover,
.reject-trade-button:hover {
    background-color: #B71C1C;
}

/* 📱 Responsività: su schermi piccoli tutto in verticale */
@media (max-width: 600px) {
    .trade-card {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .trade-card-actions {
        justify-content: center;
    }
}
/* -------------------------------------------------------------------------- */

/* ---------  stili per le proposte di scambio da fare --------- */

/* 🔄 Allinea l'immagine e il testo come nello shortcode [pejanken_trade_proposals] */
#user-cards-list {
    list-style: none;
    padding: 0;
}

/* --- Finestra Modale --- */
#trade-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    z-index: 1001;
}

#trade-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    z-index: 1000;
}

/* Stile per il pulsante "Proponi uno scambio" */

.propose-button {
    padding: 15px 20px;
    border-radius: 100px;
    background-color: #595F72;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 14px;
    font-family: 'Inter', Helvetica, Arial, Lucida, sans-serif !important;
    font-weight: 700;
    transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2); /* 🔥 Ombra leggera */
}

.propose-button:hover {
    background-color: #6a6d72;
    color: #0D0035;
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.3); /* 🔥 Aumenta l’ombra al passaggio */
}






/* stile filtri per pinterest*/
/* Stile per il contenitore dei filtri */
.pejanken-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px; /* Spaziatura tra gli elementi */
    align-items: center;
    justify-content: space-between; /* 🔥 Distribuisce gli elementi e allinea "Altro" a destra */
}

/* Stile per select e input */
.pejanken-filters select,
.pejanken-filters input {
    border-radius: 14px; /* Angoli arrotondati */
    padding: 10px; /* Spaziatura interna */
    border: 1px solid #ccc; /* Bordo sottile */
    font-size: 14px;
    outline: none;
}

/* Migliora lo stile quando sono attivi */
.pejanken-filters select:focus,
.pejanken-filters input:focus {
    border-color: #0071a1; /* Bordo blu quando selezionato */
    box-shadow: 0 0 5px rgba(0, 113, 161, 0.5);
}


/* Stile per il pulsante "Altro" */
#show-more-filters {
    background: transparent;
    border: none;
    color: #0071a1;
    font-weight: bold;
    cursor: pointer;
    font-size: 14px;
    padding: 10px;
    margin-left: auto; /* 🔥 Forza l'allineamento a destra */
}

#show-more-filters:hover {
    text-decoration: underline;
}


/* Stile per i filtri aggiuntivi */
#additional-filters {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* Nascondi i filtri aggiuntivi all'inizio */
#additional-filters.hidden {
    display: none;
}


/* Stile per il pulsante */
.pejanken-filters button {
    padding: 15px 20px;
    border-radius: 24px;
    /*background-color: #0071a1;*/
    background-color: #040e38;
    color: #ffffff;
    border: none;
    cursor: pointer;
    font-size: 14px;
}

.pejanken-filters button:hover {
    /*background-color: #005f81;*/
    background-color: #c6d7ed;
    color: #040e38;
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.3); /* 🔥 Aumenta l’ombra al passaggio */
}

/*stile per il pulsante di paginazione*/

/* Stile per i pulsanti di paginazione */
.pejanken-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}

.pejanken-pagination button {
    padding: 10px 15px;
    border-radius: 14px;
    background-color: #040E38;
    color: #c6d7ed;
    border: none;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
    
}

.pejanken-pagination button:hover {
    background-color: #c6d7ed;
    color: #040e38;
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.3);
}

.pejanken-pagination button:disabled {
    background-color: #ccc;
    cursor: not-allowed;
}

#pejanken-page-number {
    font-size: 16px;
    font-weight: bold;
    color: #040e38; /* Colore blu per evidenziare il testo */
    margin: 0 10px; /* Spaziatura tra i pulsanti e il testo */
}



/* stile per i pulsanti sotto il portfolio*/
.pejanken-action-button {
    border-radius: 14px;
    background-color:#040e38;
    color: #ffffff;
    border: none;
    cursor: pointer;
    font-size: 14px;
    font-family: 'Inter', Helvetica, Arial, Lucida, sans-serif !important;
    /*font-weight: 700;*/
    transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2); /* 🔥 Ombra leggera */
    padding: 14px 24px;
}

.pejanken-action-button:hover {
    background-color: #c6d7ed;
    color: #040e38;
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.3); /* 🔥 Aumenta l’ombra al passaggio */
}


/* --- Layout stile Pinterest --- */

/* Layout stile Pinterest */
.pejanken-pinterest-grid {
    column-count: 8; /* Numero di colonne */
    column-gap: 15px; /* Spazio tra le colonne */
    max-width: 100%; /* Larghezza massima */
    margin: 0 auto; /* Centratura */
}


/* Stile della card */
.pejanken-card-item {
    width: 100%; /* Larghezza relativa alla colonna */
    margin-bottom: 20px; /* Distanza tra le card */
    /*padding: 5px;*/
    /*border-radius: 15px;*/
    overflow: hidden;
    position: relative;
    transition: transform 0.3s ease-in-out;
    break-inside: avoid; /* Evita che le card si spezzino tra le colonne */
    background-color: #8d7739;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

/* Immagine della card */
.pejanken-card-link img {
    width: 100%; /* Larghezza dell'immagine */
    height: auto; /* Altezza proporzionale */
    display: block;
    border-radius: 15px;
}

/* Wrapper della card per includere il titolo */
.pejanken-card-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 15px;
    /*GRG Debug*/
    /*border:solid 1px black;*/
}


/* Stile del titolo */
.pejanken-card-title {
    text-align: left;
    font-size: 12px;
    font-weight: bold;
    padding: 1px 2px;
    margin-bottom: 0px;
    color: #333;
    /*background: rgba(255, 255, 255, 0.9);
    background-color: #040E38;*/
    background-color: rgba(4, 14, 56, 0.9);
    color:#F3F7FF;
    border-radius: 5px;
    width: 100%;
    word-wrap: break-word;
    display: block;
}

.pejanken-card-item:hover {
    transform: scale(1.05);
}

/* --- Overlay al passaggio del mouse --- */
.pejanken-card-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding: 10px;
}

.pejanken-card-item:hover .pejanken-card-overlay {
    opacity: 1;
}

/* --- Banda inferiore per prezzo e icone --- */

/* Banda inferiore con prezzo e icone */
.pejanken-card-footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: rgba(4, 14, 56, 0.6); /* Sfondo semitrasparente #040e38;*/
    padding: 0px 3px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 1; /* Assicura che sia sopra l'immagine */
}
/* Stile dello scambio (centrato) */
.pejanken-card-vendita-grid {
    font-size:20px;
    color: #f3f7ff;
}
/* Stile del prezzo nella griglia*/
.pejanken-card-price-grid {
    color: #fff;
    font-size: 14px;
    position: absolute;
    left: 28px; /* Posiziona il prezzo a sinistra */
}
/* Stile dello scambio (centrato) */
.pejanken-card-scambio-grid {
    color: #f3f7ff;
    font-size: 20px;
    font-weight: 900;
    position: absolute;
    left: 50%; /* Sposta l'elemento al 50% della larghezza del contenitore */
    transform: translateX(-50%); /* Centra perfettamente l'elemento */
}
.pejanken-card-price {
    color: #fff;
    font-size: 26px;
}

/* Classe generale per tutti gli stati */
span.CondNS,
span.CondMT,
span.CondNM,
span.CondEX,
span.CondGD,
span.CondLP,
span.CondPL,
span.CondPO,
span.CondSL,
span.CondGR{
    display: inline-block;
    padding: 0px 8px; /* Padding interno */
    border-radius: 5px; /* Bordi arrotondati */
    font-size: 12px; /* Dimensione del testo */
    font-weight: bold; /* Testo in grassetto */
    color: #ffffff; /* Colore del testo bianco */
    text-align: center; /* Allineamento del testo */
    text-transform: uppercase; /* Testo in maiuscolo */
    position:absolute;
    right:1px;
}

/* Stili specifici per ogni condizione */
span.CondNS {
    background-color: #F3F7FF; /* grigio chiaro */
    color: #040e38;            /* blu scuro */
}
span.CondMT {
    background-color: #87CEFA; /* Celeste chiaro */
}
span.CondNM {
    background-color: #4CAF50; /* Verde */
}
span.CondEX {
    background-color: #808000; /* verde militare */
}
span.CondGD {
    background-color:  #FFA500; /* Arancione */ /*#FFD700;  Giallo oro */
}
span.CondLP {
    background-color: #FF6347; /* Rosso aranciato */
}
span.CondPL {
    background-color: #B22222; /* Rosso scuro */
}
span.CondPO {
    background-color: #8B0000; /* Rosso molto scuro */
}
span.CondSL {
    background-color: #C0C0C0; /* argento */
}
span.CondGR {
    background-color: #FF66FF; /* viola chiaro */
}



/* Contenitore delle icone: posizioniamo sopra la banda bianca */
.pejanken-card-icons {
    /*position: absolute;*/
    bottom: 5px; /* Sposta sopra la banda bianca */
    right: 10px;
    display: flex;
    gap: 10px;
    z-index: 2; /* 🔥 Assicura che siano sopra la banda bianca */
}

/* Icone scambio e vendita */
.pejanken-sale-icon,
.pejanken-trade-icon {
    font-size: 22px; /* 🔥 Aumenta la dimensione */
    /*background: rgba(255, 255, 255, 0.9);
    padding: 8px;
    border-radius: 50%;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);*/
}

.pejanken-sale-icon {
    color: green;
}

.pejanken-trade-icon {
    color: blue;
}

/* --- Mostra/Nasconde le icone in base al parametro dello shortcode --- */
.pejanken-card-icons.hidden {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* Mostra le icone al passaggio del mouse */
.pejanken-card-item:hover .pejanken-card-icons {
    opacity: 1;
}

/* Se mostra_icone="sempre", le icone devono essere sempre visibili */
.pejanken-pinterest-grid[data-mostra-icone="sempre"] .pejanken-card-icons {
    opacity: 1 !important;
}

/* --- Mostra le icone SOLO per le card disponibili --- */
.pejanken-card-item[data-scambio="true"] .pejanken-icon.trade {
    display: inline-block;
}

.pejanken-card-item[data-vendita="true"] .pejanken-icon.sell {
    display: inline-block;
}




/* --- Stile della checkbox sulle card --- */

.pejanken-card-checkbox {
    position: relative; /* Rimuovi "absolute" per evitare conflitti */
    margin-right: 10px; /* Spazio tra la checkbox e il resto del contenuto */
    width: 20px;
    height: 20px;
    cursor: pointer;
    z-index: 10;
    flex-shrink: 0; /* Impedisce alla checkbox di ridursi in larghezza */
}

/* --- Stile della checkbox nella visualizzazione a lista --- */
.pejanken-list-view .pejanken-card-checkbox {
    margin-bottom: 10px; /* Spazio sotto la checkbox */
    align-self: flex-start; /* Allinea la checkbox all'inizio della riga */
}


/* --- Responsive --- */
@media (max-width: 1440px) {
    .pejanken-pinterest-grid {
        column-count: 6; /* Schermi medi-grandi */
    }
}
@media (max-width: 1200px) {
    .pejanken-pinterest-grid {
        column-count: 5; /* Schermi medi */
    }
}
@media (max-width: 1024px) {
    .pejanken-pinterest-grid {
        column-count: 4; /* Schermi piccoli */
    }
}
@media (max-width: 768px) {
    .pejanken-pinterest-grid {
        column-count: 2; /* Tablet */
    }
}
@media (max-width: 480px) {
    .pejanken-pinterest-grid {
        column-count: 1; /* Telefoni */
    }
}

/* --- Stile info card --- */
#pejanken-infocard {
    /*background: #f8f8f8;*/
    border-radius: 10px;
    padding: 15px;
    /*max-width: 600px;*/
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

#pejanken-infocard h4 {
    margin-bottom: 10px;
    color: #333;
    font-size: 18px;
    text-align: left;
}

.pejanken-infocard-table {
    width: 100%;
    border-collapse: collapse;
}

.pejanken-infocard-table td {
    padding: 8px 10px;
    border-bottom: 1px solid #ddd;
}

.pejanken-infocard-field {
    font-weight: bold;
    color: #595F72;
    text-align: left;
    width: 30%;
    white-space: nowrap;
}

.pejanken-infocard-value {
    color: #0D0035;
    text-align: left;
    width: 70%;
}

.pejanken-infocard-note {
    /*color: #333;*/
    /*font-weight: bold;*/
    padding: 10px;
    border-radius: 5px;
    text-align: left;
    width: 100%;
}

.pejanken-infocard-note-row td {
    padding-top: 15px;
}

/* ------------------------- */

/* -- srtili per la ricerca con autocomplete e menu header-- */

#et-top-navigation{
    padding-left: 50px!important;
    width:50%;
}


/* Stile per il contenitore del menu che contiene la barra di ricerca */
.pejanken-menu-search {
    position: relative; /* Permette ai risultati di essere posizionati correttamente */
    overflow: visible !important; /* Assicura che i risultati non vengano tagliati */
    min-width:350px;
}

/* Sovrascrivi eventuali regole CSS ereditate */
.pejanken-menu-search:hover {
    opacity: 1 !important;
    background-color: #fff !important;
    pointer-events: auto !important; /* Assicura che l'elemento sia cliccabile */
}


/* Stile per il contenitore della barra di ricerca */
.pejanken-search-container {
    position: relative;
    display: inline-block;
    width: 100%;
}

/* Stile per l'input di ricerca */
#pejanken-search-input {
    width: 100%;
    padding: 10px;
    border-radius: 14px;
    border: 1px solid #ccc;
    font-size: 16px;
}

/* Stile per i risultati dell'autocomplete */
#pejanken-search-results {
    position: absolute;
    top: 100%; /* Posiziona sotto l'input */
    left: 0;
    width: 100%;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    z-index: 1001; /* Assicura che sia sopra altri elementi */
    max-height: 300px;
    overflow-y: auto;
    visibility: visible !important;
    opacity: 1 !important;
    display: none;
}

/* Stile per gli elementi dell'autocomplete */
.autocomplete-item {
    display: flex;
    align-items: center;
    padding: 10px;
    border-bottom: 1px solid #eee;
}

.autocomplete-item:last-child {
    border-bottom: none;
}

.autocomplete-image {
    flex: 1;
    text-align: center;
}

.autocomplete-image img {
    max-width: 50px;
    max-height: 50px;
    border-radius: 5px;
}

.autocomplete-details {
    flex: 2;
    padding-left: 10px;
}

.autocomplete-details strong {
    font-size: 16px;
    color: #333;
}

.autocomplete-details span {
    font-size: 14px;
    color: #666;
}



/* Menu principale */
#top-menu-nav,
#top-menu {
    overflow: visible !important;
}

.menu-item {
    position: relative;
    overflow: visible !important;
}