assure/Vue/Ficheprestataire/index.php

<?php 
    $this->titre = "Intersanté - Fiche Prestataire"; 
    $_SESSION['codePrestataire_C'] =  $this->nettoyer($prestataire['codePrestataire']) ;
    $codePrestataire  = $_SESSION['codePrestataire_C'] ;
    $actif=$prestataire['actif'];
?>

<input class="sr-only" type="text" id="idPrestataire" name="idPrestataire" value="<?= $this->nettoyer($prestataire['idPrestataire']) ?>" >

<div class="card shadow-lg border-0 mb-4" style="border-radius: 15px;">
	<div class="card-header bg-primary text-white py-3" style="border-radius: 15px 15px 0 0;">
		<div class="row align-items-center">
			<div class="col-8">
				<h4 id="h4_titre" class="mb-2 text-center">
					<i class="bi bi-shop me-2 fs-4"></i>
					<?= _("Fiche Prestataire") ?>
				</h4>
			</div>
		</div>
	</div>
	
    <!-- En-tête -->
    <div class="card mb-4">
        <div class="card shadow-sm mb-8">
            <?php if($actif == "0"): ?>
                <span class="badge bg-warning ms-2"><?= _("Inactif") ?></span>
            <?php endif; ?>
        </div>
        <div class="card-body">
            <!-- Informations principales en disposition responsive -->
            <div class="row">
                <!-- Nom et Type -->
                <div class="col-md-6 mb-3">
                    <div class="info-group">
                        <label class="form-label fw-bold"><?= _("Nom") ?></label>
                        <div class="form-control-plaintext p-2 border rounded bg-light">
                            <?= $this->nettoyer($prestataire['libelle']) ?>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 mb-3">
                    <div class="info-group">
                        <label class="form-label fw-bold"><?= _("Type") ?></label>
                        <div class="form-control-plaintext p-2 border rounded bg-light">
                            <?= $this->nettoyer($prestataire['typeprestataire']) ?>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- Localisation -->
            <div class="row">
                <div class="col-md-4 mb-3">
                    <div class="info-group">
                        <label class="form-label fw-bold"><?= _("Pays") ?></label>
                        <div class="form-control-plaintext p-2 border rounded bg-light">
                            <?= $this->nettoyer($prestataire['pays']) ?>
                        </div>
                    </div>
                </div>
                <div class="col-md-4 mb-3">
                    <div class="info-group">
                        <label class="form-label fw-bold"><?= _("Région") ?></label>
                        <div class="form-control-plaintext p-2 border rounded bg-light">
                            <?= $this->nettoyer($prestataire['ville']) ?>
                        </div>
                    </div>
                </div>
                <div class="col-md-4 mb-3">
                    <div class="info-group">
                        <label class="form-label fw-bold"><?= _("Ville") ?></label>
                        <div class="form-control-plaintext p-2 border rounded bg-light">
                            <?= $this->nettoyer($prestataire['localite']) ?>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- Coordonnées -->
            <div class="row">
                <div class="col-md-6 mb-3">
                    <div class="info-group">
                        <label class="form-label fw-bold"><?= _("Adresse Géo") ?></label>
                        <div class="form-control-plaintext p-2 border rounded bg-light">
                            <?= $this->nettoyer($prestataire['adresseGeo']) ?>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 mb-3">
                    <div class="info-group">
                        <label class="form-label fw-bold"><?= _("N° Tél SMS") ?></label>
                        <div class="form-control-plaintext p-2 border rounded bg-light">
                            <?= $this->nettoyer($prestataire['smsGestionPrestataire']) ?>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 mb-3">
                    <div class="info-group">
                        <label class="form-label fw-bold"><?= _("E-mail") ?></label>
                        <div class="form-control-plaintext p-2 border rounded bg-light text-truncate">
                            <?= $this->nettoyer($prestataire['emailGestionPrestataire']) ?>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- Informations complémentaires (si disponibles) -->
            <?php if(isset($prestataire['autresInfos']) && !empty($prestataire['autresInfos'])): ?>
            <div class="row">
                <div class="col-12">
                    <div class="info-group">
                        <label class="form-label fw-bold"><?= _("Informations complémentaires") ?></label>
                        <div class="form-control-plaintext p-2 border rounded bg-light">
                            <?= $this->nettoyer($prestataire['autresInfos']) ?>
                        </div>
                    </div>
                </div>
            </div>
            <?php endif; ?>
        </div>
    </div>
    
</div>

<style>
.info-group {
    margin-bottom: 1rem;
}

.info-group label {
    display: block;
    margin-bottom: 0.25rem;
    font-size: 0.9rem;
}

.form-control-plaintext {
    min-height: 38px;
    display: flex;
    align-items: center;
    word-break: break-word;
}

/* Adaptation pour les très petits écrans */
@media (max-width: 576px) {
    .card-header h2 {
        font-size: 1.1rem;
    }
    
    .info-group label {
        font-size: 0.85rem;
    }
    
    .form-control-plaintext {
        font-size: 0.9rem;
        padding: 0.5rem;
    }
    
    .btn {
        font-size: 0.85rem;
        padding: 0.375rem 0.75rem;
    }
}

/* Amélioration de l'affichage sur tablettes */
@media (min-width: 768px) and (max-width: 992px) {
    .info-group label {
        font-size: 0.95rem;
    }
}

/* Animation subtile au survol */
.form-control-plaintext {
    transition: all 0.2s ease;
}

.form-control-plaintext:hover {
    background-color: #f8f9fa !important;
    border-color: #ced4da !important;
}
</style>