Dialyse-Webseite/view/practice.php

<h1>Praxisausstattung &amp; Öffnungszeiten</h1>

<p class="lead" style="font-size: 1.1rem; color: var(--text-muted); margin-bottom: 2rem;">
    Unser Dialysezentrum verfügt über moderne Medizintechnik für eine schonende, sichere und individuelle Behandlung unserer Patienten.
</p>

<!-- Praxisausstattung Grid -->
<div class="grid-2" style="margin-bottom: 2.5rem;">
    <div class="card">
        <h2 style="font-size: 1.25rem; margin-top: 0; color: var(--primary-dark); display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem;">
            <svg aria-hidden="true" focusable="false" style="width: 20px; height: 20px; fill: var(--accent);" viewBox="0 0 24 24"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"/></svg>
            Diagnostik &amp; Plätze
        </h2>
        <ul style="list-style: none; padding: 0; margin: 0;">
            <li style="display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.75rem;">
                <span aria-hidden="true" style="color: var(--accent); font-weight: bold;">&#x2713;</span>
                <span><strong>Ambulanz:</strong> Sonographie, EKG, 24 Std. Blutdruckmessung</span>
            </li>
            <li style="display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.75rem;">
                <span aria-hidden="true" style="color: var(--accent); font-weight: bold;">&#x2713;</span>
                <span><strong>Zentrumsdialyse:</strong> 16 Behandlungsplätze</span>
            </li>
            <li style="display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.75rem;">
                <span aria-hidden="true" style="color: var(--accent); font-weight: bold;">&#x2713;</span>
                <span><strong>Satellitendialyse:</strong> 18 Behandlungsplätze</span>
            </li>
            <li style="display: flex; align-items: flex-start; gap: 0.5rem;">
                <span aria-hidden="true" style="color: var(--accent); font-weight: bold;">&#x2713;</span>
                <span><strong>Osmoseaufbereitungsanlage</strong> nach neuesten Standards</span>
            </li>
        </ul>
    </div>

    <div class="card">
        <h2 style="font-size: 1.25rem; margin-top: 0; color: var(--primary-dark); display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem;">
            <svg aria-hidden="true" focusable="false" style="width: 20px; height: 20px; fill: var(--accent);" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 14H9V8h2v8zm4 0h-2V8h2v8z"/></svg>
            Geräte &amp; Dialysetechnik
        </h2>
        <ul style="list-style: none; padding: 0; margin: 0;">
            <li style="display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.75rem;">
                <span aria-hidden="true" style="color: var(--accent); font-weight: bold;">&#x2713;</span>
                <span><strong>Nikkiso DBB-07 und Nikkiso DBB-EXA</strong> Dialysegeräte mit integriertem <strong>Haemo-Master (BV-UFC/COC)</strong></span>
            </li>
            <li style="display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.75rem;">
                <span aria-hidden="true" style="color: var(--accent); font-weight: bold;">&#x2713;</span>
                <span><strong>BCM (Body Composition Monitor)</strong> von Fresenius zur bioelektrischen Messung des Flüssigkeitsstatus und Optimalgewichts</span>
            </li>
            <li style="display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.75rem;">
                <span aria-hidden="true" style="color: var(--accent); font-weight: bold;">&#x2713;</span>
                <span>Breite Palette an <strong>High- und Low-Flux Dialysatoren</strong></span>
            </li>
            <li style="display: flex; align-items: flex-start; gap: 0.5rem;">
                <span aria-hidden="true" style="color: var(--accent); font-weight: bold;">&#x2713;</span>
                <span><strong>Laborgeräte:</strong> Säure-Basen-Messgerät und Elektrolyt-Messgerät</span>
            </li>
        </ul>
    </div>
</div>

<!-- Öffnungszeiten & Schichten (Orientierung an hamburg-harburg-dialyse.de) -->
<h2 style="margin-top: 2rem; margin-bottom: 1.5rem;">Behandlungs- &amp; Sprechzeiten</h2>

<div class="grid-2" style="margin-bottom: 3rem;">
    <!-- Dialyse Schichten Card -->
    <div class="schedule-card">
        <div class="schedule-header">
            <svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z"/></svg>
            <h3 class="schedule-title">Dialyse-Schichten</h3>
        </div>
        <ul class="schedule-list">
            <li class="schedule-item">
                <div class="schedule-day">
                    Mo, Mi, Fr<br>
                    <small style="color: var(--text-muted); font-weight: normal;">(3 Schichten)</small>
                </div>
                <div class="schedule-time">
                    <div><span class="schedule-shift-tag">1. Schicht</span> 07:00 &ndash; 13:00 Uhr</div>
                    <div style="margin: 0.35rem 0;"><span class="schedule-shift-tag">2. Schicht</span> 13:00 &ndash; 18:00 Uhr</div>
                    <div><span class="schedule-shift-tag">3. Schicht</span> 14:30 &ndash; 20:00 Uhr</div>
                </div>
            </li>
            <li class="schedule-item">
                <div class="schedule-day">
                    Di, Do, Sa<br>
                    <small style="color: var(--text-muted); font-weight: normal;">(1 Schicht)</small>
                </div>
                <div class="schedule-time">
                    <div><span class="schedule-shift-tag">1. Schicht</span> 07:00 &ndash; 13:00 Uhr</div>
                </div>
            </li>
        </ul>
    </div>

    <!-- Ambulanz Zeiten Card -->
    <div class="schedule-card">
        <div class="schedule-header">
            <svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7z"/></svg>
            <h3 class="schedule-title">Ambulanz-Sprechzeiten</h3>
        </div>
        <ul class="schedule-list">
            <li class="schedule-item">
                <div class="schedule-day">Mo, Mi, Fr</div>
                <div class="schedule-time">08:30 &ndash; 11:30 Uhr</div>
            </li>
            <li class="schedule-item">
                <div class="schedule-day">Mo, Mi, Fr</div>
                <div class="schedule-time">
                    14:00 &ndash; 17:00 Uhr<br>
                    <small style="color: var(--text-muted); font-style: italic;">(nach Vereinbarung)</small>
                </div>
            </li>
            <li class="schedule-item">
                <div class="schedule-day">Di, Do</div>
                <div class="schedule-time">08:30 &ndash; 12:00 Uhr</div>
            </li>
            <li class="schedule-item">
                <div class="schedule-day">Sa &amp; So</div>
                <div class="schedule-time"><span style="color: var(--text-muted);">Geschlossen (außer Dialyse)</span></div>
            </li>
        </ul>
    </div>
</div>

<!-- Praxis Galerie -->
<h2 style="margin-top: 2.5rem; margin-bottom: 1rem;">Eindrücke aus unserer Praxis</h2>
<p style="color: var(--text-muted); margin-bottom: 1.5rem;">Klicken Sie auf ein Bild, um es in voller Größe zu betrachten.</p>

<div class="gallery-grid">
    <a href="/img/gallery/praxis3.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis3.jpg')?>" data-lightbox="practice" data-title="Freundlicher Wartebereich &bull; Dialysezentrum Berlin-Mahlsdorf" class="gallery-item">
        <img src="/img/gallery/praxis3.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis3.jpg')?>" alt="Freundlicher Wartebereich" width="1024" height="768" loading="lazy" decoding="async">
        <div class="gallery-overlay"><span class="gallery-caption">Freundlicher Wartebereich</span></div>
        <div class="gallery-zoom-icon" aria-hidden="true"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg></div>
    </a>
    <a href="/img/gallery/praxis4.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis4.jpg')?>" data-lightbox="practice" data-title="Nikkiso DBB-EXA Dialysegeräte &bull; Dialysezentrum Berlin-Mahlsdorf" class="gallery-item">
        <img src="/img/gallery/praxis4.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis4.jpg')?>" alt="Moderne Nikkiso DBB-EXA Dialysegeräte" width="682" height="1024" loading="lazy" decoding="async">
        <div class="gallery-overlay"><span class="gallery-caption">Nikkiso DBB-EXA Dialysegeräte</span></div>
        <div class="gallery-zoom-icon" aria-hidden="true"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg></div>
    </a>
    <a href="/img/gallery/praxis5.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis5.jpg')?>" data-lightbox="practice" data-title="Gepflegter Vorgarten &amp; Außenbereich &bull; Dialysezentrum Berlin-Mahlsdorf" class="gallery-item">
        <img src="/img/gallery/praxis5.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis5.jpg')?>" alt="Gepflegter Vorgarten und Außenbereich der Praxis" width="1200" height="800" loading="lazy" decoding="async">
        <div class="gallery-overlay"><span class="gallery-caption">Vorgarten &amp; Außenbereich</span></div>
        <div class="gallery-zoom-icon" aria-hidden="true"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg></div>
    </a>
    <a href="/img/gallery/praxis6.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis6.jpg')?>" data-lightbox="practice" data-title="Die Praxis von außen &bull; Dialysezentrum Berlin-Mahlsdorf" class="gallery-item">
        <img src="/img/gallery/praxis6.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis6.jpg')?>" alt="Die Praxis von außen" width="1024" height="768" loading="lazy" decoding="async">
        <div class="gallery-overlay"><span class="gallery-caption">Die Praxis von außen</span></div>
        <div class="gallery-zoom-icon" aria-hidden="true"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg></div>
    </a>
    <a href="/img/gallery/praxis7.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis7.jpg')?>" data-lightbox="practice" data-title="Empfang &amp; Anmeldung &bull; Dialysezentrum Berlin-Mahlsdorf" class="gallery-item">
        <img src="/img/gallery/praxis7.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis7.jpg')?>" alt="Empfang und Anmeldung im Dialysezentrum" width="1024" height="560" loading="lazy" decoding="async">
        <div class="gallery-overlay"><span class="gallery-caption">Empfang &amp; Anmeldung</span></div>
        <div class="gallery-zoom-icon" aria-hidden="true"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg></div>
    </a>
    <a href="/img/gallery/praxis8.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis8.jpg')?>" data-lightbox="practice" data-title="Ärztliches Sprechzimmer &bull; Dialysezentrum Berlin-Mahlsdorf" class="gallery-item">
        <img src="/img/gallery/praxis8.jpg?v=<?=filemtime(__DIR__ . '/../img/gallery/praxis8.jpg')?>" alt="Ärztliches Sprechzimmer und Untersuchungsraum" width="1024" height="771" loading="lazy" decoding="async">
        <div class="gallery-overlay"><span class="gallery-caption">Ärztliches Sprechzimmer</span></div>
        <div class="gallery-zoom-icon" aria-hidden="true"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg></div>
    </a>
</div>