/*
 * Plugin Name: Auto Download Buttons
 * Author: Tech-Turf
 * Version: 1.0.2
 */

/* --- WRAPPER: Defines size and relative context --- */
.file-flashcard-wrapper {
    position: relative; 
    display: block;
    width: 185px; /* Standard width for button and flashcard */
    margin: 0 auto; /* Center the button */
    z-index: 10;
}

/* --- BUTTON STYLING --- */
.delayed-autodownload-btn {
    background-color: var(--adb-btn-color); 
    color: var(--adb-btn-text-color); 
    padding: 14px 10px;
    border: none;
    border-radius: var(--adb-btn-radius); 
    cursor: pointer;
    font-size: var(--adb-btn-font-size); 
    font-weight: bold;
    display: block;
    width: 100%;  
    height: auto; 
    margin: 0; 
    transition: background-color 0.3s, font-size 0.3s;
    position: relative; 
    z-index: 10; 
    text-align: center;
    box-shadow: var(--adb-btn-shadow); 
}

/* Ready State Hover Effect */
.delayed-autodownload-btn:not(.waiting):hover {
    background-color: var(--adb-btn-hover-color); 
}

/* Countdown state styles */
.delayed-autodownload-btn.waiting {
    background-color: var(--adb-wait-color); 
    color: var(--adb-btn-text-color); 
    cursor: not-allowed;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1em;
}

/* --- FLASHCARD STYLING: VISIBLE BY DEFAULT, HIDES ON HOVER/COUNTDOWN --- */
.file-info-flashcard {
    position: absolute;
    bottom: 80%; 
    margin-bottom: 5px; 
    width: 75%; 
    left: 50%;
    transform: translateX(-50%) translateY(0);
    padding: 8px 10px;
    background: var(--adb-card-bg); 
    color: var(--adb-card-color); 
    border-radius: var(--adb-card-radius); 
    display: flex;
    justify-content: center; 
    align-items: center; 
    z-index: 9; 
    pointer-events: none; 
    font-size: var(--adb-card-font-size); 
    
    /* 1. DEFAULT STATE: VISIBLE */
    opacity: 1; 
    visibility: visible; 
    transition: opacity 0.3s, transform 0.3s, visibility 0.3s;
}

/* 2. HOVER STATE: DISAPPEAR */
/* HIDE the flashcard when the mouse IS over the wrapper (when button is ready) */
.file-flashcard-wrapper:hover .file-info-flashcard {
    opacity: 0;
    visibility: hidden; 
    transform: translateX(-50%) translateY(20px); 
}

/* 3. COUNTDOWN STATE: MUST BE HIDDEN */
/* HIDE the flashcard when the button is in waiting state (after click) */
.file-flashcard-wrapper:has(.delayed-autodownload-btn.waiting) .file-info-flashcard {
    opacity: 0 !important;
    visibility: hidden !important; 
    transform: translateX(-50%) translateY(20px) !important;
}

/* Styling for content inside the flashcard */
.file-icon {
    font-size: 0.9em;
    margin-right: 8px;
}
.file-extension {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 0.9em;
}

/* Multi-Button Layout */
.adbwd-multi-button-wrapper {
    /* Enables flex layout: items align horizontally */
    display: flex; 
    /* Centers the buttons horizontally within the wrapper */
    justify-content: center; 
    /* Centers the buttons vertically */
    align-items: center; 
    /* Add top/bottom margin for spacing from the image/post content */
    margin: 30px auto; 
    /* Ensures wrapping if there are too many buttons on a small screen */
    flex-wrap: wrap; 
    /* Ensures margin from the wrapper is not added to the adb-container */
    width: 100%;
}

/* Adjust the individual button container for horizontal spacing */
/* .adb-container is the wrapper around each button's shortcode output */
.adb-container { 
    /* Retain original design, but add horizontal margin between buttons */
    /* Remove original 'margin: 30px auto 30px auto;' from the top */
     margin: 40px; /* 10px top/bottom margin for wrapping, 10px horizontal spacing between buttons */
    /* Ensure the button element inside is treated as an item */
    flex-shrink: 0; 
}