Modèle:Documentation/styles.css

/* ======================
   SYSTÈME DE DOCUMENTATION
   Compatible Citizen light/dark
   ====================== */

.nef-doc-system {
margin: 1.5em 0;
}

/* ======================
   BARRE SIMPLE
   ====================== */
.nef-doc-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 12px;
background-color: var(--color-surface-2);
border: 1px solid var(--color-surface-3);
border-radius: 4px 4px 0 0;
font-size: 13px;
}

.nef-doc-header-content {
display: flex;
align-items: center;
gap: 8px;
color: var(--color-base);
font-weight: var(--font-weight-semibold);
}

.nef-doc-header-icon {
font-size: 16px;
opacity: 0.7;
}

.nef-doc-header-actions {
display: flex;
gap: 8px;
}

.nef-doc-btn {
display: inline-block;
padding: 4px 8px;
background: var(--color-surface-1);
border: 1px solid var(--color-surface-3);
border-radius: 3px;
font-size: 12px;
transition: background-color 0.2s ease;
}

.nef-doc-btn a {
color: var(--color-base) !important;
text-decoration: none !important;
}

.nef-doc-btn:hover {
background: var(--color-surface-3);
}

.nef-doc-btn-create {
border-color: var(--color-success);
}

.nef-doc-btn-create a {
color: var(--color-success) !important;
}

/* ======================
   BOÎTES DE DOCUMENTATION
   ====================== */
.nef-doc-box {
border: 1px solid var(--color-surface-3);
border-top: none;
border-radius: 0 0 4px 4px;
padding: 1.5em;
background-color: var(--color-surface-1);
}

.nef-doc-exists {
border-left: 3px solid var(--color-success);
}

.nef-doc-missing {
display: flex;
align-items: flex-start;
gap: 1em;
background-color: var(--color-surface-2);
border-left: 3px solid var(--color-destructive);
}

.nef-doc-icon {
font-size: 2em;
opacity: 0.6;
flex-shrink: 0;
}

.nef-doc-content {
flex: 1;
}

.nef-doc-instructions {
background-color: var(--color-surface-2);
padding: 1em;
border-radius: 4px;
margin-top: 1em;
border-left: 3px solid var(--color-progressive);
color: var(--color-base);
}

.nef-doc-instructions ul {
margin: 0.5em 0 0 0;
padding-left: 1.5em;
}

.nef-doc-box a {
color: var(--color-progressive);
}

/* ======================
   RESPONSIVE
   ====================== */
@media (max-width: 640px) {
.nef-doc-header {
flex-direction: column;
align-items: stretch;
gap: 8px;
}

.nef-doc-header-content {
justify-content: center;
}

.nef-doc-header-actions {
justify-content: center;
}

.nef-doc-missing {
flex-direction: column;
text-align: center;
}

.nef-doc-icon {
margin: 0 auto;
}
}