/* ============================================================
   Path: /qbh2h/assets/css/export.css
   Description: Styles for the image export and watermark
   ============================================================ */

.export-container {
    display: block; /* Sicherstellen, dass es kein Inline-Element ist */
    width: 100%;
    position: relative;
}

.export-box {
    position: relative;
    background: var(--elf-white);
    padding: 25px;
    border-radius: 12px;
    overflow: hidden; /* Schneidet das rotierte Wasserzeichen ab */
}

/* Watermark: Hidden by default, only shown during export */
.table-watermark {
    display: none;
    position: absolute;
    top: 75%;
    left: 65%;
    transform: translate(-50%, -50%) rotate(-10deg);
    width: 70%;
    opacity: 0.20;
    z-index: 0;
    pointer-events: none;
}

/* Export Button */
.btn-export {
    background: var(--elf-success);
    color: var(--elf-white);
    border: none;
    padding: 10px 25px;
    border-radius: 50px;
    cursor: pointer;
    width: auto !important;
    display: inline-block;
    font-weight: bold;
    transition: transform 0.2s;
}

.btn-export:hover {
    transform: scale(1.02);
}

/* Export Footer: Contains elfpedia logo and license info */
.export-footer {
    display: none; /* Hidden on web, visible in exported image */
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    align-items: center;
    gap: 20px;
}

.export-footer img {
    height: 35px;
}

.license-info {
    font-size: 11px;
    color: #777;
    line-height: 1.3;
}

/* Helper class triggered by JavaScript during html2canvas process */
.printing .table-watermark {
    display: block !important; /* Block statt Flex für absolute Bilder */
}
.printing .export-footer {
    display: flex !important;
}