This commit is contained in:
KONE SOREL 2026-04-01 11:32:35 +00:00
parent 9e6271cb12
commit 10336d9ef9
3 changed files with 264 additions and 264 deletions

View File

@ -1,108 +0,0 @@
<div class="container-fluid py-4">
<div class="card border-0 shadow-sm mb-4">
<div class="card-header bg-white py-3">
<h5 class="mb-0 text-primary fw-bold">
<i class="fas fa-search me-2"></i><?= _("Critères de recherche de l'assuré") ?>
</h5>
</div>
<div class="card-body">
<form id="frmrecherche" name="frmrecherche" method="post" action="Recherche/index/">
<div class="row g-3">
<div class="col-md-3">
<label class="form-label small fw-bold"><?= _("Numéro Bénéficiaire") ?></label>
<input class="form-control" type="text" id="numeroBeneficiaire" name="numeroBeneficiaire" autofocus>
</div>
<div class="col-md-3">
<label class="form-label small fw-bold"><?= _("Numéro Famille") ?></label>
<input class="form-control" type="text" id="numeroAdherent" name="numeroAdherent">
</div>
<div class="col-md-3">
<label class="form-label small fw-bold"><?= _("Nom") ?></label>
<input class="form-control" type="text" id="nomBeneficiaire" name="nomBeneficiaire">
</div>
<div class="col-md-3">
<label class="form-label small fw-bold"><?= _("Prénoms") ?></label>
<input class="form-control" type="text" id="prenomsBeneficiaire" name="prenomsBeneficiaire">
</div>
<div class="col-md-3">
<label class="form-label small fw-bold">Tel</label>
<div class="input-group">
<span class="input-group-text bg-light"><i class="fa fa-phone fa-xs"></i></span>
<input class="form-control" type="text" id="telephonePortable" name="telephonePortable">
</div>
</div>
<div class="col-md-3">
<label class="form-label small fw-bold">E-mail</label>
<input class="form-control" type="email" id="email" name="email">
</div>
<div class="col-md-6 d-flex align-items-end justify-content-end">
<button type="submit" class="btn btn-primary px-4 shadow-sm">
<i class="fa fa-search me-2"></i> <?= _("Rechercher") ?>
</button>
</div>
</div>
</form>
</div>
</div>
<?php if (is_array($derniernumerobeneficiaires) && $derniernumerobeneficiaires['nouveau'] > 0): ?>
<div class="alert alert-warning border-0 shadow-sm d-flex align-items-center" role="alert">
<i class="fa-solid fa-triangle-exclamation fs-4 me-3 text-danger"></i>
<div>
<strong><?= _("Alerte de remplacement") ?> :</strong>
<?= _("Carte") ?> <span class="badge bg-danger"><?= $derniernumerobeneficiaires['ancien'] ?></span>
<?= _("remplacée par") ?> <span class="badge bg-success"><?= $derniernumerobeneficiaires['nouveau'] ?></span>.
</div>
</div>
<?php endif; ?>
<div class="card border-0 shadow-sm">
<div class="card-header bg-white d-flex justify-content-between align-items-center py-3">
<h5 class="mb-0 fw-bold"><?= _("Résultats de la recherche") ?></h5>
<span class="badge bg-info"><?= count($beneficiaires) ?> <?= _("trouvés") ?></span>
</div>
<div class="table-responsive">
<table class="table table-hover align-middle mb-0">
<thead class="table-light">
<tr class="small text-uppercase text-muted">
<th><?= _("Bénéficiaire") ?></th>
<th><?= _("Identité") ?></th>
<th><?= _("Parenté") ?></th>
<th class="text-center"><?= _("Infos") ?></th>
<th><?= _("Souscripteur") ?></th>
<th class="text-center"><?= _("État") ?></th>
</tr>
</thead>
<tbody>
<?php foreach ($beneficiaires as $beneficiaire): ?>
<tr class="cursor-pointer" onclick="..." style="cursor: pointer;">
<td>
<span class="fw-bold text-primary">#<?= $beneficiaire['numeroBeneficiaire'] ?></span><br>
<small class="text-muted">Fam: <?= $beneficiaire['numeroAdherent'] ?></small>
</td>
<td>
<div class="fw-bold"><?= strtoupper($beneficiaire['nomBeneficiaire']) ?></div>
<div class="small"><?= $beneficiaire['prenomsBeneficiaire'] ?></div>
</td>
<td><span class="badge bg-light text-dark border"><?= $beneficiaire['codeLienParente'] ?></span></td>
<td class="small text-center">
<?= $beneficiaire['sexe'] ?> | <?= dateLang($beneficiaire['dateNaissance']) ?><br>
<i class="fa fa-phone text-muted me-1"></i><?= $beneficiaire['telephonePortable'] ?>
</td>
<td class="small fw-bold"><?= $beneficiaire['nomClient'] ?></td>
<td class="text-center">
<?php
$statusClass = ($beneficiaire['codeEtatBeneficiaire'] == 'ACTIF') ? 'bg-success' : 'bg-secondary';
?>
<span class="badge rounded-pill <?= $statusClass ?>"><?= $beneficiaire['codeEtatBeneficiaire'] ?></span>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
</div>
</div>

View File

@ -1,115 +1,73 @@
<div class="container-fluid py-3 px-3">
<!-- SECTION: HEADER -->
<div class="mb-3">
<nav aria-label="breadcrumb">
<ol class="breadcrumb mb-1" style="font-size:12px">
<li class="breadcrumb-item text-secondary">INTER-SANTÉ</li>
<li class="breadcrumb-item active text-dark"><?= _("Recherche assuré") ?></li>
</ol>
</nav>
<h5 class="fw-semibold text-dark mb-0"><?= _("Recherche assuré") ?></h5>
</div>
<!-- SECTION: ALERTE REMPLACEMENT CARTE -->
<?php if (is_array($derniernumerobeneficiaires) && $derniernumerobeneficiaires['nouveau'] > 0): ?>
<div class="d-flex align-items-center gap-2 mb-3 p-3 bg-white rounded"
style="border: 1px solid #DEE2E6; border-left: 3px solid #DC3545;">
<i class="fa-solid fa-triangle-exclamation text-danger" style="font-size:14px"></i>
<div style="font-size:13px">
<strong><?= _("Alerte remplacement") ?> :</strong>
<?= _("Carte") ?>
<span class="badge border text-danger fw-normal ms-1"><?= $derniernumerobeneficiaires['ancien'] ?></span>
<?= _("remplacée par") ?>
<span class="badge border text-success fw-normal ms-1"><?= $derniernumerobeneficiaires['nouveau'] ?></span>
<div class="container-fluid py-4">
<div class="card border-0 shadow-sm mb-4">
<div class="card-header bg-white py-3">
<h5 class="mb-0 text-primary fw-bold">
<i class="fas fa-search me-2"></i><?= _("Critères de recherche de l'assuré") ?>
</h5>
</div>
</div>
<?php endif; ?>
<!-- SECTION: FORMULAIRE RECHERCHE -->
<div class="card mb-3">
<div class="card-header d-flex align-items-center gap-2">
<i class="fa-solid fa-magnifying-glass" style="font-size:12px;color:#6C757D"></i>
<span class="section-label"><?= _("Critères de recherche") ?></span>
</div>
<div class="card-body p-3">
<div class="card-body">
<form id="frmrecherche" name="frmrecherche" method="post" action="Recherche/index/">
<!-- Groupe : Identifiants -->
<div class="group-label"><?= _("Identifiants") ?></div>
<div class="row g-2 mb-3">
<div class="row g-3">
<div class="col-md-3">
<label class="form-label" for="numeroBeneficiaire"><?= _("N° Bénéficiaire") ?></label>
<input class="form-control form-control-sm" type="text"
id="numeroBeneficiaire" name="numeroBeneficiaire" autofocus>
<label class="form-label small fw-bold"><?= _("Numéro Bénéficiaire") ?></label>
<input class="form-control" type="text" id="numeroBeneficiaire" name="numeroBeneficiaire" autofocus>
</div>
<div class="col-md-3">
<label class="form-label" for="numeroAdherent"><?= _("N° Famille") ?></label>
<input class="form-control form-control-sm" type="text"
id="numeroAdherent" name="numeroAdherent">
</div>
</div>
<!-- Groupe : Identité -->
<div class="group-label"><?= _("Identité") ?></div>
<div class="row g-2 mb-3">
<div class="col-md-3">
<label class="form-label" for="nomBeneficiaire"><?= _("Nom") ?></label>
<input class="form-control form-control-sm" type="text"
id="nomBeneficiaire" name="nomBeneficiaire">
<label class="form-label small fw-bold"><?= _("Numéro Famille") ?></label>
<input class="form-control" type="text" id="numeroAdherent" name="numeroAdherent">
</div>
<div class="col-md-3">
<label class="form-label" for="prenomsBeneficiaire"><?= _("Prénoms") ?></label>
<input class="form-control form-control-sm" type="text"
id="prenomsBeneficiaire" name="prenomsBeneficiaire">
<label class="form-label small fw-bold"><?= _("Nom") ?></label>
<input class="form-control" type="text" id="nomBeneficiaire" name="nomBeneficiaire">
</div>
</div>
<!-- Groupe : Contact + Action -->
<div class="group-label"><?= _("Contact") ?></div>
<div class="row g-2 align-items-end">
<div class="col-md-3">
<label class="form-label" for="telephonePortable"><?= _("Téléphone") ?></label>
<div class="input-group input-group-sm">
<span class="input-group-text">
<i class="fa-solid fa-phone" style="font-size:11px"></i>
</span>
<input class="form-control form-control-sm" type="text"
id="telephonePortable" name="telephonePortable">
<label class="form-label small fw-bold"><?= _("Prénoms") ?></label>
<input class="form-control" type="text" id="prenomsBeneficiaire" name="prenomsBeneficiaire">
</div>
<div class="col-md-3">
<label class="form-label small fw-bold">Tel</label>
<div class="input-group">
<span class="input-group-text bg-light"><i class="fa fa-phone fa-xs"></i></span>
<input class="form-control" type="text" id="telephonePortable" name="telephonePortable">
</div>
</div>
<div class="col-md-3">
<label class="form-label" for="email">E-mail</label>
<div class="input-group input-group-sm">
<span class="input-group-text">
<i class="fa-solid fa-envelope" style="font-size:11px"></i>
</span>
<input class="form-control form-control-sm" type="email"
id="email" name="email">
</div>
<label class="form-label small fw-bold">E-mail</label>
<input class="form-control" type="email" id="email" name="email">
</div>
<div class="col-md-6 d-flex justify-content-end">
<button type="submit" class="btn btn-dark btn-sm px-4">
<i class="fa-solid fa-magnifying-glass me-2"></i><?= _("Rechercher") ?>
<div class="col-md-6 d-flex align-items-end justify-content-end">
<button type="submit" class="btn btn-primary px-4 shadow-sm">
<i class="fa fa-search me-2"></i> <?= _("Rechercher") ?>
</button>
</div>
</div>
</form>
</div>
</div>
<!-- SECTION: RÉSULTATS -->
<div class="card">
<div class="card-header d-flex align-items-center justify-content-between">
<span class="section-label"><?= _("Résultats") ?></span>
<span class="badge border text-secondary fw-normal">
<?= count($beneficiaires) ?> <?= _("trouvé(s)") ?>
</span>
<?php if (is_array($derniernumerobeneficiaires) && $derniernumerobeneficiaires['nouveau'] > 0): ?>
<div class="alert alert-warning border-0 shadow-sm d-flex align-items-center" role="alert">
<i class="fa-solid fa-triangle-exclamation fs-4 me-3 text-danger"></i>
<div>
<strong><?= _("Alerte de remplacement") ?> :</strong>
<?= _("Carte") ?> <span class="badge bg-danger"><?= $derniernumerobeneficiaires['ancien'] ?></span>
<?= _("remplacée par") ?> <span class="badge bg-success"><?= $derniernumerobeneficiaires['nouveau'] ?></span>.
</div>
</div>
<?php endif; ?>
<div class="card border-0 shadow-sm">
<div class="card-header bg-white d-flex justify-content-between align-items-center py-3">
<h5 class="mb-0 fw-bold"><?= _("Résultats de la recherche") ?></h5>
<span class="badge bg-info"><?= count($beneficiaires) ?> <?= _("trouvés") ?></span>
</div>
<div class="table-responsive">
<table class="table table-sm table-hover align-middle mb-0">
<table class="table table-hover align-middle mb-0">
<thead class="table-light">
<tr>
<tr class="small text-uppercase text-muted">
<th><?= _("Bénéficiaire") ?></th>
<th><?= _("Identité") ?></th>
<th><?= _("Parenté") ?></th>
@ -119,83 +77,32 @@
</tr>
</thead>
<tbody>
<?php if (!empty($beneficiaires)): ?>
<?php foreach ($beneficiaires as $beneficiaire): ?>
<tr class="clickable-row" onclick="...">
<?php foreach ($beneficiaires as $beneficiaire): ?>
<tr class="cursor-pointer" onclick="..." style="cursor: pointer;">
<td>
<span class="fw-semibold text-dark">
#<?= $beneficiaire['numeroBeneficiaire'] ?>
</span><br>
<small class="text-secondary">
Fam: <?= $beneficiaire['numeroAdherent'] ?>
</small>
<span class="fw-bold text-primary">#<?= $beneficiaire['numeroBeneficiaire'] ?></span><br>
<small class="text-muted">Fam: <?= $beneficiaire['numeroAdherent'] ?></small>
</td>
<td>
<div class="fw-semibold">
<?= strtoupper($beneficiaire['nomBeneficiaire']) ?>
</div>
<div class="text-secondary" style="font-size:12px">
<?= $beneficiaire['prenomsBeneficiaire'] ?>
</div>
<div class="fw-bold"><?= strtoupper($beneficiaire['nomBeneficiaire']) ?></div>
<div class="small"><?= $beneficiaire['prenomsBeneficiaire'] ?></div>
</td>
<td>
<span class="badge border text-secondary fw-normal">
<?= $beneficiaire['codeLienParente'] ?>
</span>
<td><span class="badge bg-light text-dark border"><?= $beneficiaire['codeLienParente'] ?></span></td>
<td class="small text-center">
<?= $beneficiaire['sexe'] ?> | <?= dateLang($beneficiaire['dateNaissance']) ?><br>
<i class="fa fa-phone text-muted me-1"></i><?= $beneficiaire['telephonePortable'] ?>
</td>
<td class="text-center" style="font-size:12px">
<span class="text-secondary"><?= $beneficiaire['sexe'] ?></span>
<span class="text-secondary mx-1">·</span>
<?= dateLang($beneficiaire['dateNaissance']) ?><br>
<i class="fa-solid fa-phone text-secondary me-1"
style="font-size:10px"></i>
<span class="text-secondary">
<?= $beneficiaire['telephonePortable'] ?>
</span>
</td>
<td class="fw-semibold"><?= $beneficiaire['nomClient'] ?></td>
<td class="small fw-bold"><?= $beneficiaire['nomClient'] ?></td>
<td class="text-center">
<?php $isActif = ($beneficiaire['codeEtatBeneficiaire'] == 'ACTIF'); ?>
<span class="badge border fw-normal
<?= $isActif ? 'text-success' : 'text-secondary' ?>"
style="font-size:11px">
<i class="fa-solid fa-circle fa-2xs me-1"></i>
<?= $beneficiaire['codeEtatBeneficiaire'] ?>
</span>
<?php
$statusClass = ($beneficiaire['codeEtatBeneficiaire'] == 'ACTIF') ? 'bg-success' : 'bg-secondary';
?>
<span class="badge rounded-pill <?= $statusClass ?>"><?= $beneficiaire['codeEtatBeneficiaire'] ?></span>
</td>
</tr>
<?php endforeach; ?>
<?php else: ?>
<tr>
<td colspan="6" class="text-center text-secondary py-3">
<i class="fa-solid fa-inbox me-2"></i><?= _("Aucun résultat") ?>
</td>
</tr>
<?php endif; ?>
<?php endforeach; ?>
</tbody>
</table>
</div>
</div>
</div><!-- /container -->
<style>
body { background: #F5F5F5; font-size: 13px; color: #212529; }
.card { border: 1px solid #DEE2E6 !important; box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.card-header { background: #fff; border-bottom: 1px solid #DEE2E6; padding: .5rem .75rem; }
.group-label { font-size: 10px; font-weight: 600; text-transform: uppercase;
letter-spacing: .07em; color: #ADB5BD;
border-bottom: 1px solid #F0F0F0; padding-bottom: 4px; margin-bottom: 6px; }
.form-label { font-size: 11px; font-weight: 500; text-transform: uppercase;
letter-spacing: .04em; color: #6C757D; margin-bottom: 3px; }
.section-label { font-size: 11px; font-weight: 500; text-transform: uppercase;
letter-spacing: .06em; color: #6C757D; }
.table th { font-size: 11px; text-transform: uppercase; letter-spacing: .05em;
font-weight: 500; color: #6C757D; }
.table td { font-size: 13px; vertical-align: middle; }
.clickable-row { cursor: pointer; }
.clickable-row:hover td { background: #F8F9FA; }
.input-group-text { background: #fff; border-color: #DEE2E6; color: #6C757D; }
.btn-dark { background: #343A40; border-color: #343A40; }
.btn-dark:hover { background: #23272b; border-color: #23272b; }
</style>
</div>

201
Vue/Recherche/index_test.php Executable file
View File

@ -0,0 +1,201 @@
<div class="container-fluid py-3 px-3">
<!-- SECTION: HEADER -->
<div class="mb-3">
<nav aria-label="breadcrumb">
<ol class="breadcrumb mb-1" style="font-size:12px">
<li class="breadcrumb-item text-secondary">INTER-SANTÉ</li>
<li class="breadcrumb-item active text-dark"><?= _("Recherche assuré") ?></li>
</ol>
</nav>
<h5 class="fw-semibold text-dark mb-0"><?= _("Recherche assuré") ?></h5>
</div>
<!-- SECTION: ALERTE REMPLACEMENT CARTE -->
<?php if (is_array($derniernumerobeneficiaires) && $derniernumerobeneficiaires['nouveau'] > 0): ?>
<div class="d-flex align-items-center gap-2 mb-3 p-3 bg-white rounded"
style="border: 1px solid #DEE2E6; border-left: 3px solid #DC3545;">
<i class="fa-solid fa-triangle-exclamation text-danger" style="font-size:14px"></i>
<div style="font-size:13px">
<strong><?= _("Alerte remplacement") ?> :</strong>
<?= _("Carte") ?>
<span class="badge border text-danger fw-normal ms-1"><?= $derniernumerobeneficiaires['ancien'] ?></span>
<?= _("remplacée par") ?>
<span class="badge border text-success fw-normal ms-1"><?= $derniernumerobeneficiaires['nouveau'] ?></span>
</div>
</div>
<?php endif; ?>
<!-- SECTION: FORMULAIRE RECHERCHE -->
<div class="card mb-3">
<div class="card-header d-flex align-items-center gap-2">
<i class="fa-solid fa-magnifying-glass" style="font-size:12px;color:#6C757D"></i>
<span class="section-label"><?= _("Critères de recherche") ?></span>
</div>
<div class="card-body p-3">
<form id="frmrecherche" name="frmrecherche" method="post" action="Recherche/index/">
<!-- Groupe : Identifiants -->
<div class="group-label"><?= _("Identifiants") ?></div>
<div class="row g-2 mb-3">
<div class="col-md-3">
<label class="form-label" for="numeroBeneficiaire"><?= _("N° Bénéficiaire") ?></label>
<input class="form-control form-control-sm" type="text"
id="numeroBeneficiaire" name="numeroBeneficiaire" autofocus>
</div>
<div class="col-md-3">
<label class="form-label" for="numeroAdherent"><?= _("N° Famille") ?></label>
<input class="form-control form-control-sm" type="text"
id="numeroAdherent" name="numeroAdherent">
</div>
</div>
<!-- Groupe : Identité -->
<div class="group-label"><?= _("Identité") ?></div>
<div class="row g-2 mb-3">
<div class="col-md-3">
<label class="form-label" for="nomBeneficiaire"><?= _("Nom") ?></label>
<input class="form-control form-control-sm" type="text"
id="nomBeneficiaire" name="nomBeneficiaire">
</div>
<div class="col-md-3">
<label class="form-label" for="prenomsBeneficiaire"><?= _("Prénoms") ?></label>
<input class="form-control form-control-sm" type="text"
id="prenomsBeneficiaire" name="prenomsBeneficiaire">
</div>
</div>
<!-- Groupe : Contact + Action -->
<div class="group-label"><?= _("Contact") ?></div>
<div class="row g-2 align-items-end">
<div class="col-md-3">
<label class="form-label" for="telephonePortable"><?= _("Téléphone") ?></label>
<div class="input-group input-group-sm">
<span class="input-group-text">
<i class="fa-solid fa-phone" style="font-size:11px"></i>
</span>
<input class="form-control form-control-sm" type="text"
id="telephonePortable" name="telephonePortable">
</div>
</div>
<div class="col-md-3">
<label class="form-label" for="email">E-mail</label>
<div class="input-group input-group-sm">
<span class="input-group-text">
<i class="fa-solid fa-envelope" style="font-size:11px"></i>
</span>
<input class="form-control form-control-sm" type="email"
id="email" name="email">
</div>
</div>
<div class="col-md-6 d-flex justify-content-end">
<button type="submit" class="btn btn-dark btn-sm px-4">
<i class="fa-solid fa-magnifying-glass me-2"></i><?= _("Rechercher") ?>
</button>
</div>
</div>
</form>
</div>
</div>
<!-- SECTION: RÉSULTATS -->
<div class="card">
<div class="card-header d-flex align-items-center justify-content-between">
<span class="section-label"><?= _("Résultats") ?></span>
<span class="badge border text-secondary fw-normal">
<?= count($beneficiaires) ?> <?= _("trouvé(s)") ?>
</span>
</div>
<div class="table-responsive">
<table class="table table-sm table-hover align-middle mb-0">
<thead class="table-light">
<tr>
<th><?= _("Bénéficiaire") ?></th>
<th><?= _("Identité") ?></th>
<th><?= _("Parenté") ?></th>
<th class="text-center"><?= _("Infos") ?></th>
<th><?= _("Souscripteur") ?></th>
<th class="text-center"><?= _("État") ?></th>
</tr>
</thead>
<tbody>
<?php if (!empty($beneficiaires)): ?>
<?php foreach ($beneficiaires as $beneficiaire): ?>
<tr class="clickable-row" onclick="...">
<td>
<span class="fw-semibold text-dark">
#<?= $beneficiaire['numeroBeneficiaire'] ?>
</span><br>
<small class="text-secondary">
Fam: <?= $beneficiaire['numeroAdherent'] ?>
</small>
</td>
<td>
<div class="fw-semibold">
<?= strtoupper($beneficiaire['nomBeneficiaire']) ?>
</div>
<div class="text-secondary" style="font-size:12px">
<?= $beneficiaire['prenomsBeneficiaire'] ?>
</div>
</td>
<td>
<span class="badge border text-secondary fw-normal">
<?= $beneficiaire['codeLienParente'] ?>
</span>
</td>
<td class="text-center" style="font-size:12px">
<span class="text-secondary"><?= $beneficiaire['sexe'] ?></span>
<span class="text-secondary mx-1">·</span>
<?= dateLang($beneficiaire['dateNaissance']) ?><br>
<i class="fa-solid fa-phone text-secondary me-1"
style="font-size:10px"></i>
<span class="text-secondary">
<?= $beneficiaire['telephonePortable'] ?>
</span>
</td>
<td class="fw-semibold"><?= $beneficiaire['nomClient'] ?></td>
<td class="text-center">
<?php $isActif = ($beneficiaire['codeEtatBeneficiaire'] == 'ACTIF'); ?>
<span class="badge border fw-normal
<?= $isActif ? 'text-success' : 'text-secondary' ?>"
style="font-size:11px">
<i class="fa-solid fa-circle fa-2xs me-1"></i>
<?= $beneficiaire['codeEtatBeneficiaire'] ?>
</span>
</td>
</tr>
<?php endforeach; ?>
<?php else: ?>
<tr>
<td colspan="6" class="text-center text-secondary py-3">
<i class="fa-solid fa-inbox me-2"></i><?= _("Aucun résultat") ?>
</td>
</tr>
<?php endif; ?>
</tbody>
</table>
</div>
</div>
</div><!-- /container -->
<style>
body { background: #F5F5F5; font-size: 13px; color: #212529; }
.card { border: 1px solid #DEE2E6 !important; box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.card-header { background: #fff; border-bottom: 1px solid #DEE2E6; padding: .5rem .75rem; }
.group-label { font-size: 10px; font-weight: 600; text-transform: uppercase;
letter-spacing: .07em; color: #ADB5BD;
border-bottom: 1px solid #F0F0F0; padding-bottom: 4px; margin-bottom: 6px; }
.form-label { font-size: 11px; font-weight: 500; text-transform: uppercase;
letter-spacing: .04em; color: #6C757D; margin-bottom: 3px; }
.section-label { font-size: 11px; font-weight: 500; text-transform: uppercase;
letter-spacing: .06em; color: #6C757D; }
.table th { font-size: 11px; text-transform: uppercase; letter-spacing: .05em;
font-weight: 500; color: #6C757D; }
.table td { font-size: 13px; vertical-align: middle; }
.clickable-row { cursor: pointer; }
.clickable-row:hover td { background: #F8F9FA; }
.input-group-text { background: #fff; border-color: #DEE2E6; color: #6C757D; }
.btn-dark { background: #343A40; border-color: #343A40; }
.btn-dark:hover { background: #23272b; border-color: #23272b; }
</style>