/* Apple / Mac OS Theme Styles - 3D Translucent */
* {
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
}

input, textarea, [contenteditable="true"] {
    -webkit-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
    user-select: text !important;
}

html, body {
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
}

.paw-pattern {
    background-color: #f0f4f8 !important;
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30.43 14.15c-1.35-1.55-3.56-1.58-4.9-.06-1.34 1.5-1.56 3.65-.28 5.25 1.28 1.6 3.66 2.05 4.97.55 1.3-1.5.5-3.8-.2-5.74Zm-7.7-2.6c-1.2-1.3-3.1-1.3-4.3-.1-1.2 1.2-1.2 3.1-.2 4.4s3 1.8 4.2.6-1.6-4.5.1-4.9Zm16.2 0c1.2-1.3 3.1-1.3 4.3-.1 1.2 1.2 1.2 3.1-.2 4.4s-3 1.8-4.2.6 1.6-4.5-.1-4.9Zm-22.3 8.3c-.9-1-2.4-1.1-3.3-.2-.9.9-1 2.4-.2 3.4 1 1 2.3 1.4 3.3.4s1-3.2.2-3.6Zm30.7 0c.9-1 2.4-1.1 3.3-.2.9.9 1 2.4.2 3.4-1 1-2.3 1.4-3.3.4s-1-3.2-.2-3.6Zm-16.7 5c-3.7-.4-7 1.5-8.5 4.5-1.3 2.7-.8 5.6 1.1 7.4 1.7 1.6 4.6 2 7.4 2s5.7-.4 7.4-2c1.9-1.8 2.4-4.7 1.1-7.4-1.5-3-4.8-4.9-8.5-4.5Z' fill='%23e2e8f0' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
    background-attachment: fixed;
}
.apple-btn {
    background: linear-gradient(180deg, rgba(255,255,255,0.85) 0%, rgba(245,247,250,0.5) 100%);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-bottom: 2px solid rgba(0, 0, 0, 0.08);
    border-top: 1px solid rgba(255, 255, 255, 1);
    color: #1e293b;
    box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.05), inset 0 2px 5px rgba(255, 255, 255, 0.6);
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1);
    border-radius: 14px !important;
}
.apple-btn:active { 
    transform: translateY(2px) scale(0.98); 
    background: rgba(230, 235, 240, 0.8); 
    box-shadow: 0 0 2px rgba(0,0,0,0.05), inset 0 3px 5px rgba(0,0,0,0.08); 
    border-bottom-width: 1px;
}
.apple-btn:hover { background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 100%); box-shadow: 0 6px 15px rgba(0, 0, 0, 0.08), inset 0 2px 5px rgba(255, 255, 255, 0.9); }

.apple-btn-primary {
    background: linear-gradient(180deg, rgba(14,165,233,0.9) 0%, rgba(2,132,199,1) 100%);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(14, 165, 233, 0.5);
    border-bottom: 2px solid rgba(3, 105, 161, 1);
    border-top: 1px solid rgba(56, 189, 248, 1);
    color: white !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
    box-shadow: 0 4px 15px rgba(2, 132, 199, 0.4), inset 0 2px 5px rgba(255, 255, 255, 0.3);
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1);
    border-radius: 14px !important;
}
.apple-btn-primary:active { 
    transform: translateY(2px) scale(0.98); 
    background: rgba(2, 132, 199, 1); 
    box-shadow: 0 0 2px rgba(2, 132, 199, 0.5), inset 0 3px 5px rgba(0,0,0,0.3); 
    border-bottom-width: 1px;
}

.glass-panel {
    background: rgba(255, 255, 255, 0.55);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow: 0 6px 20px -4px rgba(0, 0, 0, 0.04), inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

/* ========================================================= */
/* PUNTO 4: MICRO-ANIMACIONES GLOBALES Y EFECTOS TÁCTILES    */
/* ========================================================= */

/* Aplicamos una transición fluida (spring-like) a todos los botones y enlaces de la app */
button, .apple-btn, a, .boton-tactil {
    transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), 
                box-shadow 0.2s ease-in-out, 
                background-color 0.2s ease-in-out !important;
    will-change: transform;
}

/* El efecto "squish" natural que tienen las apps nativas de iOS/Android al presionar algo */
button:active, .boton-tactil:active, .my-benefit-item:active {
    transform: scale(0.94) !important;
    opacity: 0.9;
}

/* Efecto de Levitación para Tarjetas (Tinder/Bumble Match Cards) */
.match-card-fx {
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: transform, box-shadow;
}

.match-card-fx:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    z-index: 10;
}

/* Custom peer checked background color for emerald toggles */
.peer:checked ~ .peer-checked-emerald {
    background-color: #10b981 !important;
}

/* Vibrant Match Button - Love & Friendship */
.btn-match-vibrant {
    background: linear-gradient(135deg, #ff4b82 0%, #10b981 100%) !important;
    box-shadow: 0 4px 15px rgba(255, 75, 130, 0.4), 0 4px 15px rgba(16, 185, 129, 0.4) !important;
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    border: none !important;
    animation: match-pulse 2.5s infinite alternate;
}

.btn-match-vibrant:hover {
    transform: translateY(-2px) scale(1.02) !important;
    box-shadow: 0 8px 25px rgba(255, 75, 130, 0.6), 0 8px 25px rgba(16, 185, 129, 0.6) !important;
}

.btn-match-vibrant::before {
    content: '';
    position: absolute;
    top: 0;
    left: -150%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.35) 50%, rgba(255, 255, 255, 0) 100%);
    transform: skewX(-25deg);
    animation: match-shimmer 6s infinite;
}

@keyframes match-pulse {
    0% {
        box-shadow: 0 4px 12px rgba(255, 75, 130, 0.4), 0 4px 12px rgba(16, 185, 129, 0.4);
    }
    100% {
        box-shadow: 0 8px 22px rgba(255, 75, 130, 0.75), 0 8px 22px rgba(16, 185, 129, 0.75);
    }
}

@keyframes match-shimmer {
    0% { left: -150%; }
    30% { left: 150%; }
    100% { left: 150%; }
}