/* ====================================================================
 * detail-split.css
 * --------------------------------------------------------------------
 * Styles dédiés au right-panel Detail des modes Split / SplitMap
 * (vue : list-modes:views/record/detail-split).
 *
 * IMPORTANT : tout sélecteur DOIT être préfixé par `.detail-split-panel`
 * pour rester scopé à ce contexte et NE PAS impacter les autres pages
 * Detail natives EspoCRM.
 *
 * Le marker `.detail-split-panel` est ajouté en `afterRender` sur le
 * `<div class="detail">` racine du template natif `record/detail.tpl`.
 *
 * STRUCTURE DOM (depuis Espo/core/client/res/templates/record/detail.tpl)
 *   .detail.detail-split-panel
 *   ├── .detail-button-container.record-buttons       (boutons header)
 *   ├── .detail-button-container.edit-buttons (hidden) (boutons edit)
 *   └── .record-grid
 *       ├── .left
 *       │   ├── .tabs.middle-tabs (si onglets)
 *       │   ├── .middle           (champs principaux)
 *       │   ├── .extra
 *       │   └── .bottom           (bottom panels : stream, etc.)
 *       └── .side                 (panneau latéral droit)
 *
 * CSS natif chargé : Espo/core/client/css/espo/espo.css (bundlé/minifié)
 * Inspecter via DevTools pour voir les règles à override.
 *
 * Conteneur parent (déjà stylé dans list-with-modes.css) :
 *   body.list-modes-page .right-panel.split-mode > .detail-split-panel
 * ==================================================================== */


/* ─── Exemples (à compléter par le designer) ─────────────────────── */

/* Exemple 1 — réduire le padding du header
.detail-split-panel .detail-button-container.record-buttons {
    padding: 4px 8px;
}
*/

/* Exemple 2 — masquer le side panel sur SplitMap (gain d'espace)
.detail-split-panel .record-grid > .side {
    display: none;
}
.detail-split-panel .record-grid > .left {
    width: 100%;
}
*/

/* Exemple 3 — bottom panel plus compact
.detail-split-panel .bottom .panel {
    margin-bottom: 8px;
}
*/

/* Exemple 4 — accent visuel sur le titre
.detail-split-panel .field[data-name="name"] {
    font-size: 1.2em;
    border-bottom: 1px solid var(--gray-light);
    padding-bottom: 8px;
    margin-bottom: 12px;
}
*/