/* Reset di base */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Inter', sans-serif;
}

body {
    background-color: #f4f4f4;
    color: #333;
    line-height: 1.6;
}

/* =========================================================
   ALERT (success/error) - stile moderno, scoped a offerte
   (serve per /offerte, /visualizza_offerta, /offerte/pubblicate, /offerte/candidature)
   ========================================================= */
.alert {
    padding: 12px 14px;
    border-radius: 14px;
    margin: 12px 0;
    font-size: 0.98rem;
    line-height: 1.45;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.07);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.alert-success {
    color: #14532d;
    border-left: 5px solid #22c55e;
    background: rgba(34, 197, 94, 0.10);
}

.alert-error {
    color: #7f1d1d;
    border-left: 5px solid #ef4444;
    background: rgba(239, 68, 68, 0.10);
}

/* In /visualizza_offerta gli alert sono in .offer-header (fuori dal .container):
   allineali alla stessa larghezza del contenuto sottostante. */
.offer-header .alert {
    width: 90%;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

/* =========================================================
   OFFERTTE: nuova barra filtri minimale + modale filtri
   (scoped per non rompere il resto di offerte.css)
   ========================================================= */
:root {
    --offerte-primary: #0b5fff;
    --offerte-primary-hover: #0a53e6;
    --offerte-border: rgba(0,0,0,0.10);
}

.offerte-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.offerte-subito-form.filter-form {
    display: block;
    padding: 0;
    margin: 0 0 18px 0;
    background: transparent !important;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
    gap: 0;
    align-items: stretch;
}

.offerte-searchbar {
    width: 100%;
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 14px;
    padding: 10px;
    box-shadow: 0 12px 40px rgba(0,0,0,0.07);
    max-width: 920px;
    margin: 0; /* allineata a sinistra (non centrata) */
}

.offerte-searchbar-row {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.offerte-searchbar-field {
    flex: 1 1 420px;
    min-width: 240px;
}

.offerte-input-pill {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 14px;
    border: 1px solid var(--offerte-border);
    background: rgba(255, 255, 255, 0.92);
}

.offerte-input-pill:focus-within {
    border-color: rgba(11, 95, 255, 0.45);
    box-shadow: 0 0 0 4px rgba(11, 95, 255, 0.14);
}

.offerte-input-pill i {
    color: rgba(60,60,60,0.70);
}

.offerte-input-pill input[type="text"] {
    border: 0;
    outline: none;
    background: transparent;
    width: 100%;
    min-width: 0;
    height: 22px;
    padding: 0;
}

.offerte-searchbar-actions {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    align-items: center;
    width: 100%;
}

.offerte-searchbar-actions:has(.offerte-btn-publish) {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

/* Mobile: campo sopra, sotto riga pulsanti scorribile (contenuta, non sborda pagina) */
@media (max-width: 900px) {
    .offerte-searchbar {
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
        overflow-x: hidden;
    }
    .offerte-searchbar-row {
        flex-direction: column;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 10px;
        min-width: 0;
        max-width: 100%;
    }
    .offerte-searchbar-field {
        flex: none;
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }
    .offerte-searchbar-actions,
    .offerte-searchbar-actions:has(.offerte-btn-publish) {
        display: flex;
        flex-wrap: nowrap;
        flex: none;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        overscroll-behavior-x: contain;
        padding-bottom: 2px;
        grid-template-columns: none;
    }
    .offerte-searchbar-actions > .offerte-btn,
    .offerte-searchbar-actions > a.offerte-btn,
    .offerte-searchbar-actions > .offerte-btn-with-corner-info {
        flex: 0 0 auto;
    }
    .offerte-searchbar-actions .offerte-btn {
        width: auto;
        white-space: nowrap;
        padding: 10px 12px;
        font-size: 0.88rem;
    }
    .offerte-btn-with-corner-info {
        flex: 0 0 auto;
    }
}

@media (min-width: 901px) {
    .offerte-searchbar-row {
        flex-wrap: nowrap;
    }
    .offerte-searchbar-actions {
        width: auto;
        grid-template-columns: auto auto auto;
    }
    .offerte-searchbar-actions:has(.offerte-btn-publish) {
        grid-template-columns: auto auto auto auto;
    }
}

.offerte-btn-publish {
    background: #ffcc00 !important;
    color: #000 !important;
    border: 1px solid #e6b800;
}

@media (max-width: 600px) {
    .offerte-publish-label { display: none; }
}

.offerte-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 12px;
    padding: 10px 14px;
    height: 42px;
    font-weight: 800;
    font-size: 0.95rem;
    cursor: pointer;
    border: 1px solid transparent;
    transition: transform 120ms ease, background-color 160ms ease, border-color 160ms ease;
    white-space: nowrap;
    width: 100%;
}

.offerte-btn:hover { transform: translateY(-1px); }
.offerte-btn:active { transform: translateY(1px); }

.offerte-btn-primary {
    background: var(--offerte-primary);
    color: #fff;
    border-color: rgba(0,0,0,0.06);
}
.offerte-btn-primary:hover { background: var(--offerte-primary-hover); }

.offerte-btn-outline {
    background: rgba(255,255,255,0.85);
    border-color: rgba(0,0,0,0.14);
    color: #222;
}
.offerte-btn-outline:hover { background: rgba(255,255,255,0.95); }

.offerte-btn-save-search {
    background: #28a745;
    border-color: #28a745;
    color: #fff;
}
.offerte-btn-save-search:hover {
    background: #218838;
    border-color: #218838;
}

.offerte-save-label { font-weight: 900; font-size: 0.92rem; }
.offerte-save-label--short { display: none; }
@media (max-width: 1200px) {
    .offerte-save-label--full { display: none; }
    .offerte-save-label--short { display: inline; }
}

.offerte-filters-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(11, 95, 255, 0.12);
    border: 1px solid rgba(11, 95, 255, 0.22);
    color: rgba(11, 61, 145, 0.95);
    font-size: 0.82rem;
    font-weight: 900;
}

/* evita margin-top ereditato da .save-search-btn mobile */
.offerte-subito-form .save-search-btn { margin-top: 0 !important; }

/* Modale filtri */
.offerte-filters-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.50);
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease;
    z-index: 9998;
}
.offerte-filters-overlay.show {
    opacity: 1;
    pointer-events: auto;
}

.offerte-filters-sheet {
    position: fixed;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%) translateY(18px);
    width: min(760px, 96vw);
    /* dvh = viewport dinamico (PWA/mobile): evita che i fixed finiscano sotto UI di sistema */
    max-height: calc(100dvh - 36px);
    background: rgba(255,255,255,0.94);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(0,0,0,0.10);
    border-radius: 18px;
    box-shadow: 0 18px 60px rgba(0,0,0,0.26);
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease, transform 160ms ease;
    z-index: 9999;
    overflow: hidden;
}
.offerte-filters-sheet.show {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}

@media (max-width: 640px) {
    .offerte-filters-sheet {
        left: 0;
        right: 0;
        bottom: 0;
        width: 100vw;
        transform: translateY(18px);
        border-radius: 18px 18px 0 0;
        max-height: 100dvh;
    }
    .offerte-filters-sheet.show { transform: translateY(0); }
}

.offerte-filters-sheet-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}
.offerte-filters-sheet-title { font-size: 1.05rem; font-weight: 900; color: #222; }
.offerte-filters-sheet-close {
    border: 0;
    background: transparent;
    font-size: 1.8rem;
    line-height: 1;
    cursor: pointer;
    color: rgba(0,0,0,0.65);
    padding: 2px 8px;
}

.offerte-filters-sheet-body {
    padding: 14px;
    overflow: auto;
    overflow-x: hidden;
    max-height: calc(100dvh - 180px);
}

.offerte-filters-secondary-actions {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(0,0,0,0.08);
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

@media (max-width: 640px) {
    .offerte-filters-secondary-actions {
        justify-content: stretch;
    }
    .offerte-filters-secondary-actions .offerte-btn {
        width: 100%;
        justify-content: center;
    }
}

.offerte-filters-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    min-width: 0;
}
@media (max-width: 640px) {
    .offerte-filters-grid { grid-template-columns: 1fr; }
}

.offerte-filter-block {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}
.offerte-filter-block label,
.offerte-filter-block span {
    font-weight: 900;
    font-size: 0.9rem;
    color: rgba(20,20,20,0.85);
}

.offerte-filter-block select,
.offerte-filter-block input[type="date"],
.offerte-filter-block input[type="text"],
.offerte-filter-block input[type="number"] {
    height: 44px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,0.12);
    padding: 10px 12px;
    font-size: 0.95rem;
    background: rgba(255,255,255,0.90);
    width: 100%;
    box-sizing: border-box;
}
.offerte-filter-block input::placeholder {
    color: #94a3b8;
    font-weight: 500;
    opacity: 1;
}
.offerte-select-ph.is-placeholder {
    color: #94a3b8;
}
.offerte-select-ph option {
    color: #0f172a;
}
.offerte-filter-block select:focus,
.offerte-filter-block input:focus {
    outline: none;
    border-color: rgba(11, 95, 255, 0.45);
    box-shadow: 0 0 0 4px rgba(11, 95, 255, 0.14);
}

.offerte-filter-block-dates { grid-column: 1 / -1; }
.offerte-date-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
@media (max-width: 640px) {
    .offerte-date-row { grid-template-columns: 1fr; }
}
.offerte-filter-hint[hidden] {
    display: none !important;
}
.offerte-date-field { display: flex; flex-direction: column; gap: 6px; }

.offerte-filters-sheet-footer {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding: 12px 14px;
    border-top: 1px solid rgba(0,0,0,0.08);
}

/* Safe-area (gesture bar) on mobile app/webview.
   Fallback: mantieni comunque un padding minimo se la webview non espone env(). */
.offerte-filters-sheet-footer {
    /* 48px: fallback robusto quando la webview non espone correttamente la safe-area */
    padding-bottom: max(48px, calc(12px + env(safe-area-inset-bottom, 0px)));
}
@media (max-width: 640px) {
    .offerte-filters-sheet-footer { justify-content: stretch; align-items: stretch; }
    .offerte-filters-sheet-footer .offerte-btn,
    .offerte-filters-sheet-footer .offerte-btn-with-corner-info {
        flex: 1 1 0;
        min-width: 0;
    }
    .offerte-filters-sheet-footer .offerte-btn-with-corner-info .offerte-btn {
        width: 100%;
        justify-content: center;
    }
    .offerte-filters-sheet-footer .offerte-save-label--full { display: none; }
    .offerte-filters-sheet-footer .offerte-save-label--short { display: inline; }
}

/* Tooltip flottante (come /bandi) */
.meedico-tooltip-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.18);
    background: rgba(255,255,255,1);
    color: rgba(40,40,40,0.85);
    font-size: 0.78rem;
    font-weight: 800;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.meedico-tooltip-trigger--inline {
    align-self: center;
}

.offerte-btn-with-corner-info {
    position: relative;
    display: inline-flex;
}

.meedico-tooltip-trigger--corner {
    position: absolute;
    top: -6px;
    right: -6px;
    z-index: 2;
}

.meedico-tooltip {
    position: fixed;
    max-width: min(320px, 86vw);
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0,0,0,0.10);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 16px 50px rgba(0,0,0,0.22);
    z-index: 100000;
    opacity: 0;
    transform: translateY(6px);
    pointer-events: none;
    transition: opacity 120ms ease, transform 120ms ease;
    color: #333;
    font-size: 0.9rem;
    line-height: 1.35;
}

.meedico-tooltip.show {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.meedico-tooltip .meedico-tooltip-close {
    position: absolute;
    top: 6px;
    right: 8px;
    border: 0;
    background: transparent;
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
    color: rgba(0,0,0,0.55);
}

/* Contenitore principale */
.container {
    width: 90%;
    max-width: 1400px; /* Aumentato per far spazio alle due colonne */
    margin: 20px auto;  
    /* min-height: calc(100vh - 167px); */
    min-height: fit-content;
}

.container-dashboard {
    width: 90%;
    max-width: 1200px;
    margin: 20px auto;
    min-height: 80vh;
}

section {
    margin-top: 20px;
}

/* Titolo della pagina */
section h1 {
    text-align: center;
    font-size: 2rem;
    margin-bottom: 5px;
}

section h2 {
    text-align: center;
    font-size: 1.5rem;
    margin-bottom: 10px;
}

.subtitle-bandi {
    text-align: center;
    font-size: 0.95rem;
    margin-bottom: 20px;
    color: #555;
    line-height: 1.5;
    padding: 0 15px;
}

.subtitle-bandi a {
    color: #007bff;
    text-decoration: none;
    font-weight: bold;
}

.subtitle-bandi a:hover {
    text-decoration: underline;
}

.section-dashboard {
    color: white;
}

/* Form di ricerca - Nuovo layout */
.filter-form {
    display: flex;
    flex-direction: column; /* Colonna su mobile di default */
    gap: 15px; /* Spazio tra gli elementi principali del form */
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    align-items: center; /* Centra gli elementi verticalmente */
    max-width: 100%;
    margin: auto;
    background: rgba(255, 255, 255, 0.2) !important;  
    backdrop-filter: blur(10px);
    margin-bottom: 20px;
}

/* Stile per la barra di ricerca testuale (sempre in alto) */
#search_query {
    width: 100%;
    padding: 10px 15px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    font-size: 1rem;
    background-color: #fcfcfc;
    transition: border-color 0.3s, box-shadow 0.3s;
    height: 40px;
}

#search_query:focus {
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
    outline: none;
}

/* Pulsante di toggle per i filtri (solo desktop) */
.toggle-filters-btn {
    display: none; /* Nascosto di default, mostrato solo su desktop via JS/media query */
    background-color: #f0f0f0;
    color: #333;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 12px 20px;
    cursor: pointer;
    font-size: 0.95rem;
    font-weight: bold;
    transition: background-color 0.3s ease;
    height: 40px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    white-space: nowrap;
}

.toggle-filters-btn .toggle-icon {
    font-size: 1.1em;
    line-height: 1;
}

.toggle-filters-btn:hover {
    background-color: #e0e0e0;
}

/* Contenitore collassabile per i filtri e il bottone "Filtra" */
.filter-collapsible-content {
    width: 100%;
    overflow: hidden; /* Cruciale per la transizione di max-height */
    transition: max-height 0.3s ease-out, padding 0.3s ease-out;
    max-height: 0; /* Inizialmente collassato su mobile e desktop */
    display: flex; /* Diventa flex per i suoi figli */
    flex-direction: column; /* I suoi figli vanno a capo su mobile */
    gap: 15px; /* Spazio tra i blocchi interni */
    padding: 0; /* Rimuovi padding qui, sarà gestito dai figli */
}

/* Contenitore per i filtri scrollabili su mobile */
.scrollable-filters-wrapper {
    width: 100%;
    overflow-x: auto; /* Abilita lo scroll orizzontale su mobile */
    -webkit-overflow-scrolling: touch;
    padding-bottom: 10px; /* Spazio per la scrollbar se presente */
    flex-shrink: 0; /* Impedisce al wrapper di restringersi */
    white-space: nowrap; /* Impedisce agli elementi interni di andare a capo */
}

/* Stile per la scrollbar (solo WebKit) */
.scrollable-filters-wrapper::-webkit-scrollbar {
    height: 6px;
}

.scrollable-filters-wrapper::-webkit-scrollbar-thumb {
    background: #e0e0e0;
    border-radius: 3px;
}

.scrollable-filters-wrapper::-webkit-scrollbar-track {
    background: transparent;
}

/* Contenitore effettivo dei filtri */
    .filter-container {
        display: inline-flex; /* Usa inline-flex per consentire lo scroll degli elementi */
        /* flex-wrap: nowrap; */
        gap: 10px; /* Spazio tra i singoli filtri */
        padding: 5px 0;
        width: fit-content; /* Questo è fondamentale: il container si adatta al contenuto per permettere lo scroll */
        justify-content: flex-start;
        align-items: center;
    }

/* Gruppi di filtri (label + input/select) */
.filter-group {
    flex-shrink: 0; /* Impedisce agli elementi di restringersi su mobile */
    display: flex;
    flex-direction: column; /* Label sopra input/select su mobile */
    align-items: flex-start;
    min-width: 150px; /* Larghezza minima per ciascun elemento per lo scroll su mobile */
    padding: 0;
}

/* Per il gruppo data, vogliamo gli elementi in riga */
.filter-group.date-filter {
    flex-direction: row;
    align-items: center;
    gap: 5px;
    background: none;
    border: none;
    box-shadow: none;
    padding: 0;
}

.filter-group.date-filter label {
    margin-bottom: 0;
    font-size: 0.95rem;
    font-weight: normal;
    color: #555;
    white-space: nowrap;
    margin-right: 0;
}

/* Input e select all'interno dei gruppi - STILE UNIFORME */
.filter-group input,
.filter-group select {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    font-size: 0.9rem;
    background-color: #fff;
    transition: border-color 0.3s, box-shadow 0.3s;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23666%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13.2-5.4H18.6c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.6c0%204.8%201.8%209.2%205.4%2012.9l128.8%20128.8c3.6%203.6%207.8%205.4%2012.9%205.4s9.3-1.8%2012.9-5.4l128.8-128.8c3.6-3.6%205.4-7.8%205.4-12.9s-1.8-9.2-5.4-12.9z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 9px;
    cursor: pointer;
    height: 40px;
}

/* Stili specifici per gli input type="date" all'interno del gruppo data */
.filter-group.date-filter input[type="date"] {
    flex-grow: 1;
    width: auto;
    padding: 8px 10px;
    font-size: 0.9rem;
    min-width: 105px; /* Aumentato per "gg/mm/aaaa" */
    white-space: nowrap; /* Evita che il testo vada a capo */
}

.filter-group input:focus,
.filter-group select:focus {
    border-color: #007bff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.1);
}

/* Pulsante "Filtra" */
.apply-filters-btn,
.btn-candidati,
.btn-login-for-apply,
.clear-filters-btn {
    width: 100%; /* Occupa tutta la larghezza del form su mobile */
    padding: 12px 20px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 1.1rem;
    font-weight: bold;
    transition: background-color 0.3s ease, transform 0.2s ease;
    margin-top: 10px;
    flex-shrink: 0; /* Impedisce al bottone di restringersi */
}

.apply-filters-btn:hover,
.btn-candidati:hover,
.btn-login-for-apply:hover {
    background-color: #0056b3;
    transform: translateY(-2px);
}

/* Azioni sotto i filtri (mobile-first) */
.filter-actions-below {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 10px;
}

.clear-filters-btn{
    background-color:#888;
}

/* Su mobile i bottoni devono essere full width */
@media (max-width: 768px) {
    .filter-actions-below .apply-filters-btn,
    .filter-actions-below .save-search-btn {
        width: 100%;
        margin-top: 0; /* evita doppi margini */
    }
}

/* /offerte mobile (REELS): searchbar sempre visibile (sotto navbar) */
@media (max-width: 768px) {
    body.offerte-reels-mode .offerte-searchbar {
        position: sticky;
        top: var(--meedico-navbar-h, 0px); /* non finire sotto la navbar */
        z-index: 50;
        background: #f4f4f4;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

@media (min-width: 769px) {
    .filter-actions-below {
        flex-direction: row;
        justify-content: center;
        align-items: center;
        margin-top: 0;
        gap: 10px;
    }

    .filter-actions-below .apply-filters-btn .clear-filters-btn,
    .filter-actions-below .save-search-btn {
        width: auto;
        height: 40px;
        margin-left: 0;
    }
}

/* --- NUOVO LAYOUT A DUE COLONNE (INDEED STYLE) --- */
.page-layout-container {
    display: flex;
    flex-direction: column; /* Default: colonna per mobile */
    width: 100%;
    margin: 20px auto;
    gap: 20px; /* Spazio tra main content e sidebar */
}

/* Header di colonna (guida utente) */
.split-column-header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    padding: 14px 14px 12px;
    border-radius: 14px;
    border: 1px solid rgba(0,0,0,0.06);
    background: #f8fafc; /* opaco come lo sfondo */
    box-shadow: none;
    margin-bottom: 12px;
    position: relative;
}

.split-column-header__left {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex: 1;
}

.split-column-header__text {
    min-width: 0;
}

/* Header sticky nelle colonne scrollabili (senza evidenziazione) */
@media (min-width: 992px) {
    /* Rendi scrollabile anche la colonna sinistra (coerente con la destra),
       così il contenuto che scorre viene mascherato sotto l'header. */
    .left-column-list {
        position: sticky;
        top: 20px;
        max-height: calc(100vh - 40px);
        overflow-y: auto;
        overflow-x: hidden;
        isolation: isolate;
        border-radius: 11px; /* coerente con split-column-header */
    }

    /* Clipping coerente per tutte le colonne scrollabili */
    .right-column-details,
    .right-column-applications {
        border-radius: 14px;
    }

    /* Sticky su tutte e 3 le colonne */
    .left-column-list .split-column-header {
        position: sticky;
        top: 0;
        z-index: 6;
        overflow: hidden; /* maschera scroll sotto i bordi arrotondati */
    }

    .right-column-details .split-column-header,
    .right-column-applications .split-column-header {
        position: sticky;
        top: 0;
        z-index: 5;
        overflow: hidden; /* maschera scroll sotto i bordi arrotondati */
    }

    /* Niente layer “sotto” (creava sovrapposizioni). Lo stacco è dato dal margin-bottom. */
}

/* Hover desktop: colonna “focus” più grande, transizione smooth */
@media (min-width: 1200px) {
    .offerte-triple-layout .left-column-list,
    .offerte-triple-layout .right-column-details,
    .offerte-triple-layout .right-column-applications {
        transition: flex 0.22s ease;
    }

    .offerte-triple-layout.hover-left .left-column-list { flex: 1.25 1 0; }
    .offerte-triple-layout.hover-left .right-column-details,
    .offerte-triple-layout.hover-left .right-column-applications { flex: 0.9 1 0; }

    .offerte-triple-layout.hover-center .right-column-details { flex: 1.25 1 0; }
    .offerte-triple-layout.hover-center .left-column-list,
    .offerte-triple-layout.hover-center .right-column-applications { flex: 0.9 1 0; }

    .offerte-triple-layout.hover-right .right-column-applications { flex: 1.25 1 0; }
    .offerte-triple-layout.hover-right .left-column-list,
    .offerte-triple-layout.hover-right .right-column-details { flex: 0.9 1 0; }
}

/* Badge conteggio candidature (colonna sinistra) */
/* Riga candidatura in lista (pagina /offerte/candidature) */
.compact-candidature-meta {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #e9ecef;
    max-width: 100%;
    min-width: 0;
}

.compact-candidature-meta__sent {
    font-size: 0.9rem;
    color: #495057;
}

.compact-candidature-meta__status {
    margin-top: 8px;
}

.compact-candidature-meta__row--inline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 12px;
    min-width: 0;
}

.compact-candidature-meta__date {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    color: #495057;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.compact-candidature-meta__date i {
    color: #888;
    flex-shrink: 0;
}

.compact-candidature-meta .application-card__meta-row span {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.offer-app-count-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    background: rgba(0, 102, 204, 0.10);
    border: 1px solid rgba(0, 102, 204, 0.18);
    color: #075985;
    font-weight: 900;
    font-size: 0.78rem;
    padding: 5px 8px;
    border-radius: 999px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    pointer-events: auto;
    cursor: help;
}

/* Fallback: mostra candidature sotto dettaglio quando manca la 3ª colonna */
.applications-below-details { display: block; }
@media (min-width: 1200px) {
    .applications-below-details { display: none; }
}

.split-column-header__title {
    font-weight: 800;
    color: #0f172a;
    font-size: 1.1rem;
    line-height: 1.2;
}

.split-column-header__hint {
    margin-top: 4px;
    color: #64748b;
    font-weight: 650;
    font-size: 0.92rem;
    line-height: 1.35;
}

.split-column-header__icon {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    background: rgba(0, 102, 204, 0.08);
    color: #0066cc;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* linetta sotto, come nel titolo "secondo" */
.split-column-header::before {
    content: '';
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 0;
    height: 1px;
    background: rgba(0,0,0,0.06);
    pointer-events: none;
}

/* Contenitore destra disabilitato su mobile */
.right-column-details {
    display: none;
}

@media (min-width: 992px) { /* Desktop breakpoint */
    .page-layout-container {
        flex-direction: row; /* Due colonne su desktop */
        align-items: flex-start; /* Allinea in alto */
    }
    
    /* .left-column-list {
        flex: 0 0 40%;
        max-width: 40%;
    } */

    .right-column-details {
        display: block; /* Visibile su desktop */
        flex: 0 0 calc(60% - 20px); /* Larghezza colonna destra */
        max-width: calc(60% - 20px);
        position: sticky; /* Rende la colonna destra appiccicata mentre si scrolla a sinistra */
        /* serve anche per pseudo-elemento halo */
        isolation: isolate;
        top: 20px; /* Distanza dall'alto durante lo scroll */
        max-height: calc(100vh - 40px);
        overflow-y: auto; /* sticky + scroll interno come prima */
    overflow-x: hidden; /* evita scroll orizzontale */
    }

    /* Scrollbar colonna destra */
    .right-column-details::-webkit-scrollbar { width: 6px; }
    .right-column-details::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; }

    /* Scrollbar colonna sinistra (coerente con la destra) */
    .left-column-list::-webkit-scrollbar { width: 6px; }
    .left-column-list::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; }

    /* Firefox */
    .left-column-list,
    .right-column-details {
        scrollbar-width: thin;
        scrollbar-color: #ccc transparent;
    }
}

/* Evidenzia pannelli (stesso look di .selected-card) */
@media (min-width: 992px) {
    .right-column-details.has-selection .sticky-details,
    .right-column-applications.has-selection .sticky-details {
        border: 2px solid #007bff !important;
        transform: none !important;
        box-shadow: 0 0 10px rgba(0,123,255,0.2) !important;
        border-radius: 14px;
    }
}

/* --- TRIPLE LAYOUT (pubblicate: lista + dettaglio + candidature) --- */
.offerte-triple-layout .right-column-applications {
    display: none;
}

@media (min-width: 1200px) {
    /* Prova: tre colonne con stessa larghezza */
    .offerte-triple-layout .left-column-list,
    .offerte-triple-layout .right-column-details,
    .offerte-triple-layout .right-column-applications {
        flex: 1 1 0;
        max-width: none;
    }

    .offerte-triple-layout .right-column-applications {
        display: block;
        position: sticky;
        top: 20px;
        max-height: calc(100vh - 40px);
        overflow-y: auto;
        overflow-x: hidden;
    }

    .offerte-triple-layout .right-column-applications::-webkit-scrollbar { width: 6px; }
    .offerte-triple-layout .right-column-applications::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; }
}

/* --- Applications panel styling (coerente con card dettaglio) --- */
.applications-panel-card {
    padding: 30px;
}

.applications-panel-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eee;
}

.applications-panel-title__left {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.applications-panel-title__icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: rgba(0, 102, 204, 0.08);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #0066cc;
    flex-shrink: 0;
}

.applications-panel-title__text {
    min-width: 0;
}

.applications-panel-title__text .h {
    font-weight: 800;
    color: #0f172a;
    font-size: 1.1rem;
    line-height: 1.2;
    margin: 0;
}

.applications-panel-title__text .sub {
    margin-top: 4px;
    color: #64748b;
    font-weight: 600;
    font-size: 0.92rem;
}

.applications-panel-empty {
    padding: 18px 12px;
    color: #64748b;
    font-weight: 600;
    text-align: center;
}

.application-row-actions {
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.application-row-actions .application-status {
    color: #64748b;
    font-weight: 700;
}

.application-row-actions .application-status strong {
    color: #0f172a;
}

/* --- Per-candidatura card (coerente con job-card) --- */
.application-card {
    padding: 16px 16px 14px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255,255,255,0.94);
    box-shadow: 0 10px 28px rgba(2, 6, 23, 0.06);
    border-radius: 16px;
}

.application-card__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.application-card__who {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}

.application-card__avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
    flex: 0 0 auto;
    background: #e2e8f0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.application-card__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.application-card__avatar--initials {
    font-weight: 800;
    font-size: 0.85rem;
    color: #0a1628;
}

.application-card__who-meta {
    min-width: 0;
}

.application-card__name {
    font-weight: 800;
    color: #0f172a;
    font-size: 1.05rem;
    line-height: 1.25;
    word-break: break-word;
}

a.application-card__profile-link {
    text-decoration: none;
    color: inherit;
}

a.application-card__profile-link:hover,
a.application-card__profile-link:focus,
a.application-card__profile-link:visited {
    text-decoration: none;
    color: inherit;
}

a.application-card__name.application-card__profile-link:hover {
    color: #0066cc;
}

.application-card__spec {
    margin-top: 4px;
    font-weight: 600;
    color: #64748b;
    font-size: 0.92rem;
}

.application-card__status {
    flex-shrink: 0;
}

/* Stato pipeline: pill evidenziata (non confondere con badge profilo) */
.application-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 11px;
    border-radius: 999px;
    font-weight: 800;
    font-size: 0.75rem;
    letter-spacing: 0.02em;
    border: 1px solid transparent;
    line-height: 1.2;
    white-space: nowrap;
}

.application-status-pill--inviata {
    background: rgba(2, 132, 199, 0.14);
    color: #075985;
    border-color: rgba(2, 132, 199, 0.22);
}
.application-status-pill--vista {
    background: rgba(148, 163, 184, 0.18);
    color: #475569;
    border-color: rgba(100, 116, 139, 0.2);
}
.application-status-pill--contattato {
    background: rgba(79, 70, 229, 0.12);
    color: #3730a3;
    border-color: rgba(79, 70, 229, 0.22);
}
.application-status-pill--accettata {
    background: rgba(22, 163, 74, 0.12);
    color: #166534;
    border-color: rgba(22, 163, 74, 0.22);
}
.application-status-pill--rifiutata {
    background: rgba(220, 38, 38, 0.1);
    color: #b91c1c;
    border-color: rgba(220, 38, 38, 0.18);
}

.application-card__meta {
    padding-top: 10px;
    display: grid;
    gap: 6px;
    color: #64748b;
    font-weight: 600;
    font-size: 0.88rem;
}

.application-card__meta-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.application-card__meta-row i {
    width: 16px;
    text-align: center;
    color: #94a3b8;
}

/* Badge profilo: chip piatti, secondari rispetto allo stato */
.application-card__badges {
    margin-top: 10px;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.application-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 8px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    background: rgba(241, 245, 249, 0.9);
    color: #64748b;
    font-weight: 700;
    font-size: 0.72rem;
    line-height: 1.2;
}

/* Footer azioni: Messaggio primario + Accetta/Rifiuta secondari */
.application-card__footer {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(15, 23, 42, 0.06);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.application-card .offerte-btn {
    width: auto;
    height: auto;
    min-height: 40px;
    padding: 8px 16px;
    font-size: 0.88rem;
    text-decoration: none;
}

.application-card__cta-msg {
    flex: 1 1 160px;
    max-width: 100%;
}

.application-card__decide {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    margin-left: auto;
}

.application-card__decide-form {
    margin: 0;
}

.application-card__btn-accept,
.application-card__btn-reject,
.application-card__btn-undo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 6px 12px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 0.82rem;
    cursor: pointer;
    border: 1px solid transparent;
    background: transparent;
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease;
}

.application-card__btn-accept {
    color: #166534;
    border-color: rgba(22, 163, 74, 0.28);
    background: rgba(22, 163, 74, 0.06);
}
.application-card__btn-accept:hover:not(:disabled) {
    background: rgba(22, 163, 74, 0.12);
}
.application-card__btn-reject {
    color: #b91c1c;
    border-color: rgba(220, 38, 38, 0.22);
    background: rgba(220, 38, 38, 0.04);
}
.application-card__btn-reject:hover:not(:disabled) {
    background: rgba(220, 38, 38, 0.1);
}
.application-card__btn-undo {
    color: #334155;
    border-color: rgba(100, 116, 139, 0.28);
    background: rgba(241, 245, 249, 0.9);
}
.application-card__btn-undo:hover:not(:disabled) {
    background: rgba(226, 232, 240, 0.95);
}
.application-card__btn-accept:disabled,
.application-card__btn-reject:disabled,
.application-card__btn-undo:disabled {
    opacity: 0.45;
    cursor: default;
}

/* legacy (eventuali altre view) */
.application-card__actions {
    margin-top: 12px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

@media (max-width: 520px) {
    .application-card__footer {
        flex-direction: column;
        align-items: stretch;
    }
    .application-card__cta-msg,
    .application-card__cta-hf {
        flex: 1 1 auto;
        width: 100%;
        justify-content: center;
    }
    .application-card__decide {
        margin-left: 0;
        width: 100%;
        justify-content: stretch;
    }
    .application-card__decide-form {
        flex: 1;
    }
    .application-card__btn-accept,
    .application-card__btn-reject,
    .application-card__btn-undo {
        width: 100%;
    }
}

/* Popup post Accetta / Rifiuta (stile platform_reviews) */
.ad-prompt[hidden] { display: none !important; }
.ad-prompt {
    position: fixed;
    inset: 0;
    z-index: 12000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom));
    box-sizing: border-box;
}
.ad-prompt__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.28);
    opacity: 0;
    transition: opacity 0.35s ease;
}
.ad-prompt.is-open .ad-prompt__backdrop { opacity: 1; }
.ad-prompt__card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 400px;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(32px) saturate(1.2);
    -webkit-backdrop-filter: blur(32px) saturate(1.2);
    border: 1px solid rgba(255, 255, 255, 0.82);
    border-radius: 16px;
    box-shadow:
        0 16px 48px rgba(15, 23, 42, 0.12),
        0 2px 8px rgba(15, 23, 42, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
    padding: 18px 18px 16px;
    margin-bottom: max(8px, env(safe-area-inset-bottom));
    box-sizing: border-box;
    color: #0f172a;
    opacity: 0;
    transform: translateY(22px) scale(0.97);
}
.ad-prompt.is-open .ad-prompt__card {
    animation: adCardIn 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.04s both;
}
@keyframes adCardIn {
    from { opacity: 0; transform: translateY(22px) scale(0.97); }
    to { opacity: 1; transform: none; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .ad-prompt__card { background: rgba(255, 255, 255, 0.97); }
}
.ad-prompt__card h2 {
    margin: 0 0 8px;
    font-size: 1.15rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.25;
}
.ad-prompt__lead {
    margin: 0 0 16px;
    color: #334155;
    font-size: 0.92rem;
    line-height: 1.45;
}
.ad-prompt__lead strong { color: #0f172a; }
.ad-prompt__cta {
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    text-decoration: none;
    border: 0;
    border-radius: 12px;
    padding: 12px 14px;
    font-size: 0.98rem;
    font-weight: 800;
    color: #fff;
    background: #0066cc;
    cursor: pointer;
}
.ad-prompt__cta:hover { filter: brightness(1.05); }
.ad-prompt__skip {
    display: block;
    width: 100%;
    margin-top: 10px;
    border: 0;
    background: transparent;
    color: #64748b;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 8px;
    cursor: pointer;
}
.ad-prompt__skip:hover { color: #334155; }
@media (prefers-reduced-motion: reduce) {
    .ad-prompt__backdrop { transition: none; opacity: 1; }
    .ad-prompt.is-open .ad-prompt__card { animation: none; opacity: 1; transform: none; }
}

/* Modifiche Card per colonna sinistra */
.job-card-compact {
    position: relative;
    padding: 15px;
    margin-bottom: 12px;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.job-card-compact:hover {
    border-color: #007bff;
    background-color: #f8fbff;
}

.selected-card {
    border: 2px solid #007bff !important;
    background-color: #f0f7ff !important;
    transform: none !important;
    box-shadow: 0 0 10px rgba(0,123,255,0.2) !important;
}

/* Card grande nella colonna destra */
.sticky-details {
    margin-bottom: 0;
    min-height: 100%;
    overflow-x: hidden;
}

/* Wrapping robusto per testi lunghi nelle candidature */
.application-card,
.application-card__meta,
.application-card__meta-row,
.application-card__meta-row span,
.application-card__name,
.application-card__spec {
    min-width: 0;
}

.application-card__meta-row span {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Pannello candidature (colonna destra): evita che il bordo "has-selection"
   inglobi il margin-bottom delle card interne (effetto sbordo). */
.right-column-applications .applications-list .job-card.application-card {
    margin-bottom: 12px;
}
.right-column-applications .applications-list .job-card.application-card:last-child {
    margin-bottom: 0;
}


/* Media Queries per la responsività */

@media (max-width: 768px) {
    .filter-form {
        align-items: stretch;
        padding: 15px;
    }
        
    #search_query {
        margin-bottom: 15px;
    }

    .toggle-filters-btn {
        display: none !important; 
    }

    .filter-collapsible-content {
        max-height: none !important;
        opacity: 1 !important;
        overflow: visible !important;
        padding: 0;
        gap: 15px;
    }

    .scrollable-filters-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
        width: 100%;
        box-sizing: border-box;
        padding-bottom: 10px;
    }

    .filter-container {
        display: inline-flex;
        /* flex-wrap: nowrap; */
        justify-content: flex-start;
        align-items: center;
        padding: 0;
        gap: 10px;
        width: fit-content;
    }

    .filter-group {
        flex-shrink: 0;
        min-width: 140px;
        flex-direction: column;
        align-items: flex-start;
    }

    .filter-group input,
    .filter-group select {
        flex-shrink: 0;
        min-width: 130px;
        width: auto;
        padding-right: 10px;
        background-position: right 8px center;
        background-size: 8px;
    }

    .filter-group.date-filter {
        flex-direction: row;
        align-items: center;
        gap: 5px;
        min-width: 250px;
    }

    .filter-group.date-filter input[type="date"] {
        min-width: 105px;
    }

    .filter-group select[name="regione"],
    .filter-group select[name="provincia"],
    .filter-group select[name="ente_erogatore"] {
        min-width: 140px;
        max-width: 220px;
    }
    
    .filter-group select[name="categoria_keyword"] {
        min-width: 110px;
        max-width: 180px;
    }

    .apply-filters-btn,
    .btn-candidati,
    .btn-login-for-apply {
        width: 100%;
        margin-top: 15px;
    }
        
    .job-card, .bando-card {
        padding: 15px;
    }

    .button-container-floating {
        top: auto !important;
        bottom:20px;
    }

    .subtitle-bandi {
        margin-bottom: 0px;
    }
}

/* =========================================================
   /offerte mobile: "reels" (1 card per viewport) + snap
   ========================================================= */
@media (max-width: 768px) {
    body.offerte-reels-mode .offerte-split-layout.offerte-reels-mode .left-column-list {
        /* altezza viewport - offset calcolato via JS */
        height: var(--offerte-reels-height, 100svh);
        max-height: var(--offerte-reels-height, 100svh);
        overflow-y: auto;
        overflow-x: hidden;
        scroll-snap-type: y mandatory;
        /* niente smooth: evita "flash scroll" e rende il loop invisibile */
        scroll-behavior: auto;
        -webkit-overflow-scrolling: touch;
        padding: 0 0 10px 0;
        background: #f4f4f4;
    }

    /* Durante i jump del loop: disattiva snap per evitare flicker */
    body.offerte-reels-mode .offerte-split-layout.offerte-reels-mode .left-column-list.reels-jumping {
        scroll-snap-type: none;
    }

    body.offerte-reels-mode .offerte-split-layout.offerte-reels-mode .left-column-list .offerte {
        margin: 0;
        padding: 0;
        display: grid;
        gap: 0; /* evita che si intraveda la card successiva in basso */
    }

    body.offerte-reels-mode .offerte-split-layout.offerte-reels-mode .left-column-list .offerte > .job-card {
        scroll-snap-align: start;
        scroll-snap-stop: always;
        height: var(--offerte-reels-card-height, var(--offerte-reels-height, 100svh));
        max-height: var(--offerte-reels-card-height, var(--offerte-reels-height, 100svh));
        overflow: hidden;
        margin-bottom: 0;
    }

    /* Reels: usa la card "aperta" (full-card-html) al posto della compatta */
    .offerte-split-layout.offerte-reels-mode .left-column-list .job-card-compact .job-card-header,
    .offerte-split-layout.offerte-reels-mode .left-column-list .job-card-compact .job-info {
        display: none;
    }
    .offerte-split-layout.offerte-reels-mode .left-column-list .job-card-compact .full-card-html { display: none !important; }
    .offerte-split-layout.offerte-reels-mode .left-column-list .job-card-compact .reels-card-html {
        display: block !important;
        height: 100%;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .job-card-compact {
        padding: 14px;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card {
        height: 100%;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__title {
        font-weight: 900;
        font-size: 1.05rem;
        line-height: 1.25;
        color: #111;
        word-break: break-word;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__chip {
        margin-top: 8px;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 7px 10px;
        border-radius: 999px;
        border: 1px solid rgba(0,0,0,0.06);
        background: rgba(255,255,255,0.85);
        color: rgba(0,0,0,0.70);
        font-weight: 800;
        font-size: 0.85rem;
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
    }
    @media (min-width: 420px) {
        .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__grid {
            grid-template-columns: 1fr 1fr;
        }
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__item {
        display: flex;
        gap: 10px;
        align-items: flex-start;
        padding: 10px 10px;
        border-radius: 12px;
        background: rgba(255,255,255,0.78);
        border: 1px solid rgba(0,0,0,0.06);
    }
    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__item i {
        color: rgba(0,0,0,0.55);
        margin-top: 2px;
        width: 16px;
        text-align: center;
        flex: 0 0 16px;
    }
    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__label {
        font-size: 0.78rem;
        color: rgba(0,0,0,0.55);
        font-weight: 800;
        margin-bottom: 2px;
    }
    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__value {
        font-size: 0.95rem;
        color: #222;
        font-weight: 700;
        overflow-wrap: anywhere;
    }
    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__item--accent {
        background: rgba(240, 247, 255, 0.95);
        border-left: 4px solid #0b5fff;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__item--cta {
        background: rgba(255,255,255,0.70);
        border: 1px dashed rgba(11, 95, 255, 0.35);
    }
    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__item--cta i {
        color: rgba(11, 95, 255, 0.75);
    }
    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__item--cta .reels-card__value {
        color: rgba(0,0,0,0.70);
        font-weight: 800;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__meta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }
    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__meta-date {
        color: #64748b;
        font-weight: 700;
        font-size: 0.9rem;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__cta {
        margin-top: auto;
        padding-top: 6px;
    }
    .offerte-split-layout.offerte-reels-mode .left-column-list .reels-card__cta-hint {
        display: block;
        text-align: center;
        color: rgba(0,0,0,0.55);
        font-weight: 800;
        font-size: 0.86rem;
    }

    /* Reels: pannello referral — distribuzione armonica sull'altezza */
    .offerte-split-layout.offerte-reels-mode .left-column-list .referral-offer-card,
    .offerte-split-layout.offerte-reels-mode .left-column-list .referral-panel {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 0 !important;
        text-align: left;
        /* Non clippare l’alone: overflow hidden = bordi netti sul glow */
        overflow: visible !important;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .referral-panel__inner {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 0;
        min-height: min(70vh, 520px);
        padding: 22px 18px 18px;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .referral-panel__body {
        margin-bottom: 16px;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .referral-link-box {
        margin-top: 4px;
        margin-bottom: 12px;
    }

    .offerte-split-layout.offerte-reels-mode .left-column-list .referral-progress {
        margin-top: 4px !important;
    }

    /* Evita che i padding interni rendano la card più alta del viewport */
    body.offerte-reels-mode .offerte-split-layout.offerte-reels-mode .left-column-list .offerte > .job-card.job-card-compact {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    /* scrollbar discreta come le altre */
    /* In reels, nascondi la scrollbar: il reset del loop deve essere impercettibile */
    .offerte-split-layout.offerte-reels-mode .left-column-list::-webkit-scrollbar { width: 0; height: 0; }
    .offerte-split-layout.offerte-reels-mode .left-column-list { scrollbar-width: none; }
}

@media (min-width: 769px) {
    .filter-form {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start;
        padding: 15px 25px;
        gap: 15px 20px;
    }

    #search_query {
        order: 1;
        flex-grow: 0;
        flex-shrink: 0;
        width: 250px;
        min-width: 200px;
        margin-bottom: 0;
    }

    .toggle-filters-btn {
        display: inline-flex;
        order: 2;
        flex-grow: 0;
        flex-shrink: 0;
    }

    .filter-collapsible-content {
        order: 3;
        width: 100%;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease-out, padding 0.3s ease-out;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 15px 10px;
        padding-top: 0;
        padding-bottom: 0;
        align-items: center;
    }

    .filter-collapsible-content.active {
        max-height: 1000px;
        padding-top: 15px;
    }

    .scrollable-filters-wrapper {
        width: auto;
        overflow-x: visible;
        padding-bottom: 0;
        flex-grow: 1;
        flex-shrink: 1;
        white-space: normal;
    }

    .filter-container {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        padding: 0;
        gap: 15px 10px;
        flex-grow: 1;
        align-items: center;
        width: 100%;
    }

    .filter-group {
        flex-shrink: 1;
        flex-grow: 0;
        flex-basis: auto;
        margin-bottom: 0;
        flex-direction: row;
        align-items: center;
        gap: 5px;
    }

    .filter-group.date-filter {
        flex-grow: 0;
        flex-shrink: 0;
        width: auto;
        min-width: 270px;
    }

    .filter-group.date-filter input[type="date"] {
        flex-grow: 1;
        min-width: 140px;
    }

    .filter-group select {
        padding-right: 25px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        height: 40px;
        min-width: 120px;
        max-width: 200px;
        flex-basis: 150px;
    }
        
    .filter-group select[name="regione"],
    .filter-group select[name="provincia"],
    .filter-group select[name="ente_erogatore"] {
        min-width: 140px;
        max-width: 220px;
        flex-basis: 160px;
    }
    .filter-group select[name="categoria_keyword"] {
        min-width: 130px;
        max-width: 200px;
        flex-basis: 150px;
    }

    .apply-filters-btn,
    .clear-filters-btn,
    .btn-candidati,
    .btn-login-for-apply {
        width: auto;
        margin-top: 0;
        align-self: center;
        padding: 8px 20px;
        font-size: 0.95rem;
        flex-shrink: 0;
        flex-grow: 0;
        /* height: 40px; */
        /* margin-left: auto; */
    }
}

/* Stili vari esistenti */
.job-card, .bando-card {
    position: relative;
    background: #ffffff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease-in-out;
    margin-bottom: 15px;
}

.job-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.job-title-main {
    font-weight: 600;
    font-size: 1.5rem;
}

.job-status-inactive {
    font-weight: 400;
    font-size: 0.85rem;
    color: #d9534f;
    margin-left: 4px;
}

.job-info {
    flex: 1;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 10px;
    margin-bottom: 0;
}

.job-info p {
    display: flex;
    justify-content: flex-start;
    padding: 8px 15px;
    background: #f9f9f9;
    border-radius: 5px;
    font-size: 0.9rem;
    margin: 3px 0;
}

.job-info p strong {
    color: #333;
}

.time-info {
    color: #333;
    font-weight: bold;
    margin-left: 5px;
    word-wrap: break-word;
    word-break: break-word;
    overflow-wrap: break-word;
    text-align: right;
}

.date-start { display: block; clear: both; }
.date-break { display: inline-block; word-wrap: break-word; }
.date-end { display: inline-block; white-space: nowrap; }

.disattivata {
    text-decoration: line-through;
    color: gray;
}

.save-search-btn {
    background-color: #28a745;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 0.95rem;
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background-color 0.3s ease, transform 0.2s ease;
    white-space: nowrap;
    height: 40px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.save-search-btn:hover { background-color: #218838; transform: translateY(-1px); }
.save-search-btn:active { transform: translateY(0); }

.clear-filters-btn:hover { background-color: #666; transform: translateY(-1px); }
.clear-filters-btn { transform: translateY(0); }

@media (min-width: 769px) {
    .save-search-btn {
        order: 4;
        /* margin-left: 10px; */
        flex-grow: 0;
        flex-shrink: 0;
    }

    .save-search-message {
        display: none;
    }
}
@media (max-width: 768px) {
    .save-search-btn {
        width: 100%;
        margin-top: 15px;
    }
}

.btn-candidati,
.btn-login-for-apply,
.btn-disattiva,
.btn-attiva,
.btn-modifica,
.btn-visualizza {
    display: inline-block;
    padding: 5px 10px;
    font-size: 0.85rem;
    border-radius: 4px;
    text-decoration: none;
    border: none;
    cursor: pointer;
}

.btn-candidati, .btn-login-for-apply, .btn-visualizza {
    background-color: #007bff;
    color: #fff;
}
.btn-disattiva { background-color: #dc3545; color: #fff; }
.btn-attiva { background-color: #28a745; color: #fff; }
.btn-modifica { background-color: #ffc107; color: #333; }

.job-actions {
    margin-top: 10px;
    display: flex;
    justify-content: flex-end;
    gap: 5px;
    flex-wrap: wrap;
}

/* Referral panel visuals: /css/referral_panel.css */
.referral-offer-card.referral-panel { padding: 0; }

.expanded-header a:hover i {
    color: #007bff;
    transform: scale(1.1);
}

/* =========================================================
   STILI RECUPERATI DAL VECCHIO CSS (Popup, Animazioni, Referral)
   ========================================================= */

/* --- Popup Salvataggio Ricerca --- */
/* Stili per il popup di ricerca salvata */
.save-search-popup {
    position: fixed;
    bottom: 20px; /* 20px dal margine inferiore */
    background-color: rgba(255, 255, 255, 0.65);
    backdrop-filter: blur(15px);
    border: 1px solid #ddd; /* Bordo leggero */
    border-radius: 15px; /* Bordi arrotondati come job-cards */
    padding: 15px 40px 15px 20px; /* Aumentato padding a destra per il pulsante X */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Ombra leggera */
    z-index: 100; /* Assicurati che sia sopra altri elementi */
    opacity: 0; /* Inizia invisibile */
    pointer-events: none; /* Inizialmente non cliccabile per non bloccare elementi sottostanti */
    cursor: pointer; /* Indica che è cliccabile una volta visibile */
    white-space: nowrap; /* Forza il testo su una singola riga */
    /* overflow: hidden; /* Nasconde il testo che esce dai bordi */
    /* max-width: fit-content; /* La larghezza si adatta al contenuto del testo */
    display: flex; /* Per allineare testo e bottone campana sulla stessa riga */
    align-items: center; /* Centra verticalmente gli elementi interni */
    margin-bottom: 20px;
}

.save-search-popup p {
    margin: 0;
    font-size: 0.95em;
    color: #333;
    line-height: 1.4;
    display: inline-block; /* Necessario per lo scorrimento del testo all'interno */
    padding-right: 10px; /* Spazio tra testo e bottone campana */
}

.save-search-popup.show {
    opacity: 1; /* Rende il popup completamente solido e visibile */
    pointer-events: auto; /* Rende cliccabile */
}

.save-search-popup .highlight-text {
    font-weight: bold;
    color: #28a745; /* Colore per evidenziare il testo chiave */
}

/* Stile per il pulsante di chiusura (X) */
.close-popup-btn {
    position: absolute;
    top: 5px;
    right: 5px;
    background: none;
    border: none;
    font-size: 1.2em;
    color: #666;
    cursor: pointer;
    padding: 5px;
    line-height: 1; /* Per centrare bene l'icona */
    z-index: 101; /* Sopra il popup */
}

.close-popup-btn:hover {
    color: #333;
}

/* Stile per il bottone con icona campana */
.save-search-btn-popup {
    background: none;
    border: 1px solid #28a745; /* Bordo verde */
    border-radius: 5px;
    color: #28a745; /* Icona verde */
    cursor: pointer;
    padding: 8px 12px;
    margin-left: 10px; /* Spazio dal testo */
    font-size: 0.9em;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.save-search-btn-popup:hover {
    background-color: #218838;
    color: #ffffff;
}

.save-search-popup:hover {
    background-color: rgba(241, 255, 237, 0.65);
    backdrop-filter: blur(5px);
    color: #ffffff;
}

/* Mobile: sopra la navbar flottante (.icon-nav: bottom 10px + height 65px, vedi navbar.css) */
@media (max-width: 768px) {
    .save-search-popup {
        bottom: calc(10px + 65px + 16px + env(safe-area-inset-bottom, 0px));
        margin-bottom: 0;
    }
}

/* Animazione per lo scorrimento continuo (Mobile) */
@keyframes continuousMarqueeMobile {
    0% {
        transform: translateX(100vw); /* Inizia completamente fuori dallo schermo a destra */
    }
    100% {
        transform: translateX(calc(-100% - 100vw)); /* Si sposta completamente fuori dallo schermo a sinistra */
    }
}

/* Animazione per lo scorrimento continuo (Desktop - più lento) */
@keyframes continuousMarqueeDesktop {
    0% {
        transform: translateX(100vw);
    }
    100% {
        transform: translateX(calc(-100% - 100vw));
    }
}

/* Overlay popup login */
.overlay-login-prompt {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    z-index: 9998;
}

.overlay-login-prompt.show {
    opacity: 1;
    pointer-events: auto;
}

/* Popup login */
.login-prompt-popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(520px, 92vw);
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 14px;
    padding: 22px 18px;
    box-shadow: 0 18px 60px rgba(0,0,0,0.25);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    z-index: 9999;
}

.login-prompt-popup.show {
    opacity: 1;
    pointer-events: auto;
}

.login-prompt-popup h3 {
    margin-bottom: 10px;
    font-size: 1.2rem;
}

.login-prompt-popup p {
    margin-bottom: 16px;
    color: #444;
    font-size: 0.95rem;
}

.login-prompt-popup .btn-container {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.login-prompt-popup .btn {
    display: inline-block;
    padding: 10px 14px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 700;
    font-size: 0.95rem;
}

.login-prompt-popup .btn-primary {
    background: #007bff;
    color: #fff;
}

.login-prompt-popup .btn-secondary {
    background: #f1f3f5;
    color: #333;
    border: 1px solid #ddd;
}

/* Stili per il dropdown geografico custom */
.geo-autocomplete-dropdown {
    position: absolute;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    max-height: 250px;
    overflow-y: auto;
    z-index: 99999; /* Z-index altissimo per sovrapporsi a tutto */
    display: none;
    width: 100%; /* Sarà sovrascritto via JS per combaciare con l'input */
}
.geo-autocomplete-dropdown.active {
    display: block;
}
.geo-option {
    padding: 10px 12px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #eee;
    transition: background 0.2s;
}
.geo-option:last-child {
    border-bottom: none;
}
.geo-option:hover {
    background-color: #f0f8ff;
}
.geo-option-label {
    font-weight: bold;
    color: #333;
}
.geo-option-type {
    font-size: 0.8rem;
    color: #888;
    background: #e9ecef;
    padding: 2px 6px;
    border-radius: 4px;
}
/* Contenitore relativo per l'input */
.geo-input-container {
    position: relative;
    width: 100%;
}

/* Barra datore su visualizza_offerta: CTA verso ancoraggio sezione candidature */
.visualizza-offerta-owner-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0 0 18px;
    padding: 0;
    font-size: 0.95rem;
    line-height: 1.4;
}
.visualizza-offerta-candidature-jump {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}
.offer-applications#offer-applications-section {
    scroll-margin-top: 1rem;
    scroll-margin-bottom: 1.5rem;
}

.offer-applications h2 .offer-applications-count {
    font-size: 0.88em;
    font-weight: 700;
    color: #64748b;
    margin-left: 6px;
}

/* Popup disattiva offerta (id usati in pubblicate / visualizza_offerta) */
#overlay,
.offer-deactivate-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 10040;
    display: none;
}
#questionario-popup,
.offer-deactivate-modal {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10050;
    display: none;
    background: transparent;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
    max-width: min(420px, calc(100vw - 28px));
    width: 100%;
    text-align: left;
}
.offer-deactivate-modal__content {
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
    padding: 22px 20px 18px;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}
.offer-deactivate-modal__eyebrow {
    margin: 0 0 6px;
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
}
.offer-deactivate-modal h2,
.offer-deactivate-modal #offer-deactivate-title {
    margin: 0 0 8px;
    font-size: 1.15rem;
    line-height: 1.35;
    font-weight: 750;
    color: #0f172a;
}
.offer-deactivate-modal__lead {
    margin: 0 0 18px;
    font-size: 0.92rem;
    line-height: 1.45;
    color: #64748b;
}
.offer-deactivate-modal__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 10px;
}
.offer-deactivate-btn {
    appearance: none;
    border: 0;
    border-radius: 12px;
    min-height: 44px;
    padding: 10px 14px;
    font: inherit;
    font-size: 0.95rem;
    font-weight: 650;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.12s ease;
}
.offer-deactivate-btn--yes {
    background: #0f172a;
    color: #fff;
}
.offer-deactivate-btn--yes:hover { background: #1e293b; }
.offer-deactivate-btn--no {
    background: #f1f5f9;
    color: #0f172a;
}
.offer-deactivate-btn--no:hover { background: #e2e8f0; }
.offer-deactivate-btn--ghost {
    width: 100%;
    background: transparent;
    color: #64748b;
    font-weight: 600;
}
.offer-deactivate-btn--ghost:hover {
    background: rgba(148, 163, 184, 0.15);
    color: #0f172a;
}
.offer-deactivate-modal__actions--stack {
    grid-template-columns: 1fr;
    margin-top: 12px;
    margin-bottom: 0;
}
.offer-deactivate-alt-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    max-height: min(42vh, 320px);
    overflow-y: auto;
    margin: 0 0 10px;
    padding: 2px;
}
.offer-deactivate-alt-opt {
    appearance: none;
    border: 1px solid rgba(15, 23, 42, 0.1);
    background: #f8fafc;
    border-radius: 12px;
    min-height: 44px;
    padding: 10px 10px;
    font: inherit;
    font-size: 0.82rem;
    font-weight: 650;
    color: #0f172a;
    text-align: left;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    line-height: 1.25;
    transition: background 0.12s ease, border-color 0.12s ease;
}
.offer-deactivate-alt-opt i {
    width: 1.1em;
    text-align: center;
    color: #64748b;
    flex-shrink: 0;
}
.offer-deactivate-alt-opt:hover {
    background: #f1f5f9;
}
.offer-deactivate-alt-opt.is-selected {
    border-color: #0f172a;
    background: #fff;
    box-shadow: inset 0 0 0 1px #0f172a;
}
.offer-deactivate-alt-detail {
    margin: 0 0 8px;
}
.offer-deactivate-alt-detail label {
    display: block;
    font-size: 0.8rem;
    font-weight: 650;
    color: #475569;
    margin-bottom: 6px;
}
.offer-deactivate-alt-detail input {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 10px;
    min-height: 42px;
    padding: 8px 12px;
    font: inherit;
    font-size: 0.9rem;
}
@media (max-width: 420px) {
    .offer-deactivate-alt-grid {
        grid-template-columns: 1fr;
    }
}
/* Legacy class hooks (pubblicate / dashboard.js) */
#questionario-popup .btn-si,
#questionario-popup .btn-no,
#questionario-popup .btn-annulla {
    margin: 0;
}

/* Listing /offerte: titolo, sottotitolo e barra allineati a sinistra */
body.offerte-listing > .container > section h1,
body.offerte-listing > .container > section h2 {
    text-align: left;
}

/* Hub SEO specializzazione: lead + empty state (guest vs loggato) */
.offerte-spec-seo-lead {
    margin: 6px 0 18px;
    max-width: 40rem;
    color: #475569;
    font-size: 1.05rem;
    line-height: 1.55;
    text-align: left;
}
.offerte-spec-empty {
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.06);
    padding: 22px 20px;
    margin-bottom: 16px;
}
.offerte-spec-empty__title {
    margin: 0 0 10px;
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.35;
}
.offerte-spec-empty__text {
    margin: 0 0 16px;
    color: #475569;
    line-height: 1.55;
}
.offerte-spec-empty__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.offerte-spec-empty__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 11px 16px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 700;
    font-size: 0.95rem;
    background: #f1f5f9;
    color: #0f172a;
    border: 1px solid rgba(15, 23, 42, 0.08);
}
.offerte-spec-empty__btn:hover {
    background: #e2e8f0;
    color: #0f172a;
    text-decoration: none;
}
.offerte-spec-empty__btn--primary {
    background: #007bff;
    color: #fff;
    border-color: #007bff;
}
.offerte-spec-empty__btn--primary:hover {
    background: #0069d9;
    color: #fff;
}
.offerte-spec-empty-side {
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 4px 0;
    color: #475569;
}
.offerte-spec-empty-side .offerte-spec-empty__title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.35;
}
.offerte-spec-empty-side .offerte-spec-empty__text {
    margin: 0;
    line-height: 1.55;
}
.offerte-spec-empty-side p {
    margin: 0;
    line-height: 1.5;
}
button.offerte-spec-empty__btn {
    border: 1px solid #007bff;
    cursor: pointer;
    font-family: inherit;
}

/* Mobile: colonna destra di solito nascosta — su hub specialità vuoto va mostrata */
@media (max-width: 991px) {
    .offerte-split-layout--spec-empty {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }
    .offerte-split-layout--spec-empty .right-column-details {
        display: block;
        width: 100%;
        max-width: 100%;
        position: static;
        max-height: none;
        overflow: visible;
        order: -1; /* messaggio utile prima della card referral / unlock */
    }
    .offerte-split-layout--spec-empty .left-column-list {
        order: 1;
    }
    .offerte-split-layout--spec-empty .sticky-details {
        position: static;
    }
}
@media (max-width: 768px) {
    .offerte-spec-empty__actions {
        flex-direction: column;
    }
    .offerte-spec-empty__btn {
        width: 100%;
    }
}