/* ==========================================================================
   MÓDULO CONSEJO (KRAAL): CAJAS PROPIAS DEL PANEL
   Capa: módulos.
   Separado el 19/10/2026 de css/paneles-scout-tabla.css (migración CSS por
   capas, ver CLAUDE.md "Arquitectura CSS"), con las reglas tal cual.
   ========================================================================== */

/* Caja de contenido con el mismo estilo que la caja de arriba (20/08/2026,
   a petición expresa: "dale el mismo estilo a la caja siguiente, la que
   muestra un contenido según la elección de la primera caja"). Marcador
   propio ".panel-kraal-contenido" — ".panel-admin-contenido" a secas
   también la usan Secretaría/Roles/Tienda, que no se han homogeneizado
   todavía (ver comentario en inc/shortcodes-panel-scouter.php). Mismos
   valores que ".panel-admin-chrome". */
.panel-kraal-contenido {
    background: var(--wp--preset--color--base);
    border: 1px solid #D1D5DB;
    border-radius: var(--wp--custom--radio--tarjeta);
    padding: 16px;
    box-sizing: border-box;
}
/* Botones "Crear"/"Gestionar" (Eventos Recurrentes) — separación del
   contenido de debajo (antes la ponía el "border-bottom" de
   ".panel-subtabs-nav", ya no aplica al ser botones en vez de pestañas).
   Alineados a la derecha (21/08/2026, a petición expresa) — hereda
   "justify-content" de ".scout-fila-acciones-cabecera"
   (backend-form-edicion-post.css), que por defecto no fija ninguno
   (queda a la izquierda); se sobreescribe solo aquí, no en el resto de
   usos de esa clase (la cabecera de Editar Evento, que sigue igual). */
.panel-kraal-subacciones {
    margin-bottom: var(--wp--preset--spacing--lg);
    justify-content: flex-end;
}

/* Relleno lateral recortado en móvil: ver el comentario completo en
   css/layout/panel-admin.css (misma regla para .panel-admin-chrome). */
@media (max-width: 640px) {
    .panel-kraal-contenido {
        padding: 14px 8px;
    }
}