/**
 * SAW Admin - Floating Action Buttons
 * @package SAW_Visitors
 * @version 5.0.0
 * 
 * NOTE: Detail mode FABs (edit/delete) are now rendered INSIDE sidebar
 * via detail-sidebar.php and styled in _sidebar-wrapper.css
 * 
 * This file handles only the list mode "Add" FAB button
 */

.sa-fab {
    position: fixed;
    bottom: calc(45px + var(--saw-space-4)); /* Footer height (45px) + spacing */
    right: var(--saw-space-6);
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--saw-brand-600);
    color: #ffffff;
    border: none;
    border-radius: var(--saw-radius-full);
    box-shadow: var(--saw-shadow-lg);
    cursor: pointer;
    transition: all var(--saw-transition-fast);
    z-index: var(--saw-z-fixed);
}

.sa-fab:hover {
    background: var(--saw-brand-700);
    box-shadow: var(--saw-shadow-xl);
    transform: scale(1.05);
}

.sa-fab--sm {
    width: 48px;
    height: 48px;
}

.sa-fab--lg {
    width: 64px;
    height: 64px;
}

/* FAB Group - pro více float buttons */
.sa-fab-group {
    position: fixed;
    bottom: calc(45px + var(--saw-space-4)); /* Footer height (45px) + spacing */
    right: var(--saw-space-6);
    display: flex;
    flex-direction: column;
    gap: var(--saw-space-3);
    z-index: var(--saw-z-fixed);
}

.sa-fab-group .sa-fab {
    position: relative;
    bottom: auto;
    right: auto;
}

/* ============================================
   FAB POSITIONING - SIMPLIFIED
   Detail mode FABs are now inside sidebar
   This handles only list mode "Add" FAB
   ============================================ */

/* Hide list FAB when sidebar is open (detail FABs are inside sidebar) */
body:has(.sa-sidebar--active) .sa-fab:not(.sa-sidebar-fab),
body:has(.sa-sidebar--active) .sa-fab-group:not(.sa-sidebar-fab-container) {
    display: none !important;
}

/* Tablet adjustments for list FAB */
@media (max-width: 1024px) and (min-width: 769px) {
    .sa-fab:not(.sa-sidebar-fab),
    .sa-fab-group:not(.sa-sidebar-fab-container) {
        bottom: calc(var(--saw-bottom-nav-height, 52px) + var(--saw-space-4, 16px));
    }
}

/* Mobile adjustments for list FAB */
@media (max-width: 768px) {
    .sa-fab:not(.sa-sidebar-fab),
    .sa-fab-group:not(.sa-sidebar-fab-container) {
        bottom: calc(var(--saw-bottom-nav-height-mobile, 48px) + var(--saw-space-3, 12px));
        right: var(--saw-space-4);
    }
}

/* ============================================
   FAB VARIANTS
   ============================================ */

/* Secondary variant */
.sa-fab--secondary {
    background: var(--saw-gray-600);
}

.sa-fab--secondary:hover {
    background: var(--saw-gray-700);
}

/* Danger variant */
.sa-fab--danger {
    background: var(--saw-danger, #dc2626);
}

.sa-fab--danger:hover {
    background: var(--saw-danger-dark, #b91c1c);
}

/* ============================================
   LOADING STATE
   ============================================ */
.sa-fab.is-loading {
    pointer-events: none;
    opacity: 0.7;
}

.sa-fab.is-loading svg {
    animation: saw-spin 1s linear infinite;
}

@keyframes saw-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* All FABs in group should have consistent size */
.sa-fab-group .sa-fab {
    width: 56px;
    height: 56px;
}
