/* style.css */

/* Basic styling for the static card area */
#static-card-area {
    min-height: 250px; /* Ensure card has a minimum height */
    cursor: pointer; /* Indicate clickability for reveal/next */
    touch-action: pan-y; /* Allow vertical scrolling while detecting horizontal swipes */
    user-select: none; /* Prevent text selection during swipe */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE */
    position: relative; /* Needed for absolute positioning like reveal button */
}
@media (min-width: 768px) { /* md breakpoint */
    #static-card-area {
        min-height: 300px;
    }
}

/* Hide elements visually but keep accessible */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* Style disabled buttons */
button:disabled {
  opacity: 0.6; /* Slightly more visible than default 0.5 */
  cursor: not-allowed;
}
 /* Prevent hover effects on disabled buttons */
#prev-card-btn:disabled:hover {
   background-color: transparent !important;
   color: #6b7280 !important; /* text-gray-500 */
   border-color: #d1d5db !important; /* border-gray-300 */
}
 #next-card-btn:disabled:hover {
    background-color: #4f46e5 !important; /* bg-indigo-600 */
 }
 #mc-next-btn:disabled:hover {
    background-color: #4f46e5 !important; /* bg-indigo-600 */
 }
  #review-marked-btn:disabled:hover {
       background-color: #f59e0b !important; /* bg-yellow-500 */
  }
  .mc-option-btn:disabled:hover {
       /* Keep feedback colors, don't revert on hover when disabled */
       filter: brightness(100%);
  }
   .mc-option-btn:disabled {
       opacity: 1; /* Ensure feedback colors are not dimmed */
   }