/*
File: plugins/kayefi-confession-ui/assets/css/app.css
*/

/* KAYEFI UI - PRODUCTION STYLES */

/* 1. HTML2CANVAS SCREENSHOT OVERRIDES */
.kayefi-card.capturing {
    /* Reset geometry */
    width: 1080px !important;
    height: auto !important;
    min-height: 1080px !important;
    
    /* Reset visual container */
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    
    /* Branding Background */
    background: radial-gradient(circle at top right, #f8fafc, #ffffff) !important;
    padding: 80px !important;
    
    /* Typography Resets for Image */
    font-family: system-ui, -apple-system, sans-serif !important;
}

/* Force Light Mode Colors for Exports */
.kayefi-card.capturing * {
    color: #1e293b !important; /* Slate-800 */
}

/* Hide Interactive Elements */
.kayefi-card.capturing button, 
.kayefi-card.capturing .reactions,
.kayefi-card.capturing .group-hover\:block {
    display: none !important;
}

/* Watermark Logic */
.screenshot-only {
    display: none;
}
.kayefi-card.capturing .screenshot-only {
    display: block !important;
    margin-top: 60px !important;
    opacity: 0.5;
}

/* 2. VUE TRANSITIONS */

/* List Enter/Leave */
.list-enter-active,
.list-leave-active {
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.list-enter-from,
.list-leave-to {
  opacity: 0;
  transform: translateY(30px);
}

/* Modal Slide Up */
.slide-up-enter-active {
  animation: slide-up 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.slide-up-leave-active {
  animation: slide-up 0.3s cubic-bezier(0.16, 1, 0.3, 1) reverse;
}

@keyframes slide-up {
  0% { transform: translateY(100%); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

/* 3. UTILITIES */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}