/* 
   NEUMORPHISM DESIGN SYSTEM
   Design moderno con effetti glassmorphism e neumorphism
   Creato per il sistema di gestione bilancio FabioGhidini.it
*/

/* === CARD NEUMORPHISM === */
.neumorphism-card {
    background: rgba(25, 25, 30, 0.45);
    backdrop-filter: blur(25px) saturate(1.2);
    -webkit-backdrop-filter: blur(25px) saturate(1.2);
    border-radius: 24px;
    padding: 2.5rem;
    position: relative;
    overflow: hidden;

    /* Neumorphism shadows - soft inset/outset con riflessi più forti */
    box-shadow:
        /* Outer glow */
        0 8px 32px rgba(0, 0, 0, 0.4),
        /* Inner highlight top (più forte) */
        inset 0 2px 0 rgba(255, 255, 255, 0.25),
        /* Inner highlight left (nuovo) */
        inset 2px 0 0 rgba(255, 255, 255, 0.20),
        /* Inner shadow bottom */
        inset 0 -1px 0 rgba(0, 0, 0, 0.3),
        /* Inner shadow right */
        inset -1px 0 0 rgba(0, 0, 0, 0.2),
        /* Soft outer highlight */
        0 1px 0 rgba(255, 255, 255, 0.12);

    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.4s cubic-bezier(0.23, 1, 0.320, 1);
}



/* === ANIMAZIONI === */
@keyframes float {

    0%,
    100% {
        transform: translateY(0px) scale(1);
        opacity: 0.8;
    }

    50% {
        transform: translateY(-10px) scale(1.05);
        opacity: 1;
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.table-fade-in {
    opacity: 0;
    animation: fadeInUp 0.8s ease-out forwards;
}

/* === TABELLE TRASPARENTI === */
.neumorphism-card .table-dark {
    --bs-table-bg: transparent !important;
    background: transparent !important;
    backdrop-filter: none;
}

.neumorphism-card .table-dark th,
.neumorphism-card .table-dark td {
    background: transparent !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Rimuovere sfondo anche dalle righe totali */
.neumorphism-card .table-active,
.neumorphism-card .table-active th,
.neumorphism-card .table-active td {
    --bs-table-active-bg: transparent !important;
    background: transparent !important;
}

/* Regole specifiche per tabelle Entrate e Uscite */
.neumorphism-card #tabellaEntrate,
.neumorphism-card #tabellaUscite,
.neumorphism-card #tabellaEntrate th,
.neumorphism-card #tabellaEntrate td,
.neumorphism-card #tabellaUscite th,
.neumorphism-card #tabellaUscite td {
    --bs-table-bg: transparent !important;
    background: transparent !important;
    background-color: transparent !important;
}

/* === TIPOGRAFIA === */
.neumorphism-card .table {
    font-size: 0.9rem;
}

.neumorphism-card .table th {
    font-size: 0.85rem;
    font-weight: 600;
}

.neumorphism-card .table .fw-bold {
    font-size: 0.9rem;
}

.neumorphism-title {
    font-size: 1.2rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.95);
    margin: 0 0 2rem 0;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    position: relative;
}

.neumorphism-title i {
    margin-right: 0.75rem;
    color: rgba(100, 150, 255, 0.9);
    text-shadow: 0 0 8px rgba(100, 150, 255, 0.3);
}

/* === PULSANTI NEUMORPHISM === */
.btn-neumorphism {
    background: rgba(30, 30, 35, 0.4);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 18px;
    color: rgba(255, 255, 255, 0.95) !important;
    font-weight: 600;
    font-size: 0.95rem;
    padding: 0.75rem 1.5rem;
    text-decoration: none !important;
    transition: all 0.3s cubic-bezier(0.23, 1, 0.320, 1);
    position: relative;
    overflow: hidden;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;

    box-shadow:
        0 6px 20px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.20),
        inset 1px 0 0 rgba(255, 255, 255, 0.15),
        inset 0 -1px 0 rgba(0, 0, 0, 0.25),
        inset -1px 0 0 rgba(0, 0, 0, 0.15),
        0 1px 0 rgba(255, 255, 255, 0.1);
}


.btn-neumorphism:hover {
    color: rgba(255, 255, 255, 1) !important;
    background: rgba(30, 30, 35, 0.75);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.35),
        inset 0 2px 0 rgba(255, 255, 255, 0.25),
        inset 2px 0 0 rgba(255, 255, 255, 0.20),
        inset 0 -1px 0 rgba(0, 0, 0, 0.2),
        inset -1px 0 0 rgba(0, 0, 0, 0.1),
        0 2px 0 rgba(255, 255, 255, 0.15);
}

.btn-neumorphism i {
    text-shadow: 0 0 6px currentColor;
}

/* === VARIANTI COLORATE DEI PULSANTI === */

/* Pulsanti movimento - azzurro */
a[href*="movimento"] .btn-neumorphism,
a.btn-neumorphism[href*="movimento"] {
    background: rgba(0, 180, 255, 0.5);
    border: 1px solid rgba(0, 180, 255, 0.8);
    box-shadow:
        0 6px 20px rgba(0, 150, 255, 0.3),
        0 0 15px rgba(0, 150, 255, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.25),
        inset 1px 0 0 rgba(255, 255, 255, 0.20),
        inset 0 -1px 0 rgba(0, 0, 0, 0.25),
        inset -1px 0 0 rgba(0, 0, 0, 0.15),
        0 1px 0 rgba(0, 150, 255, 0.4);
}

a[href*="movimento"] .btn-neumorphism:hover,
a.btn-neumorphism[href*="movimento"]:hover {
    background: rgba(0, 200, 255, 0.7);
    border: 1px solid rgba(0, 200, 255, 0.9);
    box-shadow:
        0 10px 30px rgba(0, 200, 255, 0.5),
        0 0 25px rgba(0, 200, 255, 0.45),
        inset 0 2px 0 rgba(255, 255, 255, 0.3),
        inset 2px 0 0 rgba(255, 255, 255, 0.25),
        inset 0 -1px 0 rgba(0, 0, 0, 0.2),
        inset -1px 0 0 rgba(0, 0, 0, 0.1),
        0 2px 0 rgba(0, 150, 255, 0.5);
}

/* Pulsanti trasferimento - azzurro */
a[href*="trasferimento"] .btn-neumorphism,
a.btn-neumorphism[href*="trasferimento"],
a[href*="trasferimenti-quotidiani"] .btn-neumorphism,
a.btn-neumorphism[href*="trasferimenti-quotidiani"] {
    background: rgba(0, 191, 255, 0.5);
    border: 1px solid rgba(0, 191, 255, 0.8);
    box-shadow:
        0 6px 20px rgba(0, 191, 255, 0.3),
        0 0 15px rgba(0, 191, 255, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.25),
        inset 1px 0 0 rgba(255, 255, 255, 0.20),
        inset 0 -1px 0 rgba(0, 0, 0, 0.25),
        inset -1px 0 0 rgba(0, 0, 0, 0.15),
        0 1px 0 rgba(0, 191, 255, 0.4);
}

a[href*="trasferimento"] .btn-neumorphism:hover,
a.btn-neumorphism[href*="trasferimento"]:hover,
a[href*="trasferimenti-quotidiani"] .btn-neumorphism:hover,
a.btn-neumorphism[href*="trasferimenti-quotidiani"]:hover {
    background: rgba(0, 191, 255, 0.7);
    border: 1px solid rgba(0, 191, 255, 0.9);
    box-shadow:
        0 10px 30px rgba(0, 191, 255, 0.5),
        0 0 25px rgba(0, 191, 255, 0.5),
        inset 0 2px 0 rgba(255, 255, 255, 0.3),
        inset 2px 0 0 rgba(255, 255, 255, 0.25),
        inset 0 -1px 0 rgba(0, 0, 0, 0.2),
        inset -1px 0 0 rgba(0, 0, 0, 0.1),
        0 2px 0 rgba(0, 191, 255, 0.5);
}

/* Pulsanti Tinaba/Ricarica - rosso */
a[href*="Tinaba"] .btn-neumorphism,
a.btn-neumorphism[href*="Tinaba"],
a[href*="Ricarica"] .btn-neumorphism,
a.btn-neumorphism[href*="Ricarica"] {
    background: rgba(255, 20, 40, 0.5);
    border: 1px solid rgba(255, 20, 40, 0.8);
    box-shadow:
        0 6px 20px rgba(220, 53, 69, 0.3),
        0 0 15px rgba(220, 53, 69, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.25),
        inset 1px 0 0 rgba(255, 255, 255, 0.20),
        inset 0 -1px 0 rgba(0, 0, 0, 0.25),
        inset -1px 0 0 rgba(0, 0, 0, 0.15),
        0 1px 0 rgba(220, 53, 69, 0.4);
}

a[href*="Tinaba"] .btn-neumorphism:hover,
a.btn-neumorphism[href*="Tinaba"]:hover,
a[href*="Ricarica"] .btn-neumorphism:hover,
a.btn-neumorphism[href*="Ricarica"]:hover {
    background: rgba(255, 30, 50, 0.7);
    border: 1px solid rgba(255, 30, 50, 0.9);
    box-shadow:
        0 10px 30px rgba(255, 30, 50, 0.5),
        0 0 25px rgba(255, 30, 50, 0.5),
        inset 0 2px 0 rgba(255, 255, 255, 0.3),
        inset 2px 0 0 rgba(255, 255, 255, 0.25),
        inset 0 -1px 0 rgba(0, 0, 0, 0.2),
        inset -1px 0 0 rgba(0, 0, 0, 0.1),
        0 2px 0 rgba(220, 53, 69, 0.5);
}

/* === COMPATIBILITÀ CON LE CARD ESISTENTI === */

/* Conversione automatica da modern-side-card a neumorphism-card */
.modern-side-card {
    background: rgba(25, 25, 30, 0.45);
    backdrop-filter: blur(25px) saturate(1.2);
    -webkit-backdrop-filter: blur(25px) saturate(1.2);
    border-radius: 24px;
    padding: 2.5rem;
    position: relative;
    overflow: hidden;

    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.4),
        inset 0 2px 0 rgba(255, 255, 255, 0.25),
        inset 2px 0 0 rgba(255, 255, 255, 0.20),
        inset 0 -1px 0 rgba(0, 0, 0, 0.3),
        inset -1px 0 0 rgba(0, 0, 0, 0.2),
        0 1px 0 rgba(255, 255, 255, 0.12);

    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.4s cubic-bezier(0.23, 1, 0.320, 1);
}

.modern-side-card-title {
    font-size: 1.2rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.95);
    margin: 0 0 2rem 0;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    position: relative;
}

.modern-side-card-title i {
    margin-right: 0.75rem;
    color: rgba(100, 150, 255, 0.9);
    text-shadow: 0 0 8px rgba(100, 150, 255, 0.3);
}