/* ToolVorax floating dock — his component, his styling, extracted once.
 *
 * `includes/floating-dock.php` ships the dock's markup but none of its CSS.
 * Every one of his thirty tool pages carries its own inline copy of these rules
 * instead, so including the dock without also pasting ~90 lines of his CSS
 * renders it as a washed-out, unstyled strip across the bottom of the page.
 *
 * Copied verbatim from tools/pdf-merger.php rather than reinterpreted, so the
 * dock on our two pages is pixel-identical to the dock on his other thirty-two.
 * Nothing here is ours to design; if he restyles the dock, re-extract.
 *
 * Kept in our own folder, not merged into doculens.css, because it is his
 * component and the separation is the point — and not written into any file of
 * his, which is the agreement.
 */
/* Floating Dock Bar & Hover Fix */
.pro-dock-bar {
    background: #0b0f19;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6);
}

.dock-group { 
    position: relative; 
}

/* Invisible bridge to bridge hover gap between button and popover */
.dock-group::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    height: 20px;
    display: block;
}

.popover-menu {
    display: block;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    position: absolute;
    bottom: calc(100% + 8px);
    z-index: 999999 !important;
    width: 380px;
    max-height: 420px;
    overflow-y: auto;
    background: #0b0f19;
    backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.5), 0 20px 40px rgba(0, 0, 0, 0.6);
    border-radius: 20px;
    padding: 14px;
    transform: translateY(8px);
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
}

@media (min-width: 769px) {
    .dock-group:hover .popover-menu { 
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateY(0) !important;
    }
}

.dock-group.active-dock .popover-menu { 
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
}

.popover-left { left: 0; }
.popover-right { right: 0; }

.premium-tool-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    border-radius: 14px;
    color: #e2e8f0 !important;
    text-decoration: none;
    transition: all 0.2s;
}

.premium-tool-item:hover {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(168, 85, 247, 0.2));
    color: #fff !important;
}

.tool-icon-box {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    color: #fff;
}

/* Mobile. This block was the whole of the client's report.
 *
 * It was missed when the rest of these rules were extracted, and without it the
 * dock keeps its full-size buttons AND their text labels on a phone: the two
 * bars together come out wider than the screen, `justify-between` has nothing
 * left to distribute, and the right-hand group runs off the edge. On his own
 * pages the labels are hidden below 768px and the dock is icon-only, which is
 * exactly what he was comparing against on pdf-merger.
 *
 * Copied verbatim from tools/pdf-merger.php, `!important` and all. It is his
 * component; matching it exactly is the point, and tidying it would be the
 * first step towards the two drifting apart.
 */
@media (max-width: 768px) {
    #floating-dock-container { flex-direction: row !important; justify-content: space-between !important; padding: 0 8px !important; }
    .pro-dock-bar { padding: 6px 8px !important; gap: 4px !important; }
    .pro-dock-bar button span:not(:first-child) { display: none !important; }
    .popover-menu { position: fixed !important; bottom: 75px !important; left: 3% !important; right: 3% !important; width: 94vw !important; }
}