/*Smooth shadow + scale*/
button {
    transition: all 0.2s ease;
}

    button:hover {
        transform: translateY(-2px) scale(1.02);
        box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    }

/*Press effect*/
button:active {
    transform: scale(0.97);
}


/*.card {
    transition: all 0.25s ease;
}

    .card:hover {
        transform: translateY(-4px);
        box-shadow: 4px 4px 4px rgba(var(--brand-rgb), 0.25);
    }*/

.icon:hover {
    transform: scale(1.15);
    transition: transform 0.15s ease;
}

input:not(.form-check-input),
textarea {
    border: 1px solid #ccc !important;
    padding: 5px 10px !important;
    border-radius: 3px !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

    input:not(.form-check-input):focus,
    textarea:focus {
        border-color: var(--brand) !important;
        box-shadow: 0 0 0 2px rgba(var(--brand-rgb), 0.1) !important;
        outline: none !important;
    }



@media (max-width: 768px) {
    input:not(.form-check-input),
    textarea {
        border: 1px solid #ccc !important;
        /*padding: 0px 5px !important;*/
        border-radius: 3px !important;
        transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    }

        input:not(.form-check-input):focus,
        textarea:focus {
            border-color: var(--brand) !important;
            box-shadow: 0 0 0 2px rgba(var(--brand-rgb), 0.1) !important;
            outline: none !important;
        }
}


/* ======================== */
/* Postman-like JSON colors */
/* ======================== */

.token.property {
    color: #a31515 !important;
}

.token.string {
    color: #0451a5 !important;
}

.token.number {
    color: #098658 !important;
}

.token.punctuation {
    color: #cccccc !important;
}

/*pre[class*="language-"] {
        background: #1e1e1e !important;*/ /* Postman dark background */
/*}*/

.token.operator {
    background: unset;
}

/* ======================== */
/* Postman-like JSON colors */
/* ======================== */