diff --git a/Dockerfile.prod b/Dockerfile.prod new file mode 100644 index 0000000..012e4b9 --- /dev/null +++ b/Dockerfile.prod @@ -0,0 +1,85 @@ +#### +# Dockerfile de production pour Lions User Manager Client (Frontend) +# Multi-stage build optimisé avec sécurité renforcée +# Basé sur la structure de btpxpress-client +#### + +## Stage 1 : Build avec Maven +FROM maven:3.9.6-eclipse-temurin-17 AS builder + +WORKDIR /app + +# Copier pom.xml et télécharger les dépendances (cache Docker) +COPY pom.xml . +RUN mvn dependency:go-offline -B + +# Copier le code source +COPY src ./src + +# Build de l'application avec profil production (fast-jar par défaut) +RUN mvn clean package -DskipTests -B -Dquarkus.profile=prod + +## Stage 2 : Image de production optimisée et sécurisée +FROM registry.access.redhat.com/ubi8/openjdk-17:1.18 + +ENV LANGUAGE='fr_FR:fr' + +# Variables d'environnement de production +# Ces valeurs peuvent être surchargées via docker-compose ou Kubernetes +ENV QUARKUS_PROFILE=prod +ENV QUARKUS_HTTP_PORT=8080 +ENV QUARKUS_HTTP_HOST=0.0.0.0 + +# Configuration Keycloak/OIDC (production) +ENV QUARKUS_OIDC_AUTH_SERVER_URL=https://security.lions.dev/realms/master +ENV QUARKUS_OIDC_CLIENT_ID=lions-user-manager-client +ENV QUARKUS_OIDC_ENABLED=true +ENV QUARKUS_OIDC_TLS_VERIFICATION=required + +# Configuration API Backend +ENV LIONS_USER_MANAGER_BACKEND_URL=https://api.lions.dev/lions-user-manager + +# Configuration CORS +ENV QUARKUS_HTTP_CORS_ORIGINS=https://user-manager.lions.dev,https://admin.lions.dev +ENV QUARKUS_HTTP_CORS_ALLOW_CREDENTIALS=true + +# Installer curl pour les health checks +USER root +RUN microdnf install -y curl && \ + microdnf clean all && \ + rm -rf /var/cache/yum + +# Créer les répertoires et permissions pour utilisateur non-root +RUN mkdir -p /deployments /app/logs && \ + chown -R 185:185 /deployments /app/logs + +# Passer à l'utilisateur non-root pour la sécurité +USER 185 + +# Copier l'application depuis le builder (format fast-jar Quarkus) +COPY --from=builder --chown=185 /app/target/quarkus-app/ /deployments/ + +# Exposer le port +EXPOSE 8080 + +# Variables JVM optimisées pour production avec sécurité +ENV JAVA_OPTS="-Xmx768m -Xms256m \ + -XX:+UseG1GC \ + -XX:MaxGCPauseMillis=200 \ + -XX:+UseStringDeduplication \ + -XX:+ParallelRefProcEnabled \ + -XX:+HeapDumpOnOutOfMemoryError \ + -XX:HeapDumpPath=/app/logs/heapdump.hprof \ + -Djava.security.egd=file:/dev/./urandom \ + -Djava.awt.headless=true \ + -Dfile.encoding=UTF-8 \ + -Djava.util.logging.manager=org.jboss.logmanager.LogManager \ + -Dquarkus.profile=${QUARKUS_PROFILE}" + +# Health check avec endpoints Quarkus +HEALTHCHECK --interval=30s --timeout=10s --start-period=90s --retries=3 \ + CMD curl -f http://localhost:8080/q/health/ready || exit 1 + +# Point d'entrée avec profil production (format fast-jar) +ENTRYPOINT ["sh", "-c", "exec java $JAVA_OPTS -jar /deployments/quarkus-run.jar"] + diff --git a/pom.xml b/pom.xml index 874bd84..71aafee 100644 --- a/pom.xml +++ b/pom.xml @@ -27,7 +27,7 @@ io.quarkiverse.primefaces quarkus-primefaces - 3.13.3 + 3.15.1 @@ -58,6 +58,26 @@ jakarta + + + org.primefaces.themes + freya-theme-jakarta + 5.0.0 + + + + + io.quarkiverse.omnifaces + quarkus-omnifaces + 4.4.1 + + + + + io.quarkus + quarkus-undertow + + org.projectlombok diff --git a/src/main/java/dev/lions/user/manager/client/filter/AuthHeaderFactory.java b/src/main/java/dev/lions/user/manager/client/filter/AuthHeaderFactory.java new file mode 100644 index 0000000..06d29bc --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/filter/AuthHeaderFactory.java @@ -0,0 +1,52 @@ +package dev.lions.user.manager.client.filter; + +import jakarta.enterprise.context.ApplicationScoped; +import jakarta.inject.Inject; +import jakarta.ws.rs.core.MultivaluedHashMap; +import jakarta.ws.rs.core.MultivaluedMap; +import org.eclipse.microprofile.jwt.JsonWebToken; +import org.eclipse.microprofile.rest.client.ext.ClientHeadersFactory; + +import java.util.logging.Logger; + +/** + * Factory pour ajouter automatiquement le token OIDC Bearer + * dans les headers des requêtes REST Client vers le backend. + * + * Ce factory est nécessaire car bearer-token-propagation ne fonctionne pas + * pour les appels depuis les managed beans JSF vers le backend. + * + * @author Lions User Manager + * @version 1.0.0 + */ +@ApplicationScoped +public class AuthHeaderFactory implements ClientHeadersFactory { + + private static final Logger LOGGER = Logger.getLogger(AuthHeaderFactory.class.getName()); + + @Inject + JsonWebToken jwt; + + @Override + public MultivaluedMap update( + MultivaluedMap incomingHeaders, + MultivaluedMap clientOutgoingHeaders) { + + MultivaluedMap result = new MultivaluedHashMap<>(); + + try { + // Vérifier si le JWT est disponible et non expiré + if (jwt != null && jwt.getRawToken() != null && !jwt.getRawToken().isEmpty()) { + String token = jwt.getRawToken(); + result.add("Authorization", "Bearer " + token); + LOGGER.fine("Token Bearer ajouté au header Authorization"); + } else { + LOGGER.warning("Token JWT non disponible ou vide - impossible d'ajouter le header Authorization"); + } + } catch (Exception e) { + LOGGER.severe("Erreur lors de l'ajout du token Bearer: " + e.getMessage()); + } + + return result; + } +} diff --git a/src/main/java/dev/lions/user/manager/client/service/AuditServiceClient.java b/src/main/java/dev/lions/user/manager/client/service/AuditServiceClient.java new file mode 100644 index 0000000..39c5d3a --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/service/AuditServiceClient.java @@ -0,0 +1,108 @@ +package dev.lions.user.manager.client.service; + +import dev.lions.user.manager.client.filter.AuthHeaderFactory; +import dev.lions.user.manager.dto.audit.AuditLogDTO; +import dev.lions.user.manager.enums.audit.TypeActionAudit; +import jakarta.ws.rs.*; +import jakarta.ws.rs.core.MediaType; +import org.eclipse.microprofile.rest.client.annotation.RegisterClientHeaders; +import org.eclipse.microprofile.rest.client.inject.RegisterRestClient; + +import java.time.LocalDateTime; +import java.util.List; +import java.util.Map; + +/** + * REST Client pour le service d'audit + */ +@Path("/api/audit") +@RegisterRestClient(configKey = "lions-user-manager-api") +@RegisterClientHeaders(AuthHeaderFactory.class) +@Produces(MediaType.APPLICATION_JSON) +@Consumes(MediaType.APPLICATION_JSON) +public interface AuditServiceClient { + + @POST + @Path("/search") + List searchLogs( + @QueryParam("acteur") String acteurUsername, + @QueryParam("dateDebut") String dateDebut, + @QueryParam("dateFin") String dateFin, + @QueryParam("typeAction") TypeActionAudit typeAction, + @QueryParam("ressourceType") String ressourceType, + @QueryParam("succes") Boolean succes, + @QueryParam("page") @DefaultValue("0") int page, + @QueryParam("pageSize") @DefaultValue("50") int pageSize + ); + + @GET + @Path("/acteur/{acteurUsername}") + List getLogsByActeur( + @PathParam("acteurUsername") String acteurUsername, + @QueryParam("limit") @DefaultValue("100") int limit + ); + + @GET + @Path("/realm/{realmName}") + List getLogsByRealm( + @PathParam("realmName") String realmName, + @QueryParam("dateDebut") String dateDebut, + @QueryParam("dateFin") String dateFin, + @QueryParam("page") @DefaultValue("0") int page, + @QueryParam("pageSize") @DefaultValue("50") int pageSize + ); + + @GET + @Path("/ressource/{ressourceType}/{ressourceId}") + List getLogsByRessource( + @PathParam("ressourceType") String ressourceType, + @PathParam("ressourceId") String ressourceId, + @QueryParam("limit") @DefaultValue("100") int limit + ); + + @GET + @Path("/action/{typeAction}") + List getLogsByAction( + @PathParam("typeAction") TypeActionAudit typeAction, + @QueryParam("dateDebut") String dateDebut, + @QueryParam("dateFin") String dateFin, + @QueryParam("limit") @DefaultValue("100") int limit + ); + + @GET + @Path("/statistics/actions") + Map getActionStatistics( + @QueryParam("dateDebut") String dateDebut, + @QueryParam("dateFin") String dateFin + ); + + @GET + @Path("/statistics/users") + Map getUserActivityStatistics( + @QueryParam("dateDebut") String dateDebut, + @QueryParam("dateFin") String dateFin + ); + + @GET + @Path("/statistics/failures") + Long getFailureCount( + @QueryParam("dateDebut") String dateDebut, + @QueryParam("dateFin") String dateFin + ); + + @GET + @Path("/statistics/successes") + Long getSuccessCount( + @QueryParam("dateDebut") String dateDebut, + @QueryParam("dateFin") String dateFin + ); + + @GET + @Path("/export/csv") + @Produces("text/csv") + String exportLogsToCSV( + @QueryParam("dateDebut") String dateDebut, + @QueryParam("dateFin") String dateFin + ); +} + diff --git a/src/main/java/dev/lions/user/manager/client/service/RestClientExceptionMapper.java b/src/main/java/dev/lions/user/manager/client/service/RestClientExceptionMapper.java new file mode 100644 index 0000000..4e90b0d --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/service/RestClientExceptionMapper.java @@ -0,0 +1,112 @@ +package dev.lions.user.manager.client.service; + +import com.fasterxml.jackson.databind.JsonNode; +import com.fasterxml.jackson.databind.ObjectMapper; +import jakarta.ws.rs.core.MultivaluedMap; +import jakarta.ws.rs.core.Response; +import org.eclipse.microprofile.rest.client.ext.ResponseExceptionMapper; + +/** + * Mapper d'exceptions pour les clients REST + * Convertit les réponses HTTP d'erreur en exceptions appropriées + */ +public class RestClientExceptionMapper implements ResponseExceptionMapper { + + private static final ObjectMapper objectMapper = new ObjectMapper(); + + @Override + public RuntimeException toThrowable(Response response) { + int status = response.getStatus(); + String reasonPhrase = response.getStatusInfo().getReasonPhrase(); + + // Lire le corps de la réponse pour plus de détails + String errorMessage = reasonPhrase; + try { + if (response.hasEntity()) { + String body = response.readEntity(String.class); + if (body != null && !body.isEmpty()) { + // Essayer de parser le JSON pour extraire le message + try { + JsonNode jsonNode = objectMapper.readTree(body); + if (jsonNode.has("message")) { + errorMessage = jsonNode.get("message").asText(); + } else { + errorMessage = body; + } + } catch (Exception e) { + // Si ce n'est pas du JSON, utiliser le body tel quel + errorMessage = body; + } + } + } + } catch (Exception e) { + // Ignorer les erreurs de lecture du body + } + + return switch (status) { + case 400 -> new BadRequestException("Requête invalide: " + errorMessage); + case 401 -> new UnauthorizedException("Non autorisé: " + errorMessage); + case 403 -> new ForbiddenException("Accès interdit: " + errorMessage); + case 404 -> new NotFoundException(errorMessage); + case 409 -> new ConflictException("Conflit: " + errorMessage); + case 422 -> new UnprocessableEntityException("Données non valides: " + errorMessage); + case 500 -> new InternalServerErrorException("Erreur serveur interne: " + errorMessage); + case 502 -> new BadGatewayException("Erreur de passerelle: " + errorMessage); + case 503 -> new ServiceUnavailableException("Service indisponible: " + errorMessage); + case 504 -> new GatewayTimeoutException("Timeout de passerelle: " + errorMessage); + default -> new UnknownHttpStatusException("Erreur HTTP " + status + ": " + errorMessage); + }; + } + + @Override + public boolean handles(int status, MultivaluedMap headers) { + // Gérer tous les codes d'erreur HTTP (>= 400) + return status >= 400; + } + + // Classes d'exception personnalisées + public static class BadRequestException extends RuntimeException { + public BadRequestException(String message) { super(message); } + } + + public static class UnauthorizedException extends RuntimeException { + public UnauthorizedException(String message) { super(message); } + } + + public static class ForbiddenException extends RuntimeException { + public ForbiddenException(String message) { super(message); } + } + + public static class NotFoundException extends RuntimeException { + public NotFoundException(String message) { super(message); } + } + + public static class ConflictException extends RuntimeException { + public ConflictException(String message) { super(message); } + } + + public static class UnprocessableEntityException extends RuntimeException { + public UnprocessableEntityException(String message) { super(message); } + } + + public static class InternalServerErrorException extends RuntimeException { + public InternalServerErrorException(String message) { super(message); } + } + + public static class BadGatewayException extends RuntimeException { + public BadGatewayException(String message) { super(message); } + } + + public static class ServiceUnavailableException extends RuntimeException { + public ServiceUnavailableException(String message) { super(message); } + } + + public static class GatewayTimeoutException extends RuntimeException { + public GatewayTimeoutException(String message) { super(message); } + } + + public static class UnknownHttpStatusException extends RuntimeException { + public UnknownHttpStatusException(String message) { super(message); } + } +} + diff --git a/src/main/java/dev/lions/user/manager/client/service/RoleServiceClient.java b/src/main/java/dev/lions/user/manager/client/service/RoleServiceClient.java new file mode 100644 index 0000000..bf561a3 --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/service/RoleServiceClient.java @@ -0,0 +1,138 @@ +package dev.lions.user.manager.client.service; + +import dev.lions.user.manager.client.filter.AuthHeaderFactory; +import dev.lions.user.manager.dto.role.RoleAssignmentDTO; +import dev.lions.user.manager.dto.role.RoleDTO; +import dev.lions.user.manager.enums.role.TypeRole; +import jakarta.ws.rs.*; +import jakarta.ws.rs.core.MediaType; +import org.eclipse.microprofile.rest.client.annotation.RegisterClientHeaders; +import org.eclipse.microprofile.rest.client.inject.RegisterRestClient; + +import java.util.List; + +/** + * REST Client pour le service de gestion des rôles + */ +@Path("/api/roles") +@RegisterRestClient(configKey = "lions-user-manager-api") +@RegisterClientHeaders(AuthHeaderFactory.class) +@Produces(MediaType.APPLICATION_JSON) +@Consumes(MediaType.APPLICATION_JSON) +public interface RoleServiceClient { + + // ==================== Realm Roles ==================== + + @POST + @Path("/realm") + RoleDTO createRealmRole( + RoleDTO role, + @QueryParam("realm") String realmName + ); + + @GET + @Path("/realm/{roleName}") + RoleDTO getRealmRoleByName( + @PathParam("roleName") String roleName, + @QueryParam("realm") String realmName + ); + + @GET + @Path("/realm") + List getAllRealmRoles( + @QueryParam("realm") String realmName + ); + + @PUT + @Path("/realm/{roleName}") + RoleDTO updateRealmRole( + @PathParam("roleName") String roleName, + RoleDTO role, + @QueryParam("realm") String realmName + ); + + @DELETE + @Path("/realm/{roleName}") + void deleteRealmRole( + @PathParam("roleName") String roleName, + @QueryParam("realm") String realmName + ); + + // ==================== Client Roles ==================== + + @POST + @Path("/client") + RoleDTO createClientRole( + RoleDTO role, + @QueryParam("realm") String realmName, + @QueryParam("clientName") String clientName + ); + + @GET + @Path("/client") + List getAllClientRoles( + @QueryParam("realm") String realmName, + @QueryParam("clientName") String clientName + ); + + @GET + @Path("/client/{roleName}") + RoleDTO getClientRoleByName( + @PathParam("roleName") String roleName, + @QueryParam("realm") String realmName, + @QueryParam("clientName") String clientName + ); + + @DELETE + @Path("/client/{roleName}") + void deleteClientRole( + @PathParam("roleName") String roleName, + @QueryParam("realm") String realmName, + @QueryParam("clientName") String clientName + ); + + // ==================== Role Assignment ==================== + + @POST + @Path("/assign") + void assignRoleToUser(RoleAssignmentDTO assignment); + + @POST + @Path("/revoke") + void revokeRoleFromUser(RoleAssignmentDTO assignment); + + @GET + @Path("/user/{userId}") + List getUserRoles( + @PathParam("userId") String userId, + @QueryParam("realm") String realmName + ); + + // ==================== Composite Roles ==================== + + @GET + @Path("/composite/{roleName}") + List getCompositeRoles( + @PathParam("roleName") String roleName, + @QueryParam("realm") String realmName, + @QueryParam("typeRole") TypeRole typeRole, + @QueryParam("clientName") String clientName + ); + + @POST + @Path("/composite/{roleName}/add") + void addCompositeRole( + @PathParam("roleName") String roleName, + @QueryParam("realm") String realmName, + @QueryParam("compositeRoleName") String compositeRoleName + ); + + @DELETE + @Path("/composite/{roleName}/remove") + void removeCompositeRole( + @PathParam("roleName") String roleName, + @QueryParam("realm") String realmName, + @QueryParam("compositeRoleName") String compositeRoleName + ); +} + diff --git a/src/main/java/dev/lions/user/manager/client/service/SyncServiceClient.java b/src/main/java/dev/lions/user/manager/client/service/SyncServiceClient.java new file mode 100644 index 0000000..42c8029 --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/service/SyncServiceClient.java @@ -0,0 +1,56 @@ +package dev.lions.user.manager.client.service; + +import dev.lions.user.manager.client.filter.AuthHeaderFactory; +import dev.lions.user.manager.dto.sync.HealthStatusDTO; +import dev.lions.user.manager.dto.sync.SyncResultDTO; +import jakarta.ws.rs.*; +import jakarta.ws.rs.core.MediaType; +import org.eclipse.microprofile.rest.client.annotation.RegisterClientHeaders; +import org.eclipse.microprofile.rest.client.inject.RegisterRestClient; + +/** + * REST Client pour le service de synchronisation + */ +@Path("/api/sync") +@RegisterRestClient(configKey = "lions-user-manager-api") +@RegisterClientHeaders(AuthHeaderFactory.class) +@Produces(MediaType.APPLICATION_JSON) +@Consumes(MediaType.APPLICATION_JSON) +public interface SyncServiceClient { + + @GET + @Path("/health") + HealthStatusDTO checkHealth(@QueryParam("realm") String realmName); + + @GET + @Path("/health/keycloak") + HealthStatusDTO checkKeycloakHealth(); + + @POST + @Path("/users") + SyncResultDTO syncUsers(@QueryParam("realm") String realmName); + + @POST + @Path("/roles") + SyncResultDTO syncRoles( + @QueryParam("realm") String realmName, + @QueryParam("clientName") String clientName + ); + + @GET + @Path("/exists/user/{username}") + Boolean userExists( + @PathParam("username") String username, + @QueryParam("realm") String realmName + ); + + @GET + @Path("/exists/role/{roleName}") + Boolean roleExists( + @PathParam("roleName") String roleName, + @QueryParam("realm") String realmName, + @QueryParam("typeRole") String typeRole, + @QueryParam("clientName") String clientName + ); +} + diff --git a/src/main/java/dev/lions/user/manager/client/service/UserServiceClient.java b/src/main/java/dev/lions/user/manager/client/service/UserServiceClient.java new file mode 100644 index 0000000..6d4f97c --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/service/UserServiceClient.java @@ -0,0 +1,146 @@ +package dev.lions.user.manager.client.service; + +import dev.lions.user.manager.client.filter.AuthHeaderFactory; +import dev.lions.user.manager.client.service.RestClientExceptionMapper; +import dev.lions.user.manager.dto.user.UserDTO; +import dev.lions.user.manager.dto.user.UserSearchCriteriaDTO; +import dev.lions.user.manager.dto.user.UserSearchResultDTO; +import jakarta.ws.rs.*; +import jakarta.ws.rs.core.MediaType; +import org.eclipse.microprofile.rest.client.annotation.RegisterClientHeaders; +import org.eclipse.microprofile.rest.client.annotation.RegisterProvider; +import org.eclipse.microprofile.rest.client.inject.RegisterRestClient; + +import java.util.List; + +/** + * REST Client pour le service de gestion des utilisateurs + * Interface pour communiquer avec l'API backend + */ +@Path("/api/users") +@RegisterRestClient(configKey = "lions-user-manager-api") +@RegisterClientHeaders(AuthHeaderFactory.class) +@RegisterProvider(RestClientExceptionMapper.class) +@Produces(MediaType.APPLICATION_JSON) +@Consumes(MediaType.APPLICATION_JSON) +public interface UserServiceClient { + + /** + * Rechercher des utilisateurs selon des critères + */ + @POST + @Path("/search") + UserSearchResultDTO searchUsers(UserSearchCriteriaDTO criteria); + + /** + * Récupérer un utilisateur par ID + */ + @GET + @Path("/{userId}") + UserDTO getUserById( + @PathParam("userId") String userId, + @QueryParam("realm") String realmName + ); + + /** + * Lister tous les utilisateurs (paginé) + */ + @GET + UserSearchResultDTO getAllUsers( + @QueryParam("realm") String realmName, + @QueryParam("page") @DefaultValue("0") int page, + @QueryParam("pageSize") @DefaultValue("20") int pageSize + ); + + /** + * Créer un nouvel utilisateur + */ + @POST + UserDTO createUser( + UserDTO user, + @QueryParam("realm") String realmName + ); + + /** + * Mettre à jour un utilisateur + */ + @PUT + @Path("/{userId}") + UserDTO updateUser( + @PathParam("userId") String userId, + UserDTO user, + @QueryParam("realm") String realmName + ); + + /** + * Supprimer un utilisateur + */ + @DELETE + @Path("/{userId}") + void deleteUser( + @PathParam("userId") String userId, + @QueryParam("realm") String realmName + ); + + /** + * Activer un utilisateur + */ + @POST + @Path("/{userId}/activate") + void activateUser( + @PathParam("userId") String userId, + @QueryParam("realm") String realmName + ); + + /** + * Désactiver un utilisateur + */ + @POST + @Path("/{userId}/deactivate") + void deactivateUser( + @PathParam("userId") String userId, + @QueryParam("realm") String realmName + ); + + /** + * Réinitialiser le mot de passe + */ + @POST + @Path("/{userId}/reset-password") + void resetPassword( + @PathParam("userId") String userId, + @QueryParam("realm") String realmName, + @QueryParam("newPassword") String newPassword + ); + + /** + * Envoyer un email de vérification + */ + @POST + @Path("/{userId}/send-verification-email") + void sendVerificationEmail( + @PathParam("userId") String userId, + @QueryParam("realm") String realmName + ); + + /** + * Déconnecter toutes les sessions d'un utilisateur + */ + @POST + @Path("/{userId}/logout-sessions") + void logoutAllSessions( + @PathParam("userId") String userId, + @QueryParam("realm") String realmName + ); + + /** + * Récupérer les sessions actives d'un utilisateur + */ + @GET + @Path("/{userId}/sessions") + List getActiveSessions( + @PathParam("userId") String userId, + @QueryParam("realm") String realmName + ); +} + diff --git a/src/main/java/dev/lions/user/manager/client/view/AuditConsultationBean.java b/src/main/java/dev/lions/user/manager/client/view/AuditConsultationBean.java new file mode 100644 index 0000000..25cf922 --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/view/AuditConsultationBean.java @@ -0,0 +1,225 @@ +package dev.lions.user.manager.client.view; + +import dev.lions.user.manager.client.service.AuditServiceClient; +import dev.lions.user.manager.dto.audit.AuditLogDTO; +import dev.lions.user.manager.enums.audit.TypeActionAudit; +import jakarta.annotation.PostConstruct; +import jakarta.faces.application.FacesMessage; +import jakarta.faces.context.FacesContext; +import jakarta.faces.view.ViewScoped; +import jakarta.inject.Inject; +import jakarta.inject.Named; +import lombok.Data; +import org.eclipse.microprofile.rest.client.inject.RestClient; + +import java.io.Serializable; +import java.time.LocalDateTime; +import java.time.format.DateTimeFormatter; +import java.util.ArrayList; +import java.util.List; +import java.util.Map; +import java.util.logging.Logger; + +/** + * Bean JSF pour la consultation des logs d'audit + * + * @author Lions User Manager + * @version 1.0.0 + */ +@Named("auditConsultationBean") +@ViewScoped +@Data +public class AuditConsultationBean implements Serializable { + + private static final long serialVersionUID = 1L; + private static final Logger LOGGER = Logger.getLogger(AuditConsultationBean.class.getName()); + + @Inject + @RestClient + private AuditServiceClient auditServiceClient; + + // Liste des logs + private List auditLogs = new ArrayList<>(); + private AuditLogDTO selectedLog; + + // Filtres de recherche + private String acteurUsername; + private LocalDateTime dateDebut; + private LocalDateTime dateFin; + private TypeActionAudit selectedTypeAction; + private String ressourceType; + private Boolean succes; + + // Pagination + private int currentPage = 0; + private int pageSize = 50; + private long totalRecords = 0; + + // Statistiques + private Map actionStatistics; + private Map userActivityStatistics; + private Long failureCount = 0L; + private Long successCount = 0L; + + // Options + private List typeActionOptions = List.of(TypeActionAudit.values()); + private List availableRealms = new ArrayList<>(); + + private static final DateTimeFormatter DATE_FORMATTER = DateTimeFormatter.ofPattern("yyyy-MM-dd'T'HH:mm:ss"); + + @PostConstruct + public void init() { + loadRealms(); + loadStatistics(); + } + + /** + * Rechercher des logs d'audit + */ + public void searchLogs() { + try { + String dateDebutStr = dateDebut != null ? dateDebut.format(DATE_FORMATTER) : null; + String dateFinStr = dateFin != null ? dateFin.format(DATE_FORMATTER) : null; + + auditLogs = auditServiceClient.searchLogs( + acteurUsername, + dateDebutStr, + dateFinStr, + selectedTypeAction, + ressourceType, + succes, + currentPage, + pageSize + ); + + totalRecords = auditLogs.size(); + addSuccessMessage("Recherche effectuée: " + totalRecords + " résultat(s) trouvé(s)"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la recherche: " + e.getMessage()); + addErrorMessage("Erreur lors de la recherche: " + e.getMessage()); + } + } + + /** + * Charger les logs par acteur + */ + public void loadLogsByActeur(String username) { + try { + auditLogs = auditServiceClient.getLogsByActeur(username, 100); + totalRecords = auditLogs.size(); + } catch (Exception e) { + LOGGER.severe("Erreur lors du chargement: " + e.getMessage()); + addErrorMessage("Erreur lors du chargement: " + e.getMessage()); + } + } + + /** + * Charger les logs par realm + */ + public void loadLogsByRealm(String realmName) { + try { + String dateDebutStr = dateDebut != null ? dateDebut.format(DATE_FORMATTER) : null; + String dateFinStr = dateFin != null ? dateFin.format(DATE_FORMATTER) : null; + + auditLogs = auditServiceClient.getLogsByRealm( + realmName, + dateDebutStr, + dateFinStr, + currentPage, + pageSize + ); + + totalRecords = auditLogs.size(); + } catch (Exception e) { + LOGGER.severe("Erreur lors du chargement: " + e.getMessage()); + addErrorMessage("Erreur lors du chargement: " + e.getMessage()); + } + } + + /** + * Charger les statistiques + */ + public void loadStatistics() { + try { + String dateDebutStr = dateDebut != null ? dateDebut.format(DATE_FORMATTER) : null; + String dateFinStr = dateFin != null ? dateFin.format(DATE_FORMATTER) : null; + + actionStatistics = auditServiceClient.getActionStatistics(dateDebutStr, dateFinStr); + userActivityStatistics = auditServiceClient.getUserActivityStatistics(dateDebutStr, dateFinStr); + failureCount = auditServiceClient.getFailureCount(dateDebutStr, dateFinStr); + successCount = auditServiceClient.getSuccessCount(dateDebutStr, dateFinStr); + } catch (Exception e) { + LOGGER.severe("Erreur lors du chargement des statistiques: " + e.getMessage()); + } + } + + /** + * Exporter les logs en CSV + */ + public void exportToCSV() { + try { + String dateDebutStr = dateDebut != null ? dateDebut.format(DATE_FORMATTER) : null; + String dateFinStr = dateFin != null ? dateFin.format(DATE_FORMATTER) : null; + + String csv = auditServiceClient.exportLogsToCSV(dateDebutStr, dateFinStr); + // TODO: Implémenter le téléchargement du fichier CSV + addSuccessMessage("Export CSV généré avec succès"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de l'export: " + e.getMessage()); + addErrorMessage("Erreur lors de l'export: " + e.getMessage()); + } + } + + /** + * Réinitialiser les filtres + */ + public void resetFilters() { + acteurUsername = null; + dateDebut = null; + dateFin = null; + selectedTypeAction = null; + ressourceType = null; + succes = null; + currentPage = 0; + auditLogs.clear(); + } + + /** + * Page précédente + */ + public void previousPage() { + if (currentPage > 0) { + currentPage--; + searchLogs(); + } + } + + /** + * Page suivante + */ + public void nextPage() { + currentPage++; + searchLogs(); + } + + /** + * Charger les realms disponibles + */ + private void loadRealms() { + // TODO: Implémenter la récupération des realms depuis Keycloak + // Le realm "master" est le realm d'administration qui permet de gérer tous les autres realms + availableRealms = List.of("master", "lions-user-manager", "btpxpress", "unionflow"); + } + + // Méthodes utilitaires + private void addSuccessMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_INFO, "Succès", message)); + } + + private void addErrorMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_ERROR, "Erreur", message)); + } +} + diff --git a/src/main/java/dev/lions/user/manager/client/view/DashboardBean.java b/src/main/java/dev/lions/user/manager/client/view/DashboardBean.java new file mode 100644 index 0000000..9ba845b --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/view/DashboardBean.java @@ -0,0 +1,250 @@ +package dev.lions.user.manager.client.view; + +import dev.lions.user.manager.client.service.AuditServiceClient; +import dev.lions.user.manager.client.service.RoleServiceClient; +import dev.lions.user.manager.client.service.UserServiceClient; +import dev.lions.user.manager.dto.user.UserSearchCriteriaDTO; +import dev.lions.user.manager.dto.user.UserSearchResultDTO; +import jakarta.annotation.PostConstruct; +import jakarta.faces.view.ViewScoped; +import jakarta.inject.Inject; +import jakarta.inject.Named; +import lombok.Data; +import org.eclipse.microprofile.rest.client.inject.RestClient; + +import jakarta.faces.application.FacesMessage; +import jakarta.faces.context.FacesContext; + +import java.io.Serializable; +import java.time.LocalDateTime; +import java.time.format.DateTimeFormatter; +import java.util.List; +import java.util.logging.Logger; + +/** + * Bean JSF pour le tableau de bord + * + * @author Lions User Manager + * @version 1.0.0 + */ +@Named("dashboardBean") +@ViewScoped +@Data +public class DashboardBean implements Serializable { + + private static final long serialVersionUID = 1L; + private static final Logger LOGGER = Logger.getLogger(DashboardBean.class.getName()); + + @Inject + @RestClient + private UserServiceClient userServiceClient; + + @Inject + @RestClient + private RoleServiceClient roleServiceClient; + + @Inject + @RestClient + private AuditServiceClient auditServiceClient; + + // Statistiques + private Long totalUsers = 0L; + private Long totalRoles = 0L; + private Long recentActions = 0L; + private Long activeSessions = 0L; + private Long onlineUsers = 0L; + + // Indicateur de chargement + private boolean loading = false; + + // Méthodes pour obtenir les valeurs formatées pour l'affichage + public String getTotalUsersDisplay() { + if (loading) return "..."; + return totalUsers != null ? String.valueOf(totalUsers) : "0"; + } + + public String getTotalRolesDisplay() { + if (loading) return "..."; + return totalRoles != null ? String.valueOf(totalRoles) : "0"; + } + + public String getRecentActionsDisplay() { + if (loading) return "..."; + return recentActions != null ? String.valueOf(recentActions) : "0"; + } + + public boolean isLoading() { + return loading; + } + + // Realm par défaut + private String realmName = "master"; + + private static final DateTimeFormatter DATE_FORMATTER = DateTimeFormatter.ofPattern("yyyy-MM-dd'T'HH:mm:ss"); + + @PostConstruct + public void init() { + LOGGER.info("=== Initialisation du DashboardBean ==="); + LOGGER.info("Realm par défaut: " + realmName); + LOGGER.info("UserServiceClient injecté: " + (userServiceClient != null ? "OUI" : "NON")); + LOGGER.info("RoleServiceClient injecté: " + (roleServiceClient != null ? "OUI" : "NON")); + LOGGER.info("AuditServiceClient injecté: " + (auditServiceClient != null ? "OUI" : "NON")); + loadStatistics(); + } + + /** + * Charger toutes les statistiques + */ + public void loadStatistics() { + loading = true; + try { + loadTotalUsers(); + loadTotalRoles(); + loadRecentActions(); + // Les sessions actives nécessitent une API spécifique qui n'existe pas encore + // activeSessions = 0L; + // onlineUsers = 0L; + } catch (Exception e) { + LOGGER.severe("Erreur lors du chargement des statistiques: " + e.getMessage()); + } finally { + loading = false; + } + } + + /** + * Charger le nombre total d'utilisateurs + */ + private void loadTotalUsers() { + try { + LOGGER.info("Début chargement total utilisateurs pour realm: " + realmName); + UserSearchCriteriaDTO criteria = UserSearchCriteriaDTO.builder() + .realmName(realmName) + .page(0) + .pageSize(1) // On n'a besoin que du count + .build(); + + LOGGER.info("Appel userServiceClient.searchUsers()..."); + UserSearchResultDTO result = userServiceClient.searchUsers(criteria); + LOGGER.info("Résultat reçu: " + (result != null ? "NON NULL" : "NULL")); + + if (result != null && result.getTotalCount() != null) { + totalUsers = result.getTotalCount(); + LOGGER.info("✅ Total utilisateurs chargé avec succès: " + totalUsers); + } else { + LOGGER.warning("⚠️ Résultat de recherche utilisateurs null ou totalCount null"); + if (result == null) { + LOGGER.warning(" - result est null"); + } else { + LOGGER.warning(" - result.getTotalCount() est null"); + } + totalUsers = 0L; + } + } catch (Exception e) { + LOGGER.severe("❌ ERREUR lors du chargement du nombre d'utilisateurs: " + e.getMessage()); + LOGGER.severe(" Type d'erreur: " + e.getClass().getName()); + e.printStackTrace(); + totalUsers = 0L; + addErrorMessage("Impossible de charger le nombre d'utilisateurs: " + e.getMessage()); + } + } + + /** + * Charger le nombre total de rôles Realm + */ + private void loadTotalRoles() { + try { + LOGGER.info("Début chargement total rôles pour realm: " + realmName); + LOGGER.info("Appel roleServiceClient.getAllRealmRoles()..."); + List roles = roleServiceClient.getAllRealmRoles(realmName); + LOGGER.info("Résultat reçu: " + (roles != null ? "NON NULL, taille: " + roles.size() : "NULL")); + + if (roles != null) { + totalRoles = (long) roles.size(); + LOGGER.info("✅ Total rôles chargé avec succès: " + totalRoles); + } else { + LOGGER.warning("⚠️ Liste de rôles null"); + totalRoles = 0L; + } + } catch (Exception e) { + LOGGER.severe("❌ ERREUR lors du chargement du nombre de rôles: " + e.getMessage()); + LOGGER.severe(" Type d'erreur: " + e.getClass().getName()); + e.printStackTrace(); + totalRoles = 0L; + addErrorMessage("Impossible de charger le nombre de rôles: " + e.getMessage()); + } + } + + /** + * Charger le nombre d'actions récentes (dernières 24h) + */ + private void loadRecentActions() { + try { + LocalDateTime dateDebut = LocalDateTime.now().minusDays(1); + String dateDebutStr = dateDebut.format(DATE_FORMATTER); + String dateFinStr = LocalDateTime.now().format(DATE_FORMATTER); + + LOGGER.info("Début chargement actions récentes (24h)"); + LOGGER.info(" Date début: " + dateDebutStr); + LOGGER.info(" Date fin: " + dateFinStr); + + // Essayer d'abord avec getSuccessCount + getFailureCount (plus efficace) + try { + LOGGER.info("Tentative avec getSuccessCount() et getFailureCount()..."); + Long successCount = auditServiceClient.getSuccessCount(dateDebutStr, dateFinStr); + Long failureCount = auditServiceClient.getFailureCount(dateDebutStr, dateFinStr); + LOGGER.info(" SuccessCount: " + successCount); + LOGGER.info(" FailureCount: " + failureCount); + recentActions = (successCount != null ? successCount : 0L) + (failureCount != null ? failureCount : 0L); + LOGGER.info("✅ Actions récentes chargées avec succès: " + recentActions); + } catch (Exception e2) { + LOGGER.warning("⚠️ Impossible d'obtenir les statistiques d'audit, tentative avec searchLogs: " + e2.getMessage()); + // Fallback: utiliser searchLogs + List logs = auditServiceClient.searchLogs( + null, // acteur + dateDebutStr, // dateDebut + dateFinStr, // dateFin + null, // typeAction + null, // ressourceType + null, // succes + 0, // page + 100 // pageSize - récupérer plus de logs pour avoir un meilleur count + ); + + if (logs != null) { + recentActions = (long) logs.size(); + LOGGER.info("✅ Actions récentes chargées via searchLogs: " + recentActions); + } else { + LOGGER.warning("⚠️ searchLogs a retourné null"); + recentActions = 0L; + } + } + } catch (Exception e) { + LOGGER.severe("❌ ERREUR lors du chargement des actions récentes: " + e.getMessage()); + LOGGER.severe(" Type d'erreur: " + e.getClass().getName()); + e.printStackTrace(); + recentActions = 0L; + addErrorMessage("Impossible de charger les actions récentes: " + e.getMessage()); + } + } + + /** + * Rafraîchir les statistiques + */ + public void refreshStatistics() { + LOGGER.info("=== Rafraîchissement des statistiques ==="); + loadStatistics(); + addSuccessMessage("Statistiques rafraîchies avec succès"); + } + + // Méthodes utilitaires pour les messages + private void addSuccessMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_INFO, "Succès", message)); + } + + private void addErrorMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_ERROR, "Erreur", message)); + } +} + diff --git a/src/main/java/dev/lions/user/manager/client/view/GuestPreferences.java b/src/main/java/dev/lions/user/manager/client/view/GuestPreferences.java new file mode 100644 index 0000000..3cbb110 --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/view/GuestPreferences.java @@ -0,0 +1,147 @@ +package dev.lions.user.manager.client.view; + +import jakarta.enterprise.context.SessionScoped; +import jakarta.inject.Named; +import java.io.Serializable; +import java.util.ArrayList; +import java.util.List; + +@Named("guestPreferences") +@SessionScoped +public class GuestPreferences implements Serializable { + + private static final long serialVersionUID = 1L; + + private String theme = "blue-light"; + private String layout = "light"; + private String componentTheme = "blue-light"; + private String darkMode = "light"; + private String menuMode = "layout-sidebar"; + private String topbarTheme = "light"; + private String menuTheme = "light"; + private String inputStyle = "outlined"; + private boolean lightLogo = false; + + public String getTheme() { + return theme; + } + + public void setTheme(String theme) { + this.theme = theme; + } + + public String getLayout() { + return layout; + } + + public void setLayout(String layout) { + this.layout = layout; + } + + public String getComponentTheme() { + return componentTheme; + } + + public void setComponentTheme(String componentTheme) { + this.componentTheme = componentTheme; + } + + public String getDarkMode() { + return darkMode; + } + + public void setDarkMode(String darkMode) { + this.darkMode = darkMode; + this.lightLogo = "dark".equals(darkMode); + } + + public String getMenuMode() { + return menuMode; + } + + public void setMenuMode(String menuMode) { + this.menuMode = menuMode; + } + + public String getTopbarTheme() { + return topbarTheme; + } + + public void setTopbarTheme(String topbarTheme) { + this.topbarTheme = topbarTheme; + } + + public String getMenuTheme() { + return menuTheme; + } + + public void setMenuTheme(String menuTheme) { + this.menuTheme = menuTheme; + } + + public String getInputStyle() { + return inputStyle; + } + + public void setInputStyle(String inputStyle) { + this.inputStyle = inputStyle; + } + + public boolean isLightLogo() { + return lightLogo; + } + + public void setLightLogo(boolean lightLogo) { + this.lightLogo = lightLogo; + } + + public String getInputStyleClass() { + return "p-input-" + inputStyle; + } + + public String getLayoutClass() { + return "layout-" + layout + " layout-theme-" + theme; + } + + public List getComponentThemes() { + List themes = new ArrayList<>(); + themes.add(new ComponentTheme("blue-light", "Blue", "#007ad9")); + themes.add(new ComponentTheme("green-light", "Green", "#28a745")); + themes.add(new ComponentTheme("orange-light", "Orange", "#fd7e14")); + themes.add(new ComponentTheme("purple-light", "Purple", "#6f42c1")); + themes.add(new ComponentTheme("pink-light", "Pink", "#e83e8c")); + themes.add(new ComponentTheme("indigo-light", "Indigo", "#6610f2")); + themes.add(new ComponentTheme("teal-light", "Teal", "#20c997")); + themes.add(new ComponentTheme("cyan-light", "Cyan", "#17a2b8")); + return themes; + } + + public void onMenuTypeChange() { + // Called when menu type changes + } + + public static class ComponentTheme { + private String file; + private String name; + private String color; + + public ComponentTheme(String file, String name, String color) { + this.file = file; + this.name = name; + this.color = color; + } + + public String getFile() { + return file; + } + + public String getName() { + return name; + } + + public String getColor() { + return color; + } + } +} + diff --git a/src/main/java/dev/lions/user/manager/client/view/RoleGestionBean.java b/src/main/java/dev/lions/user/manager/client/view/RoleGestionBean.java new file mode 100644 index 0000000..a7f5a9e --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/view/RoleGestionBean.java @@ -0,0 +1,314 @@ +package dev.lions.user.manager.client.view; + +import dev.lions.user.manager.client.service.RoleServiceClient; +import dev.lions.user.manager.dto.role.RoleAssignmentDTO; +import dev.lions.user.manager.dto.role.RoleDTO; +import dev.lions.user.manager.dto.user.UserDTO; +import dev.lions.user.manager.enums.role.TypeRole; +import jakarta.annotation.PostConstruct; +import jakarta.faces.application.FacesMessage; +import jakarta.faces.context.FacesContext; +import jakarta.faces.view.ViewScoped; +import jakarta.inject.Inject; +import jakarta.inject.Named; +import lombok.Data; +import org.eclipse.microprofile.rest.client.inject.RestClient; + +import java.io.Serializable; +import java.util.ArrayList; +import java.util.List; +import java.util.logging.Logger; + +/** + * Bean JSF pour la gestion des rôles + * + * @author Lions User Manager + * @version 1.0.0 + */ +@Named("roleGestionBean") +@ViewScoped +@Data +public class RoleGestionBean implements Serializable { + + private static final long serialVersionUID = 1L; + private static final Logger LOGGER = Logger.getLogger(RoleGestionBean.class.getName()); + + @Inject + @RestClient + private RoleServiceClient roleServiceClient; + + // Liste des rôles + private List realmRoles = new ArrayList<>(); + private List clientRoles = new ArrayList<>(); + private List allRoles = new ArrayList<>(); + private RoleDTO selectedRole; + + // Pour la création/édition + private RoleDTO newRole = RoleDTO.builder().build(); + private boolean editMode = false; + + // Filtres + // Par défaut, utiliser le realm lions-user-manager où les rôles métier sont configurés + private String realmName = "lions-user-manager"; + private String clientName; + private TypeRole selectedTypeRole; + private String roleSearchText; + + // Options + private List typeRoleOptions = List.of(TypeRole.values()); + private List availableRealms = new ArrayList<>(); + private List availableClients = new ArrayList<>(); + + @PostConstruct + public void init() { + loadRealms(); + loadRealmRoles(); + } + + /** + * Charger les rôles Realm + */ + public void loadRealmRoles() { + if (realmName == null || realmName.isEmpty()) { + LOGGER.warning("Realm non sélectionné, impossible de charger les rôles"); + addErrorMessage("Veuillez sélectionner un realm"); + return; + } + + try { + LOGGER.info("Chargement des rôles Realm pour le realm: " + realmName); + realmRoles = roleServiceClient.getAllRealmRoles(realmName); + updateAllRoles(); + LOGGER.info("Chargement réussi: " + realmRoles.size() + " rôles Realm trouvés"); + if (realmRoles.isEmpty()) { + addErrorMessage("Aucun rôle Realm trouvé dans le realm: " + realmName); + } + } catch (Exception e) { + String errorMsg = "Erreur lors du chargement des rôles Realm pour le realm '" + realmName + "': " + e.getMessage(); + LOGGER.severe(errorMsg); + LOGGER.log(java.util.logging.Level.SEVERE, "Exception complète", e); + addErrorMessage(errorMsg); + realmRoles = new ArrayList<>(); // Réinitialiser en cas d'erreur + updateAllRoles(); + } + } + + /** + * Charger les rôles Client + */ + public void loadClientRoles() { + if (clientName == null || clientName.isEmpty()) { + return; + } + + try { + clientRoles = roleServiceClient.getAllClientRoles(realmName, clientName); + updateAllRoles(); + LOGGER.info("Chargement de " + clientRoles.size() + " rôles Client"); + } catch (Exception e) { + LOGGER.severe("Erreur lors du chargement des rôles Client: " + e.getMessage()); + addErrorMessage("Erreur lors du chargement des rôles Client"); + } + } + + /** + * Mettre à jour la liste complète des rôles + */ + private void updateAllRoles() { + allRoles = new ArrayList<>(); + allRoles.addAll(realmRoles); + allRoles.addAll(clientRoles); + } + + /** + * Créer un nouveau rôle Realm + */ + public void createRealmRole() { + try { + RoleDTO created = roleServiceClient.createRealmRole(newRole, realmName); + addSuccessMessage("Rôle Realm créé avec succès: " + created.getName()); + resetForm(); + loadRealmRoles(); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la création: " + e.getMessage()); + addErrorMessage("Erreur lors de la création: " + e.getMessage()); + } + } + + /** + * Créer un nouveau rôle Client + */ + public void createClientRole() { + if (clientName == null || clientName.isEmpty()) { + addErrorMessage("Le nom du client est obligatoire"); + return; + } + + try { + RoleDTO created = roleServiceClient.createClientRole(newRole, realmName, clientName); + addSuccessMessage("Rôle Client créé avec succès: " + created.getName()); + resetForm(); + loadClientRoles(); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la création: " + e.getMessage()); + addErrorMessage("Erreur lors de la création: " + e.getMessage()); + } + } + + /** + * Supprimer un rôle Realm + */ + public void deleteRealmRole(String roleName) { + try { + roleServiceClient.deleteRealmRole(roleName, realmName); + addSuccessMessage("Rôle Realm supprimé avec succès"); + loadRealmRoles(); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la suppression: " + e.getMessage()); + addErrorMessage("Erreur lors de la suppression: " + e.getMessage()); + } + } + + /** + * Supprimer un rôle Client + */ + public void deleteClientRole(String roleName) { + if (clientName == null || clientName.isEmpty()) { + addErrorMessage("Le nom du client est obligatoire"); + return; + } + + try { + roleServiceClient.deleteClientRole(roleName, realmName, clientName); + addSuccessMessage("Rôle Client supprimé avec succès"); + loadClientRoles(); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la suppression: " + e.getMessage()); + addErrorMessage("Erreur lors de la suppression: " + e.getMessage()); + } + } + + /** + * Attribuer un rôle à un utilisateur + */ + public void assignRoleToUser(String userId, String roleName) { + try { + RoleAssignmentDTO assignment = RoleAssignmentDTO.builder() + .userId(userId) + .roleNames(List.of(roleName)) + .typeRole(TypeRole.REALM_ROLE) + .realmName(realmName) + .build(); + + roleServiceClient.assignRoleToUser(assignment); + addSuccessMessage("Rôle attribué avec succès"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de l'attribution: " + e.getMessage()); + addErrorMessage("Erreur lors de l'attribution: " + e.getMessage()); + } + } + + /** + * Révoquer un rôle d'un utilisateur + */ + public void revokeRoleFromUser(String userId, String roleName) { + try { + RoleAssignmentDTO assignment = RoleAssignmentDTO.builder() + .userId(userId) + .roleNames(List.of(roleName)) + .typeRole(TypeRole.REALM_ROLE) + .realmName(realmName) + .build(); + + roleServiceClient.revokeRoleFromUser(assignment); + addSuccessMessage("Rôle révoqué avec succès"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la révocation: " + e.getMessage()); + addErrorMessage("Erreur lors de la révocation: " + e.getMessage()); + } + } + + /** + * Attribuer un rôle à un utilisateur (depuis les paramètres de requête) + */ + public void assignRoleFromParams() { + FacesContext context = FacesContext.getCurrentInstance(); + String userId = context.getExternalContext().getRequestParameterMap().get("userId"); + String roleName = context.getExternalContext().getRequestParameterMap().get("roleName"); + + if (userId != null && roleName != null) { + assignRoleToUser(userId, roleName); + } else { + addErrorMessage("Paramètres manquants: userId ou roleName"); + } + } + + /** + * Révoquer un rôle d'un utilisateur (depuis les paramètres de requête) + */ + public void revokeRoleFromParams() { + FacesContext context = FacesContext.getCurrentInstance(); + String userId = context.getExternalContext().getRequestParameterMap().get("userId"); + String roleName = context.getExternalContext().getRequestParameterMap().get("roleName"); + + if (userId != null && roleName != null) { + revokeRoleFromUser(userId, roleName); + } else { + addErrorMessage("Paramètres manquants: userId ou roleName"); + } + } + + /** + * Obtenir les rôles RoleDTO correspondant aux noms de rôles de l'utilisateur + */ + public List getUserRolesDTOs(UserDTO user) { + if (user == null || user.getRealmRoles() == null || user.getRealmRoles().isEmpty()) { + return new ArrayList<>(); + } + + if (allRoles == null || allRoles.isEmpty()) { + return new ArrayList<>(); + } + + return allRoles.stream() + .filter(role -> user.getRealmRoles().contains(role.getName())) + .collect(java.util.stream.Collectors.toList()); + } + + /** + * Réinitialiser le formulaire + */ + public void resetForm() { + newRole = RoleDTO.builder().build(); + editMode = false; + } + + /** + * Charger les realms disponibles + */ + private void loadRealms() { + try { + // Pour l'instant, utiliser les realms de la configuration + // TODO: Implémenter la récupération des realms depuis Keycloak via un endpoint API + // Le realm "master" est le realm d'administration qui permet de gérer tous les autres realms + availableRealms = List.of("master", "lions-user-manager", "btpxpress", "test-realm"); + LOGGER.info("Realms disponibles chargés: " + availableRealms.size()); + } catch (Exception e) { + LOGGER.severe("Erreur lors du chargement des realms: " + e.getMessage()); + // Fallback sur une liste par défaut - "master" est le realm d'administration + availableRealms = List.of("master"); + } + } + + // Méthodes utilitaires + private void addSuccessMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_INFO, "Succès", message)); + } + + private void addErrorMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_ERROR, "Erreur", message)); + } +} + diff --git a/src/main/java/dev/lions/user/manager/client/view/SettingsBean.java b/src/main/java/dev/lions/user/manager/client/view/SettingsBean.java new file mode 100644 index 0000000..a7a314e --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/view/SettingsBean.java @@ -0,0 +1,63 @@ +package dev.lions.user.manager.client.view; + +import jakarta.annotation.PostConstruct; +import jakarta.faces.application.FacesMessage; +import jakarta.faces.context.FacesContext; +import jakarta.faces.view.ViewScoped; +import jakarta.inject.Inject; +import jakarta.inject.Named; +import lombok.Data; + +import java.io.Serializable; +import java.util.logging.Logger; + +/** + * Bean JSF pour la page de paramètres + * + * @author Lions User Manager + * @version 1.0.0 + */ +@Named("settingsBean") +@ViewScoped +@Data +public class SettingsBean implements Serializable { + + private static final long serialVersionUID = 1L; + private static final Logger LOGGER = Logger.getLogger(SettingsBean.class.getName()); + + @Inject + private UserSessionBean userSessionBean; + + @Inject + private GuestPreferences guestPreferences; + + @PostConstruct + public void init() { + LOGGER.info("Initialisation de SettingsBean"); + } + + /** + * Sauvegarder les préférences + */ + public void savePreferences() { + try { + // Les préférences sont déjà sauvegardées dans GuestPreferences (SessionScoped) + addSuccessMessage("Préférences sauvegardées avec succès"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la sauvegarde: " + e.getMessage()); + addErrorMessage("Erreur lors de la sauvegarde: " + e.getMessage()); + } + } + + // Méthodes utilitaires + private void addSuccessMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_INFO, "Succès", message)); + } + + private void addErrorMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_ERROR, "Erreur", message)); + } +} + diff --git a/src/main/java/dev/lions/user/manager/client/view/UserCreationBean.java b/src/main/java/dev/lions/user/manager/client/view/UserCreationBean.java new file mode 100644 index 0000000..8f0d5a7 --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/view/UserCreationBean.java @@ -0,0 +1,134 @@ +package dev.lions.user.manager.client.view; + +import dev.lions.user.manager.client.service.UserServiceClient; +import dev.lions.user.manager.dto.user.UserDTO; +import dev.lions.user.manager.enums.user.StatutUser; +import jakarta.annotation.PostConstruct; +import jakarta.faces.application.FacesMessage; +import jakarta.faces.context.FacesContext; +import jakarta.faces.view.ViewScoped; +import jakarta.inject.Inject; +import jakarta.inject.Named; +import lombok.Data; +import org.eclipse.microprofile.rest.client.inject.RestClient; + +import java.io.Serializable; +import java.util.ArrayList; +import java.util.List; +import java.util.logging.Logger; + +/** + * Bean JSF pour la création d'un nouvel utilisateur + * + * @author Lions User Manager + * @version 1.0.0 + */ +@Named("userCreationBean") +@ViewScoped +@Data +public class UserCreationBean implements Serializable { + + private static final long serialVersionUID = 1L; + private static final Logger LOGGER = Logger.getLogger(UserCreationBean.class.getName()); + + @Inject + @RestClient + private UserServiceClient userServiceClient; + + private UserDTO newUser = UserDTO.builder().build(); + // Le realm "master" est le realm d'administration qui permet de gérer tous les autres realms + private String realmName = "master"; + private String password; + private String passwordConfirm; + + // Options pour les selects + private List statutOptions = List.of(StatutUser.values()); + private List availableRealms = new ArrayList<>(); + + @PostConstruct + public void init() { + loadRealms(); + // Initialiser les valeurs par défaut + newUser.setEnabled(true); + newUser.setEmailVerified(false); + newUser.setStatut(StatutUser.ACTIF); + } + + /** + * Créer un nouvel utilisateur + */ + public String createUser() { + // Validation + if (password == null || password.isEmpty()) { + addErrorMessage("Le mot de passe est obligatoire"); + return null; + } + + if (!password.equals(passwordConfirm)) { + addErrorMessage("Les mots de passe ne correspondent pas"); + return null; + } + + if (password.length() < 8) { + addErrorMessage("Le mot de passe doit contenir au moins 8 caractères"); + return null; + } + + try { + // Créer l'utilisateur + UserDTO createdUser = userServiceClient.createUser(newUser, realmName); + + // Définir le mot de passe + userServiceClient.resetPassword(createdUser.getId(), realmName, password); + + addSuccessMessage("Utilisateur créé avec succès: " + createdUser.getUsername()); + resetForm(); + return "userListPage"; // Rediriger vers la liste + } catch (Exception e) { + LOGGER.severe("Erreur lors de la création: " + e.getMessage()); + addErrorMessage("Erreur lors de la création: " + e.getMessage()); + return null; + } + } + + /** + * Réinitialiser le formulaire + */ + public void resetForm() { + newUser = UserDTO.builder().build(); + password = null; + passwordConfirm = null; + newUser.setEnabled(true); + newUser.setEmailVerified(false); + newUser.setStatut(StatutUser.ACTIF); + } + + /** + * Annuler la création + */ + public String cancel() { + resetForm(); + return "userListPage"; + } + + /** + * Charger les realms disponibles + */ + private void loadRealms() { + // TODO: Implémenter la récupération des realms depuis Keycloak + // Le realm "master" est le realm d'administration qui permet de gérer tous les autres realms + availableRealms = List.of("master", "lions-user-manager", "btpxpress", "unionflow"); + } + + // Méthodes utilitaires + private void addSuccessMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_INFO, "Succès", message)); + } + + private void addErrorMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_ERROR, "Erreur", message)); + } +} + diff --git a/src/main/java/dev/lions/user/manager/client/view/UserListBean.java b/src/main/java/dev/lions/user/manager/client/view/UserListBean.java new file mode 100644 index 0000000..6a4f60c --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/view/UserListBean.java @@ -0,0 +1,347 @@ +package dev.lions.user.manager.client.view; + +import dev.lions.user.manager.client.service.UserServiceClient; +import dev.lions.user.manager.dto.user.UserDTO; +import dev.lions.user.manager.dto.user.UserSearchCriteriaDTO; +import dev.lions.user.manager.dto.user.UserSearchResultDTO; +import dev.lions.user.manager.enums.user.StatutUser; +import jakarta.annotation.PostConstruct; +import jakarta.faces.application.FacesMessage; +import jakarta.faces.context.FacesContext; +import jakarta.faces.event.ActionEvent; +import jakarta.faces.view.ViewScoped; +import jakarta.inject.Inject; +import jakarta.inject.Named; +import lombok.Data; +import org.eclipse.microprofile.rest.client.inject.RestClient; +import org.primefaces.event.data.PageEvent; + +import java.io.Serializable; +import java.util.ArrayList; +import java.util.List; +import java.util.logging.Logger; + +/** + * Bean JSF pour la liste et la recherche d'utilisateurs + * + * @author Lions User Manager + * @version 1.0.0 + */ +@Named("userListBean") +@ViewScoped +@Data +public class UserListBean implements Serializable { + + private static final long serialVersionUID = 1L; + private static final Logger LOGGER = Logger.getLogger(UserListBean.class.getName()); + + // Constantes de navigation outcomes (WOU/DRY - réutilisables) + private static final String OUTCOME_USER_PROFILE = "userProfilePage"; + private static final String OUTCOME_USER_EDIT = "userEditPage"; + private static final String OUTCOME_USER_CREATE = "userCreatePage"; + + @Inject + @RestClient + private UserServiceClient userServiceClient; + + // Propriétés pour la liste + private List users = new ArrayList<>(); + private UserDTO selectedUser; + private List selectedUsers = new ArrayList<>(); + + // Propriétés pour la recherche + private UserSearchCriteriaDTO searchCriteria = UserSearchCriteriaDTO.builder().build(); + private String searchText; + // Par défaut, utiliser le realm lions-user-manager où les utilisateurs sont configurés + private String realmName = "lions-user-manager"; + private StatutUser selectedStatut; + + // Propriétés pour la pagination + private int currentPage = 0; + private int pageSize = 20; + private long totalRecords = 0; + private int totalPages = 0; + + // Options pour les selects + private List statutOptions = List.of(StatutUser.values()); + private List availableRealms = new ArrayList<>(); + + @PostConstruct + public void init() { + LOGGER.info("Initialisation de UserListBean"); + loadUsers(); + loadRealms(); + } + + /** + * Charger la liste des utilisateurs + */ + public void loadUsers() { + try { + UserSearchCriteriaDTO criteria = UserSearchCriteriaDTO.builder() + .realmName(realmName) + .page(currentPage) + .pageSize(pageSize) + .build(); + + UserSearchResultDTO result = userServiceClient.searchUsers(criteria); + this.users = result.getUsers() != null ? result.getUsers() : new ArrayList<>(); + this.totalRecords = result.getTotalCount() != null ? result.getTotalCount() : 0; + this.totalPages = (int) Math.ceil((double) totalRecords / pageSize); + + LOGGER.info("Chargement de " + users.size() + " utilisateurs"); + } catch (Exception e) { + LOGGER.severe("Erreur lors du chargement des utilisateurs: " + e.getMessage()); + addErrorMessage("Erreur lors du chargement des utilisateurs: " + e.getMessage()); + } + } + + /** + * Rechercher des utilisateurs + */ + public void search() { + try { + currentPage = 0; // Réinitialiser à la première page + + UserSearchCriteriaDTO criteria = UserSearchCriteriaDTO.builder() + .realmName(realmName) + .searchTerm(searchText) + .statut(selectedStatut) + .page(currentPage) + .pageSize(pageSize) + .build(); + + UserSearchResultDTO result = userServiceClient.searchUsers(criteria); + this.users = result.getUsers() != null ? result.getUsers() : new ArrayList<>(); + this.totalRecords = result.getTotalCount() != null ? result.getTotalCount() : 0; + this.totalPages = (int) Math.ceil((double) totalRecords / pageSize); + + addSuccessMessage("Recherche effectuée: " + totalRecords + " résultat(s) trouvé(s)"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la recherche: " + e.getMessage()); + addErrorMessage("Erreur lors de la recherche: " + e.getMessage()); + } + } + + /** + * Réinitialiser la recherche + */ + public void resetSearch() { + searchText = null; + selectedStatut = null; + currentPage = 0; + loadUsers(); + } + + /** + * Gérer les événements de pagination du datatable + */ + public void onPageChange(PageEvent event) { + try { + int page = event.getPage(); + + currentPage = page; + + LOGGER.info("Changement de page: page=" + currentPage + ", rows=" + pageSize); + + // Recharger les données avec la nouvelle page + loadUsers(); + } catch (Exception e) { + LOGGER.severe("Erreur lors du changement de page: " + e.getMessage()); + addErrorMessage("Erreur lors du changement de page: " + e.getMessage()); + } + } + + /** + * Action pour activer un utilisateur (utilisé par le composant composite) + */ + public void activateUserAction(ActionEvent event) { + String userId = (String) event.getComponent().getAttributes().get("userId"); + if (userId != null) { + activateUser(userId); + } + } + + /** + * Action pour désactiver un utilisateur (utilisé par le composant composite) + */ + public void deactivateUserAction(ActionEvent event) { + String userId = (String) event.getComponent().getAttributes().get("userId"); + if (userId != null) { + deactivateUser(userId); + } + } + + /** + * Action pour supprimer un utilisateur (utilisé par le composant composite) + */ + public void deleteUserAction(ActionEvent event) { + String userId = (String) event.getComponent().getAttributes().get("userId"); + if (userId != null) { + deleteUser(userId); + } + } + + /** + * Activer un utilisateur + */ + public void activateUser(String userId) { + try { + userServiceClient.activateUser(userId, realmName); + addSuccessMessage("Utilisateur activé avec succès"); + loadUsers(); + } catch (Exception e) { + LOGGER.severe("Erreur lors de l'activation: " + e.getMessage()); + addErrorMessage("Erreur lors de l'activation: " + e.getMessage()); + } + } + + /** + * Désactiver un utilisateur + */ + public void deactivateUser(String userId) { + try { + userServiceClient.deactivateUser(userId, realmName); + addSuccessMessage("Utilisateur désactivé avec succès"); + loadUsers(); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la désactivation: " + e.getMessage()); + addErrorMessage("Erreur lors de la désactivation: " + e.getMessage()); + } + } + + /** + * Supprimer un utilisateur + */ + public void deleteUser(String userId) { + try { + userServiceClient.deleteUser(userId, realmName); + addSuccessMessage("Utilisateur supprimé avec succès"); + loadUsers(); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la suppression: " + e.getMessage()); + addErrorMessage("Erreur lors de la suppression: " + e.getMessage()); + } + } + + /** + * Déconnecter toutes les sessions d'un utilisateur + */ + public void logoutAllSessions(String userId) { + try { + userServiceClient.logoutAllSessions(userId, realmName); + addSuccessMessage("Toutes les sessions ont été déconnectées"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la déconnexion: " + e.getMessage()); + addErrorMessage("Erreur lors de la déconnexion: " + e.getMessage()); + } + } + + /** + * Obtenir le nombre d'utilisateurs actifs + */ + public long getActiveUsersCount() { + if (users == null || users.isEmpty()) { + return 0; + } + return users.stream() + .filter(user -> user.getEnabled() != null && user.getEnabled()) + .count(); + } + + /** + * Obtenir le nombre d'utilisateurs désactivés + */ + public long getDisabledUsersCount() { + if (users == null || users.isEmpty()) { + return 0; + } + return users.stream() + .filter(user -> user.getEnabled() != null && !user.getEnabled()) + .count(); + } + + /** + * Obtenir le pourcentage d'utilisateurs actifs + */ + public int getActiveUsersPercentage() { + if (totalRecords == 0) { + return 0; + } + return (int) Math.round((double) getActiveUsersCount() / totalRecords * 100); + } + + /** + * Obtenir le pourcentage d'utilisateurs désactivés + */ + public int getDisabledUsersPercentage() { + if (totalRecords == 0) { + return 0; + } + return (int) Math.round((double) getDisabledUsersCount() / totalRecords * 100); + } + + /** + * Rafraîchir les données + */ + public void refreshData() { + loadUsers(); + addSuccessMessage("Données rafraîchies"); + } + + /** + * Exporter vers CSV (placeholder) + */ + public void exportToCSV() { + addSuccessMessage("Fonctionnalité d'export en cours de développement"); + } + + /** + * Importer des utilisateurs (placeholder) + */ + public void importUsers() { + addSuccessMessage("Fonctionnalité d'import en cours de développement"); + } + + /** + * Charger les realms disponibles + */ + private void loadRealms() { + // TODO: Implémenter la récupération des realms depuis Keycloak + // Le realm "master" est le realm d'administration qui permet de gérer tous les autres realms + availableRealms = List.of("master", "lions-user-manager", "btpxpress", "unionflow"); + } + + /** + * Navigation vers le profil utilisateur + */ + public String goToUserProfile() { + return OUTCOME_USER_PROFILE; + } + + /** + * Navigation vers l'édition utilisateur + */ + public String goToUserEdit() { + return OUTCOME_USER_EDIT; + } + + /** + * Navigation vers la création utilisateur + */ + public String goToUserCreate() { + return OUTCOME_USER_CREATE; + } + + // Méthodes utilitaires pour les messages + private void addSuccessMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_INFO, "Succès", message)); + } + + private void addErrorMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_ERROR, "Erreur", message)); + } +} + diff --git a/src/main/java/dev/lions/user/manager/client/view/UserProfilBean.java b/src/main/java/dev/lions/user/manager/client/view/UserProfilBean.java new file mode 100644 index 0000000..070d81f --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/view/UserProfilBean.java @@ -0,0 +1,196 @@ +package dev.lions.user.manager.client.view; + +import dev.lions.user.manager.client.service.UserServiceClient; +import dev.lions.user.manager.dto.user.UserDTO; +import jakarta.annotation.PostConstruct; +import jakarta.faces.application.FacesMessage; +import jakarta.faces.context.FacesContext; +import jakarta.faces.view.ViewScoped; +import jakarta.inject.Inject; +import jakarta.inject.Named; +import lombok.Data; +import org.eclipse.microprofile.rest.client.inject.RestClient; + +import java.io.Serializable; +import java.util.logging.Logger; + +/** + * Bean JSF pour le profil et l'édition d'un utilisateur + * + * @author Lions User Manager + * @version 1.0.0 + */ +@Named("userProfilBean") +@ViewScoped +@Data +public class UserProfilBean implements Serializable { + + private static final long serialVersionUID = 1L; + private static final Logger LOGGER = Logger.getLogger(UserProfilBean.class.getName()); + + @Inject + @RestClient + private UserServiceClient userServiceClient; + + private UserDTO user; + private String userId; + // Le realm "master" est le realm d'administration qui permet de gérer tous les autres realms + private String realmName = "master"; + private boolean editMode = false; + + // Pour la réinitialisation de mot de passe + private String newPassword; + private String newPasswordConfirm; + + @PostConstruct + public void init() { + // Récupérer l'ID depuis les paramètres de requête + userId = FacesContext.getCurrentInstance().getExternalContext() + .getRequestParameterMap().get("userId"); + + if (userId != null && !userId.isEmpty()) { + loadUser(); + } else { + LOGGER.warning("Aucun userId fourni dans les paramètres"); + } + } + + /** + * Charger l'utilisateur + */ + public void loadUser() { + try { + user = userServiceClient.getUserById(userId, realmName); + if (user != null) { + LOGGER.info("Utilisateur chargé: " + user.getUsername()); + } + } catch (dev.lions.user.manager.client.service.RestClientExceptionMapper.NotFoundException e) { + LOGGER.warning("Utilisateur non trouvé: " + userId); + addErrorMessage("Utilisateur non trouvé dans le realm " + realmName); + user = null; + } catch (Exception e) { + LOGGER.severe("Erreur lors du chargement de l'utilisateur: " + e.getMessage()); + addErrorMessage("Erreur lors du chargement de l'utilisateur: " + e.getMessage()); + } + } + + /** + * Activer le mode édition + */ + public void enableEditMode() { + editMode = true; + } + + /** + * Désactiver le mode édition + */ + public void cancelEdit() { + editMode = false; + loadUser(); // Recharger les données originales + } + + /** + * Mettre à jour l'utilisateur + */ + public void updateUser() { + try { + user = userServiceClient.updateUser(userId, user, realmName); + editMode = false; + addSuccessMessage("Utilisateur mis à jour avec succès"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la mise à jour: " + e.getMessage()); + addErrorMessage("Erreur lors de la mise à jour: " + e.getMessage()); + } + } + + /** + * Réinitialiser le mot de passe + */ + public void resetPassword() { + if (newPassword == null || newPassword.isEmpty()) { + addErrorMessage("Le mot de passe ne peut pas être vide"); + return; + } + + if (!newPassword.equals(newPasswordConfirm)) { + addErrorMessage("Les mots de passe ne correspondent pas"); + return; + } + + try { + userServiceClient.resetPassword(userId, realmName, newPassword); + newPassword = null; + newPasswordConfirm = null; + addSuccessMessage("Mot de passe réinitialisé avec succès"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la réinitialisation: " + e.getMessage()); + addErrorMessage("Erreur lors de la réinitialisation: " + e.getMessage()); + } + } + + /** + * Activer l'utilisateur + */ + public void activateUser() { + try { + userServiceClient.activateUser(userId, realmName); + loadUser(); // Recharger pour mettre à jour le statut + addSuccessMessage("Utilisateur activé avec succès"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de l'activation: " + e.getMessage()); + addErrorMessage("Erreur lors de l'activation: " + e.getMessage()); + } + } + + /** + * Désactiver l'utilisateur + */ + public void deactivateUser() { + try { + userServiceClient.deactivateUser(userId, realmName); + loadUser(); // Recharger pour mettre à jour le statut + addSuccessMessage("Utilisateur désactivé avec succès"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la désactivation: " + e.getMessage()); + addErrorMessage("Erreur lors de la désactivation: " + e.getMessage()); + } + } + + /** + * Envoyer un email de vérification + */ + public void sendVerificationEmail() { + try { + userServiceClient.sendVerificationEmail(userId, realmName); + addSuccessMessage("Email de vérification envoyé"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de l'envoi: " + e.getMessage()); + addErrorMessage("Erreur lors de l'envoi: " + e.getMessage()); + } + } + + /** + * Déconnecter toutes les sessions + */ + public void logoutAllSessions() { + try { + userServiceClient.logoutAllSessions(userId, realmName); + addSuccessMessage("Toutes les sessions ont été déconnectées"); + } catch (Exception e) { + LOGGER.severe("Erreur lors de la déconnexion: " + e.getMessage()); + addErrorMessage("Erreur lors de la déconnexion: " + e.getMessage()); + } + } + + // Méthodes utilitaires + private void addSuccessMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_INFO, "Succès", message)); + } + + private void addErrorMessage(String message) { + FacesContext.getCurrentInstance().addMessage(null, + new FacesMessage(FacesMessage.SEVERITY_ERROR, "Erreur", message)); + } +} + diff --git a/src/main/java/dev/lions/user/manager/client/view/UserSessionBean.java b/src/main/java/dev/lions/user/manager/client/view/UserSessionBean.java new file mode 100644 index 0000000..1dd32e5 --- /dev/null +++ b/src/main/java/dev/lions/user/manager/client/view/UserSessionBean.java @@ -0,0 +1,360 @@ +package dev.lions.user.manager.client.view; + +import io.quarkus.oidc.IdToken; +import io.quarkus.oidc.OidcSession; +import io.quarkus.security.identity.SecurityIdentity; +import jakarta.annotation.PostConstruct; +import jakarta.enterprise.context.SessionScoped; +import jakarta.faces.context.ExternalContext; +import jakarta.faces.context.FacesContext; +import jakarta.inject.Inject; +import jakarta.inject.Named; +import lombok.Data; +import org.eclipse.microprofile.jwt.JsonWebToken; + +import java.io.Serializable; +import java.util.logging.Logger; + +/** + * Bean de session pour gérer les informations de l'utilisateur connecté + * + * @author Lions User Manager + * @version 1.0.0 + */ +@Named("userSessionBean") +@SessionScoped +@Data +public class UserSessionBean implements Serializable { + + private static final long serialVersionUID = 1L; + private static final Logger LOGGER = Logger.getLogger(UserSessionBean.class.getName()); + + @Inject + SecurityIdentity securityIdentity; + + @Inject + @IdToken + JsonWebToken idToken; + + @Inject + OidcSession oidcSession; + + // Informations utilisateur + private String username; + private String email; + private String firstName; + private String lastName; + private String fullName; + private String initials; + + @PostConstruct + public void init() { + loadUserInfo(); + } + + /** + * Charger les informations utilisateur depuis le token OIDC + */ + public void loadUserInfo() { + try { + if (idToken != null && securityIdentity != null && !securityIdentity.isAnonymous()) { + // Username + username = idToken.getClaim("preferred_username"); + if (username == null || username.trim().isEmpty()) { + username = securityIdentity.getPrincipal().getName(); + } + + // Email + email = idToken.getClaim("email"); + if (email == null || email.trim().isEmpty()) { + email = username + "@lions.dev"; + } + + // Prénom et nom + firstName = idToken.getClaim("given_name"); + lastName = idToken.getClaim("family_name"); + + // Nom complet + fullName = idToken.getClaim("name"); + if (fullName == null || fullName.trim().isEmpty()) { + if (firstName != null && lastName != null) { + fullName = firstName + " " + lastName; + } else if (firstName != null) { + fullName = firstName; + } else if (lastName != null) { + fullName = lastName; + } else { + fullName = username; + } + } + + // Initiales pour l'avatar + initials = generateInitials(fullName); + + LOGGER.info("Informations utilisateur chargées: " + fullName + " (" + email + ")"); + } else { + // Valeurs par défaut si non authentifié + username = "Utilisateur"; + email = "utilisateur@lions.dev"; + fullName = "Utilisateur"; + initials = "U"; + } + } catch (Exception e) { + LOGGER.severe("Erreur lors du chargement des informations utilisateur: " + e.getMessage()); + username = "Utilisateur"; + email = "utilisateur@lions.dev"; + fullName = "Utilisateur"; + initials = "U"; + } + } + + /** + * Générer les initiales depuis le nom complet + */ + private String generateInitials(String name) { + if (name == null || name.trim().isEmpty()) { + return "U"; + } + + String[] parts = name.trim().split("\\s+"); + if (parts.length >= 2) { + return String.valueOf(parts[0].charAt(0)).toUpperCase() + + String.valueOf(parts[1].charAt(0)).toUpperCase(); + } else if (parts.length == 1) { + String part = parts[0]; + if (part.length() >= 2) { + return part.substring(0, 2).toUpperCase(); + } else { + return part.substring(0, 1).toUpperCase(); + } + } + return "U"; + } + + // Rôles + private java.util.Set roles; + private String primaryRole; + + /** + * Obtenir le rôle principal de l'utilisateur + */ + public String getPrimaryRole() { + if (primaryRole == null) { + primaryRole = getMainRole(); + } + return primaryRole; + } + + /** + * Obtenir tous les rôles de l'utilisateur + */ + public java.util.Set getRoles() { + if (roles == null) { + roles = new java.util.HashSet<>(); + try { + if (securityIdentity != null && securityIdentity.getRoles() != null) { + roles.addAll(securityIdentity.getRoles()); + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la récupération des rôles: " + e.getMessage()); + } + if (roles.isEmpty()) { + roles.add("Utilisateur"); + } + } + return roles; + } + + /** + * Obtenir le rôle principal de l'utilisateur (méthode interne) + */ + private String getMainRole() { + try { + if (securityIdentity != null && securityIdentity.getRoles() != null && !securityIdentity.getRoles().isEmpty()) { + // Prioriser certains rôles + java.util.Set roleSet = securityIdentity.getRoles(); + if (roleSet.contains("admin")) { + return "Administrateur"; + } else if (roleSet.contains("user_manager")) { + return "Gestionnaire"; + } else if (roleSet.contains("user_viewer")) { + return "Consultant"; + } else { + return roleSet.iterator().next(); + } + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la récupération du rôle: " + e.getMessage()); + } + return "Utilisateur"; + } + + /** + * Vérifier si l'utilisateur est authentifié + */ + public boolean isAuthenticated() { + return securityIdentity != null && !securityIdentity.isAnonymous(); + } + + /** + * Vérifier si l'utilisateur a un rôle spécifique + */ + public boolean hasRole(String role) { + try { + if (securityIdentity != null && securityIdentity.getRoles() != null) { + return securityIdentity.getRoles().contains(role); + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la vérification du rôle: " + e.getMessage()); + } + return false; + } + + /** + * Obtenir l'issuer du token OIDC + */ + public String getIssuer() { + try { + if (idToken != null) { + return idToken.getIssuer(); + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la récupération de l'issuer: " + e.getMessage()); + } + return "Non disponible"; + } + + /** + * Obtenir le subject du token OIDC + */ + public String getSubject() { + try { + if (idToken != null) { + return idToken.getSubject(); + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la récupération du subject: " + e.getMessage()); + } + return "Non disponible"; + } + + /** + * Obtenir le session ID + */ + public String getSessionId() { + try { + if (idToken != null) { + Object sid = idToken.getClaim("sid"); + if (sid != null) { + return sid.toString(); + } + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la récupération du session ID: " + e.getMessage()); + } + return "Non disponible"; + } + + /** + * Obtenir le temps d'expiration du token + */ + public java.util.Date getExpirationTime() { + try { + if (idToken != null && idToken.getExpirationTime() > 0) { + return new java.util.Date(idToken.getExpirationTime() * 1000L); + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la récupération de l'expiration: " + e.getMessage()); + } + return null; + } + + /** + * Obtenir le temps d'émission du token + */ + public java.util.Date getIssuedAt() { + try { + if (idToken != null && idToken.getIssuedAtTime() > 0) { + return new java.util.Date(idToken.getIssuedAtTime() * 1000L); + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la récupération de l'émission: " + e.getMessage()); + } + return null; + } + + /** + * Obtenir l'audience du token + */ + public String getAudience() { + try { + if (idToken != null && idToken.getAudience() != null && !idToken.getAudience().isEmpty()) { + return String.join(", ", idToken.getAudience()); + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la récupération de l'audience: " + e.getMessage()); + } + return "Non disponible"; + } + + /** + * Obtenir l'authorized party (azp) + */ + public String getAuthorizedParty() { + try { + if (idToken != null) { + Object azp = idToken.getClaim("azp"); + if (azp != null) { + return azp.toString(); + } + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la récupération de l'authorized party: " + e.getMessage()); + } + return "Non disponible"; + } + + /** + * Vérifier si l'email est vérifié + */ + public boolean isEmailVerified() { + try { + if (idToken != null) { + Boolean emailVerified = idToken.getClaim("email_verified"); + return emailVerified != null && emailVerified; + } + } catch (Exception e) { + LOGGER.warning("Erreur lors de la vérification de l'email: " + e.getMessage()); + } + return false; + } + + /** + * Déconnexion OIDC + * Redirige vers l'endpoint de logout Quarkus qui gère la déconnexion Keycloak + */ + public String logout() { + try { + LOGGER.info("Déconnexion de l'utilisateur: " + fullName); + + FacesContext facesContext = FacesContext.getCurrentInstance(); + ExternalContext externalContext = facesContext.getExternalContext(); + + // Invalider la session HTTP locale + externalContext.invalidateSession(); + + // Rediriger vers l'endpoint de logout OIDC de Quarkus + // Quarkus gère automatiquement la redirection vers Keycloak pour la déconnexion complète + String logoutUrl = "/auth/logout"; + externalContext.redirect(logoutUrl); + facesContext.responseComplete(); + + return null; + } catch (Exception e) { + LOGGER.severe("Erreur lors de la déconnexion: " + e.getMessage()); + // En cas d'erreur, rediriger vers la page d'accueil + return "/?faces-redirect=true"; + } + } +} + diff --git a/src/main/resources/META-INF/faces-config.xml b/src/main/resources/META-INF/faces-config.xml new file mode 100644 index 0000000..586c719 --- /dev/null +++ b/src/main/resources/META-INF/faces-config.xml @@ -0,0 +1,181 @@ + + + + Lions User Manager + + + + fr + fr + en + + + + + * + + + + Page d'accueil / Dashboard + userManagerDashboardPage + /pages/user-manager/dashboard.xhtml + + + + + Navigation directe vers dashboard + /pages/user-manager/dashboard + /pages/user-manager/dashboard.xhtml + + + + + + Page de liste des utilisateurs + userListPage + /pages/user-manager/users/list.xhtml + + + + + Navigation directe vers liste utilisateurs + /pages/user-manager/users/list + /pages/user-manager/users/list.xhtml + + + + + Page de création d'utilisateur + userCreatePage + /pages/user-manager/users/create.xhtml + + + + + Navigation directe vers création utilisateur + /pages/user-manager/users/create + /pages/user-manager/users/create.xhtml + + + + + Page de profil utilisateur + userProfilePage + /pages/user-manager/users/profile.xhtml + + + + + Navigation directe vers profil utilisateur + /pages/user-manager/users/profile + /pages/user-manager/users/profile.xhtml + + + + + Page d'édition utilisateur + userEditPage + /pages/user-manager/users/edit.xhtml + + + + + Navigation directe vers édition utilisateur + /pages/user-manager/users/edit + /pages/user-manager/users/edit.xhtml + + + + + + Page de liste des rôles + roleListPage + /pages/user-manager/roles/list.xhtml + + + + + Navigation directe vers liste rôles + /pages/user-manager/roles/list + /pages/user-manager/roles/list.xhtml + + + + + Page d'attribution de rôles + roleAssignPage + /pages/user-manager/roles/assign.xhtml + + + + + Navigation directe vers attribution rôles + /pages/user-manager/roles/assign + /pages/user-manager/roles/assign.xhtml + + + + + + Page de journal d'audit + auditLogsPage + /pages/user-manager/audit/logs.xhtml + + + + + Navigation directe vers journal d'audit + /pages/user-manager/audit/logs + /pages/user-manager/audit/logs.xhtml + + + + + + Page de dashboard synchronisation + syncDashboardPage + /pages/user-manager/sync/dashboard.xhtml + + + + + Navigation directe vers dashboard synchronisation + /pages/user-manager/sync/dashboard + /pages/user-manager/sync/dashboard.xhtml + + + + + + Page de paramètres utilisateur + settingsPage + /pages/user-manager/settings.xhtml + + + + + Navigation directe vers paramètres + /pages/user-manager/settings + /pages/user-manager/settings.xhtml + + + + + + diff --git a/src/main/resources/META-INF/quarkus-config.properties b/src/main/resources/META-INF/quarkus-config.properties new file mode 100644 index 0000000..9953ae1 --- /dev/null +++ b/src/main/resources/META-INF/quarkus-config.properties @@ -0,0 +1,3 @@ +# Configuration Quarkus pour PrimeFaces +# Exclusion de classes obsolètes de PrimeFaces 14.0.5 + diff --git a/src/main/resources/META-INF/resources/index.xhtml b/src/main/resources/META-INF/resources/index.xhtml new file mode 100644 index 0000000..03bdbf0 --- /dev/null +++ b/src/main/resources/META-INF/resources/index.xhtml @@ -0,0 +1,58 @@ + + + + + + + Lions User Manager - Gestion des Utilisateurs Keycloak + + + + + + + + +
+
+
+ +

Lions User Manager

+

Gestion centralisée des utilisateurs Keycloak

+ +
+ + + + + + + + + + + +
+ +
+

Version 1.0.0

+

Module réutilisable pour l'écosystème LionsDev

+
+
+
+
+ + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/audit/logs.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/audit/logs.xhtml new file mode 100644 index 0000000..323df44 --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/audit/logs.xhtml @@ -0,0 +1,272 @@ + + + + + Journal d'Audit - Lions User Manager + + + + + + + + + +
+ + + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ + +
+ +
Logs d'Audit
+ + + + + + + + + + #{log.typeAction} + + + + +
+ + #{log.acteurUsername} +
+ + + + +
+ + #{log.ressourceType} +
+ + + + +
+ + #{log.dateAction} +
+ + + + + + #{log.details} + + + - + + + + + + + #{log.adresseIp} + + + - + + + + + + + + + + + +
+ + + + + +
+
+ Type d'action: +

#{auditConsultationBean.selectedLog.typeAction}

+
+
+ Acteur: +

#{auditConsultationBean.selectedLog.acteurUsername}

+
+
+ Ressource: +

#{auditConsultationBean.selectedLog.ressourceType} - #{auditConsultationBean.selectedLog.ressourceId}

+
+
+ Date: +

#{auditConsultationBean.selectedLog.dateAction}

+
+ +
+ Détails: +

#{auditConsultationBean.selectedLog.details}

+
+ + +
+ Adresse IP: +

#{auditConsultationBean.selectedLog.adresseIp}

+
+ + +
+ User Agent: +

#{auditConsultationBean.selectedLog.userAgent}

+
+ + +
+ Message d'erreur: +

#{auditConsultationBean.selectedLog.messageErreur}

+
+ +
+ + + + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/dashboard.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/dashboard.xhtml new file mode 100644 index 0000000..bd15150 --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/dashboard.xhtml @@ -0,0 +1,175 @@ + + + + Tableau de Bord - Lions User Manager + + + +
+ +
+ + + + + + + + + + +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + +
+
+ + + +
+
+ + + +
+
+ + + +
+
+ + + +
+
+ + + + + + + + + +
+
+ Version + 1.0.0 +
+
+ Realm Keycloak + lions-user-manager +
+
+ Statut + +
+
+ Application + Lions User Manager +
+
+ Environnement + Développement +
+
+ Base de données + Keycloak Admin API +
+
+ Framework + Quarkus, PrimeFaces Freya +
+
+ + +
+ + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/roles/assign.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/roles/assign.xhtml new file mode 100644 index 0000000..c8eaaaf --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/roles/assign.xhtml @@ -0,0 +1,32 @@ + + + + + Attribution de Rôles - Lions User Manager + + + + + + + + + + +
+ + + + + + +
+ + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/roles/list.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/roles/list.xhtml new file mode 100644 index 0000000..8f2c285 --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/roles/list.xhtml @@ -0,0 +1,166 @@ + + + + + Gestion des Rôles - Lions User Manager + + + + + + + + + +
+ + + + + + + + + + + + + + + + +
+ + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ + +
+ +
+ + + + +
+ + +
+

Aucun rôle Realm trouvé

+
+ +
+ + +
+ + +
+ + +
+ +
+ + + + +
+ + +
+

Aucun rôle Client trouvé

+
+ +
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/settings.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/settings.xhtml new file mode 100644 index 0000000..109f651 --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/settings.xhtml @@ -0,0 +1,131 @@ + + + + + Paramètres - Lions User Manager + + + + + + + + + +
+ +
+
+
Informations du compte
+ + + + + + + + + + + + + + + +
+
+ + +
+
+
Préférences
+ +
+
+ Thème des composants + + + + +
+
+ Mode sombre + + + + + +
+
+ Style d'input + + + + + +
+
+ +
+
+ + +
+
+
Actions
+
+ + + + + + + + + +
+
+
+
+ + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/sync/dashboard.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/sync/dashboard.xhtml new file mode 100644 index 0000000..8f2b662 --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/sync/dashboard.xhtml @@ -0,0 +1,49 @@ + + + + Synchronisation Keycloak - Lions User Manager + + + + + + + + + + +
+
+
+
État de Keycloak
+ + +
+
+
+
+
Actions de Synchronisation
+
+ + + + + + + + + + +
+
+
+
+ + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/users/create.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/users/create.xhtml new file mode 100644 index 0000000..4a48a01 --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/users/create.xhtml @@ -0,0 +1,333 @@ + + + + + Nouvel Utilisateur - Lions User Manager + + +
+ +
+
+
+
+ +
+

Nouvel Utilisateur

+

Créer un nouvel utilisateur dans Keycloak

+
+
+ + + Retour à la liste + +
+
+
+ + + +
+
+

+ + Informations de l'Utilisateur +

+ +
+ +
+
+

+ + Informations de Base +

+ + +
+ + + + + Identifiant unique de connexion +
+ + +
+ + + + +
+ + +
+ + + + +
+ + +
+ + + + +
+
+
+ + +
+ +
+

+ + Mot de Passe +

+ + +
+ + + + + Au moins 8 caractères +
+ + +
+ + + +
+
+ + +
+

+ + Configuration +

+ + +
+ + + + +
+ + +
+ +
+ + + +
+ + +
+ + + +
+
+
+
+
+
+
+ + +
+
+

+ + Actions +

+ +
+ + + + + + + + + + + + + + +
+ + + + +
+ + + + + +
+
+ +
+ + + + + + + + + +
+
+

+ + Informations Requises +

+
    +
  • Nom d'utilisateur : Identifiant unique (3-50 caractères)
    • +
  • Email : Adresse email valide
    • +
  • Mot de passe : Au moins 8 caractères
    • +
+ +

+ + Sécurité +

+
    +
  • Le mot de passe doit contenir au moins 8 caractères
    • +
  • Utilisez une combinaison de lettres, chiffres et caractères spéciaux
    • +
  • L'utilisateur pourra modifier son mot de passe après la première connexion
    • +
+ +

+ + Configuration +

+
    +
  • Compte activé : L'utilisateur peut se connecter immédiatement
    • +
  • Email vérifié : L'email est considéré comme vérifié
    • +
  • Realm : Espace d'administration Keycloak
    • +
+
+
+ + + + + + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/users/edit.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/users/edit.xhtml new file mode 100644 index 0000000..2f75390 --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/users/edit.xhtml @@ -0,0 +1,33 @@ + + + + + Modifier Utilisateur - Lions User Manager + + + + + + + + + + +
+ + + + + + + +
+ + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/users/list.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/users/list.xhtml new file mode 100644 index 0000000..2f7bcff --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/users/list.xhtml @@ -0,0 +1,429 @@ + + + + + Liste des Utilisateurs - Lions User Manager + + + +
+ +
+
+
+
+ +
+

Gestion des Utilisateurs

+

Gestion centralisée des utilisateurs Keycloak - Recherche, création, modification et suppression

+
+
+
+ + +
+
+
+
+ + +
+
Statistiques des Utilisateurs
+
+ + +
+
+
+
+
Total Utilisateurs
+
#{userListBean.totalRecords}
+
+
+ +
+
+
+ + Utilisateurs dans le realm +
+
+
+ + +
+
+
+
+
Utilisateurs Actifs
+
#{userListBean.activeUsersCount}
+
+
+ +
+
+
+ + + #{userListBean.activeUsersPercentage}% + + Taux d'activation +
+ +
+
+ + +
+
+
+
+
Utilisateurs Désactivés
+
#{userListBean.disabledUsersCount}
+
+
+ +
+
+
+ + + #{userListBean.disabledUsersPercentage}% + + Taux de désactivation +
+ +
+
+ + +
+
+
+
+
Realm Actuel
+
#{userListBean.realmName}
+
+
+ +
+
+
+ + Realm Keycloak +
+
+
+ + +
+
+
+ +
Recherche et Filtres
+
+ +
+
+ + + + +
+ +
+ + + + + + +
+ +
+ + + + + + +
+ +
+ +
+
+
+
+ + +
+
+
+
+ +
Liste des Utilisateurs
+
+ +
+ + + + + + + +
+
+ + #{user.prenom != null ? user.prenom.substring(0,1).toUpperCase() : 'U'}#{user.nom != null ? user.nom.substring(0,1).toUpperCase() : 'U'} + +
+
+ #{user.username} + #{user.prenom} #{user.nom} +
+
+ + + + +
+ + #{user.email} + + + +
+ + + + + + + + + +
+ + + + + + + + +
+ + + + +
+ + + + + + + + + + + + + + + + + +
+ + + + + + + +
+
+ + +
+
+
+ +
Actions Rapides
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+
+ + + + + +
+

+ Importez des utilisateurs depuis un fichier CSV ou JSON. +

+ +
+ + +
+
+ + + + + diff --git a/src/main/resources/META-INF/resources/pages/user-manager/users/profile.xhtml b/src/main/resources/META-INF/resources/pages/user-manager/users/profile.xhtml new file mode 100644 index 0000000..ee6b1df --- /dev/null +++ b/src/main/resources/META-INF/resources/pages/user-manager/users/profile.xhtml @@ -0,0 +1,421 @@ + + + + + Mon Profil - Lions User Manager + + +
+ +
+
+
+

+ + Mon Profil +

+ + + Retour au tableau de bord + +
+
+
+ + +
+
+
+ +
+
+ +
+ #{userSessionBean.initials} +
+ + +

#{userSessionBean.fullName}

+ + +

+ + #{userSessionBean.email} +

+ + +
+ + + Connecté + +
+ + +
+ + #{userSessionBean.primaryRole} + +
+
+
+ + +
+
+ +
+

+ + Informations Personnelles +

+ +
+ +

#{userSessionBean.username}

+
+ +
+ +

#{userSessionBean.fullName}

+
+ +
+ +
+

#{userSessionBean.email}

+ +
+
+ +
+ +

#{userSessionBean.firstName}

+
+ +
+ +

#{userSessionBean.lastName}

+
+
+ + +
+

+ + Rôles et Permissions +

+ +
+ +
+ + + +
+
+ +
+ +
+ + +
+
+ +
+ +

+ + + + + +

+
+ +
+ +
+ +
+
+
+
+
+
+
+
+ + +
+
+

+ + Informations de Session OIDC +

+ +
+ +
+

Informations du Token

+ +
+ +

+ #{userSessionBean.issuer} +

+
+ +
+ +

+ #{userSessionBean.subject} +

+
+ +
+ +

+ account +

+
+ +
+ +
+ +
+
+
+ + +
+

Détails de la Session

+ +
+ +
+ +

+ + + +

+
+
+ +
+ +
+ +

+ + + +

+
+
+ +
+ +
+ +

+ lions-user-manager +

+
+
+ +
+ +
+ +

+ Session active +

+
+
+
+
+
+
+ + +
+
+

+ + Statistiques d'Activité +

+ +
+
+
+
+ Connexions + +
+

--

+ Total des connexions +
+
+ +
+
+
+ Dernière connexion + +
+

Aujourd'hui

+ Session en cours +
+
+ +
+
+
+ Actions + +
+

--

+ Actions effectuées +
+
+ +
+
+
+ Sessions + +
+

1

+ Session active +
+
+
+
+
+ + +
+
+

+ + Actions Rapides +

+ + +
+ +
+
+

+ + Gestion du Profil +

+
+ + + + + + + + + + + +
+
+
+ + +
+
+

+ + Sessions et Sécurité +

+
+ + + + + + + + + + + +
+
+
+
+ +
+
+
+ + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/resources/components/user-action-dropdown.xhtml b/src/main/resources/META-INF/resources/resources/components/user-action-dropdown.xhtml new file mode 100644 index 0000000..1ae248a --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/components/user-action-dropdown.xhtml @@ -0,0 +1,110 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/resources/css/custom-topbar.css b/src/main/resources/META-INF/resources/resources/css/custom-topbar.css new file mode 100644 index 0000000..aa01c86 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/css/custom-topbar.css @@ -0,0 +1,625 @@ +/* ============================================================================ + Lions User Manager - Enhanced Custom Topbar Styles + + Auteur: Lions User Manager + Version: 2.0.0 + Description: Styles améliorés pour la topbar avec intégration intelligente + des patterns Freya layout pour un rendu parfait + + Intégrations: + - Freya Layout Variables & Patterns + - Support Dark/Light Theme + - Animations fluides (fadeInDown, modal-in) + - PrimeFlex utility classes + - Responsive design + ============================================================================ */ + +/* ---------------------------------------------------------------------------- + BASE TOPBAR LAYOUT OVERRIDES + Améliore la structure de base de la topbar Freya + ---------------------------------------------------------------------------- */ + +.layout-topbar { + position: fixed; + top: 0; + z-index: 999; + width: 100%; + height: 62px; + transition: width 0.2s, box-shadow 0.3s ease; +} + +.layout-topbar .layout-topbar-wrapper { + height: 100%; + display: flex; + align-items: center; +} + +.layout-topbar .layout-topbar-wrapper .layout-topbar-right { + height: 100%; + flex-grow: 1; + padding: 0 16px 0 12px; + display: flex; + align-items: center; + justify-content: space-between; +} + +.layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions { + display: flex; + align-items: center; + justify-content: flex-end; + flex-grow: 1; + list-style-type: none; + margin: 0; + padding: 0; + height: 100%; +} + +.layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li { + position: relative; + display: flex; + align-items: center; + justify-content: center; + height: 100%; +} + +/* ---------------------------------------------------------------------------- + USER PROFILE LINK - Enhanced with Freya patterns + ---------------------------------------------------------------------------- */ + +.layout-topbar .user-profile-link { + display: flex !important; + align-items: center; + gap: 0.75rem; + padding: 0.5rem 0.75rem; + border-radius: 6px; + transition: all 0.2s cubic-bezier(0.05, 0.74, 0.2, 0.99); + text-decoration: none; + cursor: pointer; + position: relative; + overflow: hidden; +} + +.layout-topbar .user-profile-link::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05)); + opacity: 0; + transition: opacity 0.2s ease; +} + +.layout-topbar .user-profile-link:hover::before { + opacity: 1; +} + +.layout-topbar .user-profile-link:hover { + background-color: rgba(255, 255, 255, 0.12); + transform: translateY(-1px); + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); +} + +/* User Avatar - Integration with Freya avatar patterns */ +.layout-topbar .user-profile-link .user-avatar { + width: 36px; + height: 36px; + border-radius: 50%; + flex-shrink: 0; + display: flex; + align-items: center; + justify-content: center; + font-size: 14px; + font-weight: 600; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); + transition: transform 0.2s ease, box-shadow 0.2s ease; +} + +.layout-topbar .user-profile-link:hover .user-avatar { + transform: scale(1.05); + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); +} + +/* User Info Container */ +.layout-topbar .user-info { + display: flex; + flex-direction: column; + align-items: flex-start; + line-height: 1.2; + min-width: 0; +} + +/* User Name - Enhanced typography */ +.layout-topbar .user-name { + font-weight: 600; + font-size: 0.875rem; + color: var(--text-color); + margin-bottom: 0.125rem; + display: flex; + align-items: center; + gap: 0.5rem; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + max-width: 200px; +} + +/* User Email */ +.layout-topbar .user-email { + font-size: 0.75rem; + color: var(--text-color-secondary); + opacity: 0.85; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + max-width: 200px; +} + +/* User Role Badge */ +.layout-topbar .user-role { + font-size: 0.7rem; + color: var(--primary-color); + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.6px; + background: rgba(var(--primary-color-rgb, 79, 142, 236), 0.1); + padding: 0.125rem 0.375rem; + border-radius: 4px; + white-space: nowrap; +} + +.layout-topbar .user-separator { + color: var(--text-color-secondary); + opacity: 0.5; + font-weight: 300; + margin: 0 0.25rem; +} + +/* Online Status Indicator */ +.layout-topbar .user-status { + width: 8px; + height: 8px; + border-radius: 50%; + display: inline-block; + position: relative; +} + +.layout-topbar .user-status.online { + background-color: #4CAF50; + box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.3); + animation: pulse-online 2s ease-in-out infinite; +} + +@keyframes pulse-online { + 0%, 100% { + box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.3); + } + 50% { + box-shadow: 0 0 0 4px rgba(76, 175, 80, 0.2); + } +} + +/* ---------------------------------------------------------------------------- + USER DROPDOWN MENU - Enhanced with Freya dropdown patterns + ---------------------------------------------------------------------------- */ + +.layout-topbar .user-dropdown-menu { + display: none; + position: absolute; + top: 62px; + right: 0; + min-width: 280px; + max-width: 320px; + padding: 0; + margin: 0; + list-style-type: none; + border-radius: 12px; + box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.08); + border: 1px solid var(--surface-border); + background: var(--surface-card); + overflow: hidden; + z-index: 1000; + animation-duration: 0.2s; + animation-timing-function: cubic-bezier(0.05, 0.74, 0.2, 0.99); + animation-fill-mode: forwards; +} + +/* Show dropdown when parent is active */ +.layout-topbar .user-profile.active-topmenuitem > .user-dropdown-menu { + display: block; + animation-name: fadeInDown; +} + +/* Dropdown Header - Integration with Freya gradient patterns */ +.user-dropdown-header { + padding: 1.25rem 1rem; + background: linear-gradient(135deg, var(--primary-color), var(--primary-600, #387FE9)); + color: white; + display: flex; + align-items: center; + gap: 0.75rem; + position: relative; + overflow: hidden; +} + +.user-dropdown-header::before { + content: ''; + position: absolute; + top: -50%; + right: -50%; + width: 200%; + height: 200%; + background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%); + animation: shimmer 3s ease-in-out infinite; +} + +@keyframes shimmer { + 0%, 100% { transform: translate(0, 0); } + 50% { transform: translate(-20%, -20%); } +} + +/* Dropdown Avatar */ +.user-dropdown-avatar { + position: relative; + flex-shrink: 0; +} + +.user-dropdown-avatar > div { + width: 48px; + height: 48px; + border-radius: 50%; + border: 2px solid rgba(255, 255, 255, 0.3); + display: flex; + align-items: center; + justify-content: center; + font-size: 20px; + font-weight: 700; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); +} + +.user-status-indicator { + position: absolute; + bottom: 2px; + right: 2px; + width: 10px; + height: 10px; + border-radius: 50%; + border: 2px solid white; +} + +.user-status-indicator.online { + background-color: #4CAF50; + animation: pulse-indicator 2s ease-in-out infinite; +} + +@keyframes pulse-indicator { + 0%, 100% { transform: scale(1); } + 50% { transform: scale(1.1); } +} + +/* Dropdown User Info */ +.user-dropdown-info { + flex: 1; + min-width: 0; +} + +.user-dropdown-name { + font-weight: 600; + font-size: 1rem; + margin-bottom: 0.25rem; + color: white; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.user-dropdown-email { + font-size: 0.875rem; + opacity: 0.95; + margin-bottom: 0.25rem; + color: rgba(255, 255, 255, 0.95); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.user-dropdown-role { + font-size: 0.75rem; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.5px; + background: rgba(255, 255, 255, 0.25); + padding: 0.25rem 0.5rem; + border-radius: 12px; + display: inline-block; + color: white; + backdrop-filter: blur(10px); +} + +/* Dividers */ +.user-dropdown-divider { + height: 1px; + background-color: var(--surface-border); + margin: 0; +} + +/* Menu Sections */ +.user-dropdown-section { + padding: 0.75rem 0; +} + +.section-title { + font-size: 0.75rem; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.5px; + color: var(--text-color-secondary); + padding: 0 1rem 0.5rem 1rem; + margin-bottom: 0.25rem; +} + +.section-items { + display: flex; + flex-direction: column; +} + +/* Dropdown Items - Enhanced with Freya interaction patterns */ +.dropdown-item { + display: flex; + align-items: center; + gap: 0.75rem; + padding: 0.75rem 1rem; + color: var(--text-color); + text-decoration: none; + transition: all 0.2s cubic-bezier(0.05, 0.74, 0.2, 0.99); + border: none; + background: none; + width: 100%; + text-align: left; + cursor: pointer; + font-size: 0.875rem; + font-weight: 500; + position: relative; + overflow: hidden; +} + +.dropdown-item::before { + content: ''; + position: absolute; + left: 0; + top: 0; + width: 3px; + height: 100%; + background: var(--primary-color); + transform: scaleX(0); + transition: transform 0.2s ease; +} + +.dropdown-item:hover::before { + transform: scaleX(1); +} + +.dropdown-item:hover { + background-color: var(--surface-hover); + color: var(--primary-color); + padding-left: 1.25rem; +} + +.dropdown-item:active { + background-color: var(--surface-ground); + transform: scale(0.98); +} + +.dropdown-item i { + width: 1.25rem; + text-align: center; + color: var(--text-color-secondary); + transition: all 0.2s ease; + font-size: 1rem; +} + +.dropdown-item:hover i { + color: var(--primary-color); + transform: scale(1.1); +} + +.dropdown-item span { + flex: 1; +} + +.item-arrow { + margin-left: auto; + opacity: 0; + transition: opacity 0.2s ease, transform 0.2s ease; + font-size: 0.75rem; +} + +.dropdown-item:hover .item-arrow { + opacity: 1; + transform: translateX(4px); +} + +/* Logout Item - Enhanced danger state */ +.logout-item { + color: var(--red-500) !important; + margin-top: 0.25rem; +} + +.logout-item:hover { + background-color: var(--red-50) !important; + color: var(--red-600) !important; +} + +.logout-item i { + color: var(--red-500) !important; +} + +.logout-item:hover i { + color: var(--red-600) !important; + transform: scale(1.1) rotate(-5deg); +} + +/* ---------------------------------------------------------------------------- + ANIMATIONS - Integration with Freya animation patterns + ---------------------------------------------------------------------------- */ + +@keyframes dropdownFadeIn { + 0% { + opacity: 0; + transform: translateY(-10px) scale(0.95); + } + 100% { + opacity: 1; + transform: translateY(0) scale(1); + } +} + +.user-dropdown-menu { + animation: dropdownFadeIn 0.3s ease-out; + transform-origin: top right; +} + +/* ---------------------------------------------------------------------------- + DARK MODE SUPPORT - Integration with Freya dark theme + ---------------------------------------------------------------------------- */ + +.layout-wrapper.layout-topbar-dark .layout-topbar { + background-color: #293241; + box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.2); +} + +.layout-wrapper.layout-topbar-dark .user-profile-link:hover { + background-color: rgba(255, 255, 255, 0.08); +} + +.layout-wrapper.layout-topbar-dark .user-dropdown-menu { + background: var(--surface-900, #1E1E1E); + border-color: var(--surface-700, #383838); + box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4), 0 2px 6px rgba(0, 0, 0, 0.3); +} + +.layout-wrapper.layout-topbar-dark .user-dropdown-divider { + background-color: var(--surface-700, #383838); +} + +.layout-wrapper.layout-topbar-dark .section-title { + color: var(--text-color-secondary); + opacity: 0.8; +} + +.layout-wrapper.layout-topbar-dark .dropdown-item { + color: var(--text-color); +} + +.layout-wrapper.layout-topbar-dark .dropdown-item:hover { + background-color: var(--surface-800, #2A2A2A); +} + +.layout-wrapper.layout-topbar-dark .logout-item:hover { + background-color: rgba(211, 47, 47, 0.1) !important; +} + +/* ---------------------------------------------------------------------------- + RESPONSIVE DESIGN - Integration with Freya responsive patterns + ---------------------------------------------------------------------------- */ + +@media (max-width: 991px) { + .layout-topbar .user-dropdown-menu { + left: 10px; + right: 10px; + position: fixed; + top: 62px; + max-width: none; + } +} + +@media (max-width: 768px) { + .layout-topbar .user-dropdown-menu { + min-width: 260px; + max-width: 280px; + } + + .user-dropdown-header { + padding: 1rem 0.75rem; + } + + .dropdown-item { + padding: 0.625rem 0.75rem; + font-size: 0.8125rem; + } + + .section-title { + padding: 0 0.75rem 0.5rem 0.75rem; + } + + /* Hide user info on mobile */ + .layout-topbar .user-info { + display: none; + } + + .layout-topbar .user-profile-link { + padding: 0.5rem; + } +} + +@media (max-width: 576px) { + .layout-topbar .user-dropdown-menu { + left: 8px; + right: 8px; + border-radius: 12px; + } +} + +/* ---------------------------------------------------------------------------- + ACCESSIBILITY ENHANCEMENTS + ---------------------------------------------------------------------------- */ + +.dropdown-item:focus, +.user-profile-link:focus { + outline: 2px solid var(--primary-color); + outline-offset: 2px; +} + +@media (prefers-reduced-motion: reduce) { + .layout-topbar .user-profile-link, + .dropdown-item, + .user-dropdown-menu, + .user-avatar, + .item-arrow { + animation: none; + transition: none; + } +} + +/* ---------------------------------------------------------------------------- + UTILITY CLASSES - PrimeFlex integration + ---------------------------------------------------------------------------- */ + +.layout-topbar .flex { + display: flex !important; +} + +.layout-topbar .align-items-center { + align-items: center !important; +} + +.layout-topbar .justify-content-center { + justify-content: center !important; +} + +.layout-topbar .gap-2 { + gap: 0.5rem !important; +} + +.layout-topbar .text-white { + color: white !important; +} + +.layout-topbar .border-circle { + border-radius: 50% !important; +} + +.layout-topbar .bg-primary { + background-color: var(--primary-color) !important; +} diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-dark.css b/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-dark.css new file mode 100644 index 0000000..ca9fac2 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-dark.css @@ -0,0 +1,4257 @@ +/* Add your customizations of the layout variables here */ +@-webkit-keyframes fadeInDown { + from { + opacity: 0; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } + to { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} +@keyframes fadeInDown { + from { + opacity: 0; + transform: translate3d(0, -20px, 0); + } + to { + opacity: 1; + transform: none; + } +} +@-webkit-keyframes fadeOutUp { + from { + opacity: 1; + } + to { + opacity: 0; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } +} +@keyframes fadeOutUp { + from { + opacity: 1; + } + to { + opacity: 0; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } +} +@keyframes fadeinmask { + from { + opacity: 0; + } + to { + opacity: 0.8; + } +} +.fadeInDown { + -webkit-animation-name: fadeInDown; + animation-name: fadeInDown; +} + +.fadeOutUp { + -webkit-animation-name: fadeOutUp; + animation-name: fadeOutUp; +} + +@-webkit-keyframes modal-in { + from { + background-color: transparent; + } + to { + background-color: rgba(0, 0, 0, 0.6); + } +} +@keyframes modal-in { + from { + background-color: transparent; + } + to { + background-color: rgba(0, 0, 0, 0.6); + } +} +.modal-in { + -webkit-animation-name: modal-in; + animation-name: modal-in; +} + +h1, h2, h3, h4, h5, h6 { + margin: 1.5rem 0 1rem 0; + font-family: inherit; + font-weight: 600; + line-height: 1.2; + color: inherit; +} +h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { + margin-top: 0; +} + +h1 { + font-size: 2.5rem; +} + +h2 { + font-size: 2rem; +} + +h3 { + font-size: 1.75rem; +} + +h4 { + font-size: 1.5rem; +} + +h5 { + font-size: 1.25rem; +} + +h6 { + font-size: 1rem; +} + +mark { + background: #FFF8E1; + padding: 0.25rem 0.4rem; + border-radius: 24px; + font-family: monospace; +} + +blockquote { + margin: 1rem 0; + padding: 0 2rem; + border-left: 4px solid #90A4AE; +} + +hr { + border-top: solid #383838; + border-width: 1px 0 0 0; + margin: 1rem 0; +} + +p { + margin: 0 0 1rem 0; + line-height: 1.5; +} +p:last-child { + margin-bottom: 0; +} + +html { + height: 100%; + font-size: 14px; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + font-size: 14px; + font-weight: 400; + color: #EAEBEC; + padding: 0; + margin: 0; + min-height: 100%; + background-color: #3E4754; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} +body.blocked-scroll { + overflow: auto; +} + +a { + text-decoration: none; + color: #669cee; + color: var(--primary-color); +} + +.ajax-loader { + font-size: 32px; + color: #387fe9; + color: var(--primary-color); +} + +.layout-main { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + min-height: 100vh; + padding-top: 82px; + -moz-transition: padding-left 0.2s; + -o-transition: padding-left 0.2s; + -webkit-transition: padding-left 0.2s; + transition: padding-left 0.2s; +} + +.layout-mask { + display: none; + position: fixed; + top: 0; + left: 0; + z-index: 998; + width: 100%; + height: 100%; + animation-duration: 0.2s; + animation-timing-function: cubic-bezier(0.05, 0.74, 0.2, 0.99); + animation-fill-mode: forwards; +} + +.layout-content { + padding: 30px 36px; + flex: 1 1 auto; +} + +@media (max-width: 991px) { + .layout-content { + padding: 32px 14px; + } +} +.layout-topbar-light .layout-topbar { + position: fixed; + top: 0; + z-index: 999; + width: 100%; + -moz-transition: width 0.2s; + -o-transition: width 0.2s; + -webkit-transition: width 0.2s; + transition: width 0.2s; + height: 62px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper { + height: 100%; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left { + height: 100%; + padding: 0 16px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + z-index: 999; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo { + height: 15px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo > img { + height: 15px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button { + padding: 6px; + margin-right: 16px; + border-radius: 4px; + display: none; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button i { + font-size: 18px; + width: 18px; + height: 18px; + background-color: transparent; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right { + height: 100%; + flex-grow: 1; + padding: 0 16px 0 12px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + border-right: solid 1px transparent; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: end; + justify-content: flex-end; + flex-grow: 1; + list-style-type: none; + margin: 0; + padding: 0; + height: 100%; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li { + position: relative; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + height: 100%; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a { + width: 100%; + padding: 6px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a > .topbar-icon { + font-size: 18px; + border-radius: 6px; + width: 30px; + height: 30px; + background-color: transparent; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a.layout-rightpanel-button i { + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + display: none; + position: absolute; + top: 62px; + right: 0px; + list-style-type: none; + margin: 0; + padding: 7px 0 8px; + z-index: 1000; + -moz-border-radius-bottomleft: 2px; + -webkit-border-bottom-left-radius: 2px; + border-bottom-left-radius: 2px; + -moz-border-radius-bottomright: 2px; + -webkit-border-bottom-right-radius: 2px; + border-bottom-right-radius: 2px; + min-width: 250px; + animation-duration: 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .angle-icon { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: end; + justify-content: flex-end; + flex-grow: 1; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li { + padding: 10px 15px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + cursor: pointer; + list-style: none; + margin-bottom: 4px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + font-weight: 600; + font-size: 12px; + line-height: 14px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a i { + margin-right: 10px; + padding: 6px; + border-radius: 2px; + width: 26px; + height: 26px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a img { + height: 36px; + width: 36px; + margin-right: 10px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item a { + width: auto; + display: block; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper { + position: relative; + width: 0; + opacity: 0; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper .ui-inputfield { + background: #303A48; + width: 100%; + position: relative; + padding: 9px; + padding-left: 37px; + border: none; + color: #FFFFFF; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper i { + position: absolute; + left: 9px; + font-size: 18px; + top: 50%; + margin-top: -9px; + display: none; + z-index: 1; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.user-profile > a { + margin-left: 16px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.user-profile > a > img { + height: 28px; + width: 28px; + border-radius: 10px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: none; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item .search-input-wrapper { + width: 200px; + opacity: 1; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item .search-input-wrapper i { + display: block; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: none; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem > ul { + display: block; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button { + font-size: 18px; + border-radius: 6px; + width: 30px; + height: 30px; + margin-left: 26px; + z-index: 1; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +@media (max-width: 991px) { + .layout-topbar-light .layout-topbar .layout-topbar-wrapper { + -ms-flex-align: start; + align-items: flex-start; + position: relative; + padding: 0 6px; + } +} +@media (max-width: 576px) { + .layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: block; + } + .layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > .search-input-wrapper { + display: none; + } + .layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: block; + padding: 0; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + } + .layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + left: 10px; + right: 10px; + position: fixed; + top: 62px; + } +} +.layout-topbar-light .layout-topbar { + background-color: #ffffff; + box-shadow: 0 10px 40px 0 rgba(41, 50, 65, 0.06); +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button > i { + color: #293241; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button:hover { + background-color: #E8EDF0; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a > .topbar-icon { + color: #293241; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a:hover i { + background-color: #E8EDF0; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper input { + background-color: #f8fafc; + border: 1px solid #ebedef; + color: #669cee; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper input::placeholder { + color: #669cee; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper i { + color: #293241; + opacity: 0.5; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + box-shadow: 0 2px 8px 0 rgba(25, 26, 28, 0.12); + background-color: white; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header { + background-color: #5d97ed; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header h6 { + color: #ffffff; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header:hover { + background-color: #5d97ed; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a { + color: #EAEBEC; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a i { + background-color: rgba(56, 127, 233, 0.8); + color: #ffffff; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a .notification-detail { + color: #BFC2C6; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li .menu-text p { + color: #EAEBEC; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li .menu-text span { + color: #BFC2C6; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li:hover { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button { + color: #293241; + background-color: transparent; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button:hover { + background-color: #E8EDF0; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} + +.layout-topbar-dark .layout-topbar { + position: fixed; + top: 0; + z-index: 999; + width: 100%; + -moz-transition: width 0.2s; + -o-transition: width 0.2s; + -webkit-transition: width 0.2s; + transition: width 0.2s; + height: 62px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper { + height: 100%; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left { + height: 100%; + padding: 0 16px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + z-index: 999; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo { + height: 15px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo > img { + height: 15px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button { + padding: 6px; + margin-right: 16px; + border-radius: 4px; + display: none; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button i { + font-size: 18px; + width: 18px; + height: 18px; + background-color: transparent; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right { + height: 100%; + flex-grow: 1; + padding: 0 16px 0 12px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + border-right: solid 1px transparent; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: end; + justify-content: flex-end; + flex-grow: 1; + list-style-type: none; + margin: 0; + padding: 0; + height: 100%; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li { + position: relative; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + height: 100%; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a { + width: 100%; + padding: 6px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a > .topbar-icon { + font-size: 18px; + border-radius: 6px; + width: 30px; + height: 30px; + background-color: transparent; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a.layout-rightpanel-button i { + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + display: none; + position: absolute; + top: 62px; + right: 0px; + list-style-type: none; + margin: 0; + padding: 7px 0 8px; + z-index: 1000; + -moz-border-radius-bottomleft: 2px; + -webkit-border-bottom-left-radius: 2px; + border-bottom-left-radius: 2px; + -moz-border-radius-bottomright: 2px; + -webkit-border-bottom-right-radius: 2px; + border-bottom-right-radius: 2px; + min-width: 250px; + animation-duration: 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .angle-icon { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: end; + justify-content: flex-end; + flex-grow: 1; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li { + padding: 10px 15px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + cursor: pointer; + list-style: none; + margin-bottom: 4px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + font-weight: 600; + font-size: 12px; + line-height: 14px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a i { + margin-right: 10px; + padding: 6px; + border-radius: 2px; + width: 26px; + height: 26px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a img { + height: 36px; + width: 36px; + margin-right: 10px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item a { + width: auto; + display: block; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper { + position: relative; + width: 0; + opacity: 0; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper .ui-inputfield { + background: #303A48; + width: 100%; + position: relative; + padding: 9px; + padding-left: 37px; + border: none; + color: #FFFFFF; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper i { + position: absolute; + left: 9px; + font-size: 18px; + top: 50%; + margin-top: -9px; + display: none; + z-index: 1; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.user-profile > a { + margin-left: 16px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.user-profile > a > img { + height: 28px; + width: 28px; + border-radius: 10px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: none; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item .search-input-wrapper { + width: 200px; + opacity: 1; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item .search-input-wrapper i { + display: block; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: none; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem > ul { + display: block; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button { + font-size: 18px; + border-radius: 6px; + width: 30px; + height: 30px; + margin-left: 26px; + z-index: 1; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +@media (max-width: 991px) { + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper { + -ms-flex-align: start; + align-items: flex-start; + position: relative; + padding: 0 6px; + } +} +@media (max-width: 576px) { + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: block; + } + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > .search-input-wrapper { + display: none; + } + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: block; + padding: 0; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + } + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + left: 10px; + right: 10px; + position: fixed; + top: 62px; + } +} +.layout-topbar-dark .layout-topbar { + background-color: #293241; + box-shadow: none; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button > i { + color: #E9E9E9; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button:hover { + background-color: #333e51; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a > .topbar-icon { + color: #E9E9E9; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a:hover i { + background-color: #333e51; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper input { + background-color: #333e51; + border: 1px solid #333e51; + color: #94baf3; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper input::placeholder { + color: #94baf3; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper i { + color: #E9E9E9; + opacity: 0.5; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + box-shadow: 0 2px 8px 0 rgba(25, 26, 28, 0.12); + background-color: #333e51; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header { + background-color: #5d97ed; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header h6 { + color: #ffffff; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header:hover { + background-color: #5d97ed; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a { + color: #E9E9E9; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a i { + background-color: rgba(56, 127, 233, 0.8); + color: #ffffff; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a .notification-detail { + color: #C2C2C2; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li .menu-text p { + color: #E9E9E9; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li .menu-text span { + color: #C2C2C2; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li:hover { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button { + color: #E9E9E9; + background-color: transparent; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button:hover { + background-color: #333e51; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} + +.menu-wrapper { + height: 100%; + position: fixed; + top: 0; + z-index: 999; + left: 0; +} +.menu-wrapper .sidebar-logo { + height: 62px; + display: -ms-flexbox; + display: flex; + -ms-flex-pack: start; + justify-content: flex-start; + -ms-flex-align: center; + align-items: center; + padding: 0 22px; + padding-right: 20px; +} +.menu-wrapper .sidebar-logo .sidebar-pin { + display: none; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.menu-wrapper .sidebar-logo .sidebar-pin > span { + display: block; + height: 16px; + width: 16px; + -moz-border-radius: 50%; + -webkit-border-radius: 50%; + border-radius: 50%; + border: 2px solid #383838; +} +.menu-wrapper .sidebar-logo img { + width: 17px; + height: 20px; + border: 0 none; +} +.menu-wrapper .layout-menu-container { + height: calc(100% - 62px); +} +.menu-wrapper .layout-menu-container .layout-menu { + list-style-type: none; + margin: 0; + padding: 0; + max-width: 62px; + overflow: hidden; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.menu-wrapper .layout-menu-container .layout-menu > li > a { + position: relative; +} +.menu-wrapper .layout-menu-container .layout-menu > li > a::before { + content: ""; + width: 4px; + height: 12px; + display: block; + border-radius: 0px 3px 3px 0px; + position: absolute; + left: 0; +} +.menu-wrapper .layout-menu-container .layout-menu > li > ul > li { + margin-left: 6px; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; +} +.menu-wrapper .layout-menu-container .layout-menu li { + padding: 10px 0; +} +.menu-wrapper .layout-menu-container .layout-menu li.active-menuitem > a i.layout-submenu-toggler { + -webkit-transform: rotate(-180deg); + -moz-transform: rotate(-180deg); + -o-transform: rotate(-180deg); + -ms-transform: rotate(-180deg); + transform: rotate(-180deg); +} +.menu-wrapper .layout-menu-container .layout-menu li .layout-menu-tooltip { + display: none; +} +.menu-wrapper .layout-menu-container .layout-menu li > a { + margin: 0px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; + font-size: 13px; + padding: 6px 20px; + user-select: none; + cursor: pointer; +} +.menu-wrapper .layout-menu-container .layout-menu li > a > span { + margin: 0 8px; + margin-left: 14px; + font-weight: 600; + font-size: 12px; + line-height: 14px; + visibility: hidden; + white-space: nowrap; +} +.menu-wrapper .layout-menu-container .layout-menu li > a > i { + font-size: 24px; +} +.menu-wrapper .layout-menu-container .layout-menu li > a > i.layout-submenu-toggler { + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; + margin-left: auto; + font-size: 12px; + visibility: hidden; +} +.menu-wrapper .layout-menu-container .layout-menu li > a.rotated-icon i { + transform: rotate(90deg); +} +.menu-wrapper .layout-menu-container .layout-menu li > ul { + display: none; + list-style-type: none; + overflow: hidden; + padding: 0; + margin: 0; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul li ul { + display: none; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li { + padding: 0; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li > a { + padding: 10px 18px; + margin-left: 0px; + padding-right: 8px; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li i { + font-size: 14px; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li ul li { + padding: 0; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li.layout-root-menuitem > a { + display: -ms-flexbox; + display: flex; +} + +@media (min-width: 992px) { + .layout-wrapper.layout-sidebar .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo { + display: none; + } + .layout-wrapper.layout-sidebar .layout-main { + padding-left: 62px; + } + .layout-wrapper.layout-static .menu-wrapper { + transform: translate3d(0px, 0px, 0px); + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo { + justify-content: space-between; + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo img { + display: inline; + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo .app-name { + display: inline; + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo .sidebar-pin { + display: inline-block; + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo .sidebar-pin > span { + display: block; + height: 16px; + width: 16px; + -moz-border-radius: 50%; + -webkit-border-radius: 50%; + border-radius: 50%; + border: 2px solid #383838; + border: 2px solid var(--primary-light-color); + background-color: #383838; + background-color: var(--primary-lighter-color); + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu { + max-width: 230px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu > li { + min-width: 230px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu > li > ul > li { + margin-left: 10px; + margin-right: 12px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li a { + padding-left: 20px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li a { + padding-left: 30px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li a { + padding-left: 40px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li a { + padding-left: 50px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li > a > span { + visibility: visible; + white-space: normal; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li > a i.layout-submenu-toggler { + visibility: visible; + } + .layout-wrapper.layout-static .layout-main { + padding-left: 230px; + -moz-transition: padding-left 0.2s; + -o-transition: padding-left 0.2s; + -webkit-transition: padding-left 0.2s; + transition: padding-left 0.2s; + } + + .menu-wrapper.layout-sidebar-active { + transform: translate3d(0px, 0px, 0px); + } + .menu-wrapper.layout-sidebar-active .sidebar-logo { + justify-content: space-between; + } + .menu-wrapper.layout-sidebar-active .sidebar-logo img { + display: inline; + } + .menu-wrapper.layout-sidebar-active .sidebar-logo .app-name { + display: inline; + } + .menu-wrapper.layout-sidebar-active .sidebar-logo .sidebar-pin { + display: inline-block; + } + .menu-wrapper.layout-sidebar-active .sidebar-logo .sidebar-pin > span { + display: block; + height: 16px; + width: 16px; + -moz-border-radius: 50%; + -webkit-border-radius: 50%; + border-radius: 50%; + border: 2px solid #383838; + } + .menu-wrapper.layout-sidebar-active .layout-menu { + max-width: 230px; + } + .menu-wrapper.layout-sidebar-active .layout-menu > li { + min-width: 230px; + } + .menu-wrapper.layout-sidebar-active .layout-menu > li > ul > li { + margin-left: 10px; + margin-right: 12px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li a { + padding-left: 20px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li a { + padding-left: 30px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li a { + padding-left: 40px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li a { + padding-left: 50px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li > a > span { + visibility: visible; + white-space: normal; + } + .menu-wrapper.layout-sidebar-active .layout-menu li > a i.layout-submenu-toggler { + visibility: visible; + } + .menu-wrapper.layout-sidebar-active .layout-menu-container { + overflow: auto; + } +} +@media (max-width: 991px) { + .layout-wrapper .menu-wrapper { + top: 62px; + z-index: 1010; + -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); + transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); + transform: translate3d(-230px, 0px, 0px); + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + } + .layout-wrapper .menu-wrapper .sidebar-logo { + display: none; + } + .layout-wrapper .menu-wrapper .layout-menu-container .layout-menu { + max-width: 230px; + } + .layout-wrapper.layout-mobile-active { + overflow: hidden; + height: 100vh; + } + .layout-wrapper.layout-mobile-active .menu-wrapper { + transform: translate3d(0px, 0px, 0px); + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu { + max-width: 230px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu > li { + min-width: 230px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu > li > ul > li { + margin-left: 10px; + margin-right: 12px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li a { + padding-left: 20px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li a { + padding-left: 30px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li a { + padding-left: 40px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li a { + padding-left: 50px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li > a > span { + visibility: visible; + white-space: normal; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li > a i.layout-submenu-toggler { + visibility: visible; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu-container { + overflow: auto; + } + .layout-wrapper.layout-mobile-active .layout-mask { + display: block; + } + .layout-wrapper .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button { + display: block; + } +} +@media (min-width: 992px) { + .layout-wrapper.layout-horizontal .menu-wrapper { + top: 0px; + width: 100%; + height: 62px; + position: relative; + } + .layout-wrapper.layout-horizontal .menu-wrapper .sidebar-logo { + display: none; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container { + height: 100%; + display: flex; + align-items: center; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu { + list-style-type: none; + margin: 0px 16px; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: row; + flex-direction: row; + max-width: 100%; + overflow: visible; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu li.active-menuitem > a i.layout-submenu-toggler { + -webkit-transform: rotate(-180deg); + -moz-transform: rotate(-180deg); + -o-transform: rotate(-180deg); + -ms-transform: rotate(-180deg); + transform: rotate(-180deg); + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li { + padding: 0; + position: relative; + margin: 0 9px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li .layout-menu-tooltip { + display: none; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a { + margin: 0px; + padding: 10px 5px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a:before { + display: none; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a > span { + margin: 0 8px; + font-weight: 600; + font-size: 12px; + line-height: 14px; + visibility: visible; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a > i { + font-size: 14px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a > i.layout-submenu-toggler { + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; + margin-left: auto; + font-size: 12px; + visibility: visible; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.layout-root-menuitem > div { + display: none; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul { + display: none; + list-style-type: none; + top: 44px; + left: 0px; + width: 230px; + position: absolute; + padding: 10px; + margin: 0; + z-index: 100; + overflow: auto; + max-height: 460px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li { + border: 0 none; + margin: 0; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li a { + padding-left: 20px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li a { + padding-left: 30px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li a { + padding-left: 40px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li a { + padding-left: 50px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .layout-wrapper.layout-horizontal .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button-wrapper .menu-button { + display: none; + } + .layout-wrapper.layout-horizontal .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: block; + } + .layout-wrapper.layout-horizontal .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > .search-input-wrapper { + display: none; + } + .layout-wrapper.layout-horizontal .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: block; + padding: 0; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + } +} +@media (min-width: 992px) { + .layout-wrapper.layout-slim .menu-wrapper { + width: 62px; + overflow: visible; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container { + padding: 0; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu { + overflow: visible; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip { + display: none; + padding: 0 0.412px; + position: absolute; + left: 72px; + top: 16px; + line-height: 1; + border-radius: 2px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-text { + padding: 6px 8px; + font-weight: 500; + min-width: 75px; + white-space: nowrap; + text-align: center; + -webkit-box-shadow: 0 2px 10px 0 rgba(0, 3, 6, 0.16); + -moz-box-shadow: 0 2px 10px 0 rgba(0, 3, 6, 0.16); + box-shadow: 0 2px 10px 0 rgba(0, 3, 6, 0.16); + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-arrow { + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + top: 50%; + left: -4px; + margin-top: -5px; + border-width: 5px 5px 5px 0; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li { + position: relative; + padding: 10px 12px 10px 14px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a { + margin: 0px; + padding: 6px; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + position: relative; + border: none; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a:before { + display: none; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a span { + display: none; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a i { + margin-right: 0; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a i.layout-submenu-toggler { + display: none; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a .menuitem-badge { + display: none; + margin-left: auto; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a:hover + .layout-menu-tooltip { + display: block; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul { + position: absolute; + top: 0; + left: 62px; + min-width: 250px; + max-height: 450px; + display: none; + padding: 10px; + overflow: auto; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li { + margin: 0; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + padding: 10px 5px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a > span { + visibility: visible; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a > i.layout-submenu-toggler { + visibility: visible; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li a { + padding-left: 20px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li a { + padding-left: 30px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li a { + padding-left: 40px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li a { + padding-left: 50px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover + .layout-menu-tooltip { + display: none; + } + .layout-wrapper.layout-slim .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo { + display: none; + } + .layout-wrapper.layout-slim .layout-main { + padding-left: 62px; + } +} +.layout-menu-dark .menu-wrapper { + background-color: #293241; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #387fe9; + color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: #293241; +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: #293241; + color: #387fe9; + color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(233, 233, 233, 0.8); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #387fe9; + color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-light-color); +} +@media (min-width: 992px) { + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + color: #E9E9E9; + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #E9E9E9; + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-light-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + color: #E9E9E9; + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #E9E9E9; + } + .layout-menu-dark.layout-horizontal .menu-wrapper { + box-shadow: none; + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + color: var(--primary-light-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a i { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul { + background-color: #293241; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a:hover { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip { + background-color: #293241; + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-text { + color: #ffffff; + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-arrow { + border-right-color: #293241; + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a i { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul { + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + background-color: #293241; + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a:hover { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #387fe9; + color: var(--primary-light-color); + } +} +@media (max-width: 991px) { + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #387fe9; + color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + color: #E9E9E9; + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #E9E9E9; + } +} + +.layout-menu-light .menu-wrapper { + background-color: #ffffff; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #293241; +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #387fe9; + color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: #ffffff; +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: #ffffff; + color: #387fe9; + color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(41, 50, 65, 0.7); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #387fe9; + color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-color); +} +@media (min-width: 992px) { + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > a { + color: #293241; + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + color: #293241; + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #293241; + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #293241; + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + color: #293241; + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #293241; + } + .layout-menu-light.layout-horizontal .menu-wrapper { + box-shadow: none; + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #293241; + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + color: var(--primary-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a i { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul { + background-color: #ffffff; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a:hover { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip { + background-color: #293241; + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-text { + color: #ffffff; + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-arrow { + border-right-color: #293241; + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a i { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul { + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + background-color: #ffffff; + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a:hover { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #387fe9; + color: var(--primary-color); + } +} +@media (max-width: 991px) { + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #293241; + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #387fe9; + color: var(--primary-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #387fe9; + background-color: var(--primary-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(56, 127, 233, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + color: #293241; + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(56, 127, 233, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #293241; + } +} + +.layout-rightpanel { + position: fixed; + z-index: 1000; + right: 0; + top: 62px; + height: calc(100% - 62px); + padding: 0; + width: 418px; + overflow: auto; + background-color: #303A48; + transform: translate3d(418px, 0px, 0px); + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + backface-visibility: hidden; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); +} +.layout-rightpanel .rightpanel-wrapper { + padding: 22px 20px 40px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section { + padding: 16px 0; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section .section-header { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + margin-bottom: 16px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section .section-header > h6 { + margin: 0; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding: 14px 16px; + background-image: url("#{resource['demo:images/rightpanel/asset-weather.png']}"); + background-position: center; + background-repeat: no-repeat; + background-size: cover; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; + -webkit-box-shadow: 0px 10px 40 rgba(41, 50, 65, 0.06); + -moz-box-shadow: 0px 10px 40 rgba(41, 50, 65, 0.06); + box-shadow: 0px 10px 40 rgba(41, 50, 65, 0.06); + color: rgba(41, 50, 65, 0.8); +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather > img { + height: 60px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather .weather-info { + margin-left: 16px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather .weather-info h6 { + margin: 0 0 2px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather .weather-info h1 { + margin: 0; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul { + padding: 0; + margin: 0; + list-style: none; + overflow: auto; + max-height: 320px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li { + padding: 16px; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; + background-color: #293241; + margin-bottom: 12px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li .task-info h6 { + color: #FFFFFF; + margin: 0 0 4px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li .task-info > span { + display: block; + font-weight: 500; + font-size: 14px; + line-height: 140%; + color: #BFC2C6; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li.done { + opacity: 0.5; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li.done .task-info h6 { + text-decoration: line-through; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + flex-wrap: wrap; + margin: -7px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items .favorite-item { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + box-shadow: 0px 0px 1px rgba(41, 50, 65, 0.5), 0px 1px 1px rgba(41, 50, 65, 0.2); + width: 80px; + height: 80px; + background-color: #293241; + margin: 7px; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items .favorite-item:hover { + background-color: #3E4754; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items .add-item { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + width: 80px; + height: 80px; + margin: 7px; + border: 1px dashed #383838; + color: #383838; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items .add-item:hover { + background-color: #3E4754; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section { + margin-top: 40px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel { + height: 400px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat { + height: 400px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .fade { + background-image: linear-gradient(180deg, #303A48 0%, rgba(234, 237, 243, 0) 100%); +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content { + max-height: 400px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message { + background-color: #293241; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts { + max-height: 400px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li:hover { + background-color: #293241; +} + +.layout-wrapper.layout-rightpanel-active .layout-rightpanel { + transform: translate3d(0px, 0px, 0px); +} + +@media (max-width: 576px) { + .layout-rightpanel { + width: 100%; + transform: translate3d(100%, 0px, 0px); + } +} +.layout-footer { + padding: 30px 36px; +} +.layout-footer .footer-menutitle { + color: #BFC2C6; + font-weight: 600; + font-size: 12px; + line-height: 14px; + min-height: 15px; + display: block; + margin-bottom: 9px; +} +.layout-footer .footer-subtitle { + font-weight: 500; + font-size: 14px; + display: block; + color: #BFC2C6; +} +.layout-footer ul { + padding: 0; + margin: 0; + list-style: none; +} +.layout-footer ul > li { + padding: 7px 0; +} +.layout-footer ul > li > a { + color: #EAEBEC; + -moz-transition: color 0.2s; + -o-transition: color 0.2s; + -webkit-transition: color 0.2s; + transition: color 0.2s; +} +.layout-footer ul > li > a:hover { + color: #BFC2C6; +} +.layout-footer .newsletter-input { + margin-top: 16px; + background-color: #293241; + position: relative; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; +} +.layout-footer .newsletter-input > input { + width: 100%; + background-color: transparent; + border: none; + padding: 11px 16px; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + font-size: 14px; + line-height: 200%; +} +.layout-footer .newsletter-input > button { + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; + position: absolute; + right: 6px; + top: 50%; + margin-top: -16px; +} +.layout-footer .newsletter-input > button > span { + display: block; + padding: 0; + width: 100%; + font-weight: 600; + font-size: 14px; +} +.layout-footer .footer-bottom { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; +} +.layout-footer .footer-bottom h4 { + line-height: 22px; + margin: 0; + margin-right: 32px; +} +.layout-footer .footer-bottom h6 { + line-height: 17px; + margin: 0; + color: #BFC2C6; + font-weight: 500; +} + +/* Utils */ +.clearfix:after { + content: " "; + display: block; + clear: both; +} + +.card { + background: #293241; + padding: 20px; + box-sizing: border-box; + box-shadow: 0 10px 40px rgba(41, 50, 65, 0.06); + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + margin-bottom: 2rem; +} +.card:last-child { + margin-bottom: 0; +} +.card .card-header { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; + padding-bottom: 16px; +} +.card .card-header h6 { + margin-bottom: 2px; +} +.card .card-header .subtitle { + font-weight: 600; + color: #BFC2C6; +} +.card .card-subtitle { + color: #BFC2C6; + font-weight: 600; + margin: -1rem 0 1rem 0; +} +.card.no-gutter { + margin-bottom: 0; +} + +.sr-only { + border: 0; + clip: rect(1px, 1px, 1px, 1px); + clip-path: inset(50%); + height: 1px; + margin: -1px; + overflow: hidden; + padding: 0; + position: absolute; + width: 1px; + word-wrap: normal !important; +} + +.ui-text-secondary { + color: #BFC2C6; +} + +.layout-wrapper .layout-ajax-loader { + position: absolute; + right: 15px; + bottom: 70px; +} +.layout-wrapper .layout-ajax-loader .layout-ajax-loader-icon { + color: red; + font-size: 32px; +} + +.layout-dashboard .chart { + overflow: auto; + position: relative; +} +.layout-dashboard .mobile-teams { + display: none; +} + +@media (max-width: 1200px) { + .layout-dashboard .desktop-teams { + display: none; + } + .layout-dashboard .mobile-teams { + display: block; + } + .layout-dashboard .mobile-teams .team { + height: 100%; + flex-direction: column; + -ms-flex-pack: start; + justify-content: flex-start; + -ms-flex-align: start; + align-items: flex-start; + } + .layout-dashboard .mobile-teams .team .peoples { + margin: 12px -8px; + } +} +.overview-box { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; + padding-top: 24px; + height: 100%; + min-width: 200px; +} +.overview-box .overview-info > h6 { + margin: 0 0 2px; +} +.overview-box .overview-info > h1 { + margin: 0; +} +.overview-box > i { + font-size: 24px; +} +.overview-box.white { + background: #FFFFFF; + color: rgba(41, 50, 65, 0.8); +} +.overview-box.blue { + background: #69B7FF; + color: #FFFFFF; +} +.overview-box.gray { + background: rgba(41, 50, 65, 0.4); + color: #FFFFFF; +} +.overview-box.darkgray { + background: rgba(41, 50, 65, 0.8); + color: #FFFFFF; +} +.overview-box.orange { + background: linear-gradient(90deg, #FFB340 0%, #FFA740 100%); + color: #FFFFFF; +} + +.timeline { + padding-right: 4px; +} +.timeline > ul { + padding: 0; + margin: 0; + list-style: none; + max-height: 372px; + overflow: auto; + margin-bottom: 1em; +} +.timeline > ul > li { + display: -ms-flexbox; + display: flex; + margin-bottom: 16px; +} +.timeline > ul > li > i { + font-size: 8px; + margin-right: 10px; + margin-top: 4px; +} +.timeline > ul > li .event-content span { + display: block; + margin-bottom: 4px; + font-weight: 600; + font-size: 12px; + color: #BFC2C6; +} +.timeline > ul > li .event-content span.event-title { + color: #FFFFFF; +} +.timeline > ul > li .event-content span.time { + font-size: 10px; + font-weight: 400; + color: #BFC2C6; +} +.timeline > ul > li.blue > i { + color: #297FFF; +} +.timeline > ul > li.green > i { + color: #34B56F; +} +.timeline > ul > li.orange > i { + color: #FFA928; +} + +.device-status .content { + color: #BFC2C6; + line-height: 1.4; + margin-bottom: 20px; +} +.device-status .progress { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding: 10px 0; + color: #BFC2C6; +} +.device-status .progress > span { + min-width: 40px; +} +.device-status .progress .ui-progressbar { + width: 100%; + margin: 0 12px; + background: rgba(41, 127, 255, 0.2); + background: var(--primary-lighter-color); +} +.device-status .progress .ui-progressbar .ui-progressbar-value { + background: rgba(41, 127, 255, 0.2); + background: var(--primary-color); + opacity: 0.8; + border-radius: 24px; +} +.device-status .progress.active .ui-progressbar { + width: 100%; + margin: 0 12px; + background: rgba(41, 127, 255, 0.2); + background: var(--primary-lighter-color); +} +.device-status .progress.active .ui-progressbar .ui-progressbar-value { + background: linear-gradient(270deg, #42BBFF 0%, #6129FF 100%); + background: linear-gradient(270deg, var(--primary-lighter-color) 0%, var(--primary-color) 100%); + opacity: 0.8; +} +.device-status .device { + margin-bottom: 16px; +} +.device-status .device span { + color: #387fe9; + color: var(--primary-color); + font-size: 14px; + font-weight: 600; +} +.device-status .device span > span { + font-size: 8px; + font-weight: normal; +} +.device-status .device span.status { + font-size: 12px; + color: #BFC2C6; + margin-top: 4px; + display: block; +} + +.team { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; +} +.team .card-header { + padding: 0; + min-width: 70px; +} +.team .peoples { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + flex-wrap: wrap; +} +.team .peoples > img { + -moz-border-radius: 10px; + -webkit-border-radius: 10px; + border-radius: 10px; + margin: 8px 8px; + width: 32px; + height: 32px; +} +.team .peoples .no-picture { + cursor: pointer; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-border-radius: 10px; + -webkit-border-radius: 10px; + border-radius: 10px; + margin: 8px 8px; + width: 32px; + height: 32px; + background: rgba(41, 50, 65, 0.1); + color: #EAEBEC; + font-size: 12px; + -moz-transition: background 0.2s; + -o-transition: background 0.2s; + -webkit-transition: background 0.2s; + transition: background 0.2s; +} +.team .peoples .no-picture:hover { + background: rgba(41, 50, 65, 0.2); +} + +.map { + padding: 0; +} +.map > img { + width: 100%; + height: auto; + border-radius: 24px 24px 12px 12px; +} +.map .map-content { + padding: 50px 20px 28px; +} +.map .map-content h6 { + margin: 0 0 16px; +} +.map .map-content .city { + margin-bottom: 16px; +} +.map .map-content .city span { + color: #387fe9; + color: var(--primary-color); + font-size: 14px; + font-weight: 600; +} +.map .map-content .city span > span { + font-size: 8px; + font-weight: normal; +} +.map .map-content .city span.status { + font-size: 12px; + color: #BFC2C6; + margin-top: 4px; + display: block; +} + +.schedule > p { + color: #BFC2C6; +} +.schedule > ul { + list-style: none; + padding: 0; + margin: 0; +} +.schedule > ul > li { + background: #3E4754; + border-radius: 8px; + margin-bottom: 10px; + padding: 5px 16px 12px; +} +.schedule > ul > li .schedule-header { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; + -ms-flex-align: center; + align-items: center; +} +.schedule > ul > li .schedule-header h6 { + line-height: 24px; + margin: 0; +} +.schedule > ul > li .schedule-header span { + color: #BFC2C6; + font-weight: 600; + font-size: 10px; + line-height: 14px; +} +.schedule > ul > li > span { + margin-top: 4px; + color: #BFC2C6; + display: block; + font-size: 12px; + line-height: 14px; +} + +.statistics .statistic-item .item-title { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + margin-bottom: 4px; +} +.statistics .statistic-item .item-title span { + display: block; + margin-right: 12px; +} +.statistics .statistic-item .item-title h5 { + margin: 0; + font-weight: 700; +} +.statistics .statistic-item h6 { + margin: 0; + font-weight: 600; + color: #BFC2C6; +} + +.stocks ul { + list-style: none; + padding: 0; + margin: 0; +} +.stocks ul > li { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + background-color: #303A48; + padding: 0; + margin: 0 0 12px; + -moz-border-radius: 6px; + -webkit-border-radius: 6px; + border-radius: 6px; + overflow: hidden; +} +.stocks ul > li .stock-name { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + background-color: #374250; + padding: 18px 10px; + min-width: 70px; + margin-right: 4px; +} +.stocks ul > li .stock-name h6 { + margin: 0; + color: #EAEBEC; + line-height: 17px; + font-weight: 600; +} +.stocks ul > li > img { + margin: 0 4px; + height: 25px; +} +.stocks ul > li .stock-price { + padding: 0 10px; + color: #34B56F; + margin: 0 4px; +} +.stocks ul > li .stock-price h6 { + line-height: 17px; + font-weight: 600; + display: inline-block; +} +.stocks ul > li .stock-price i { + display: inline-block; +} +.stocks ul > li .stock-status { + margin-left: 4px; + padding: 0 20px; +} +.stocks ul > li .stock-status span { + display: block; + font-weight: 600; + font-size: 10px; + line-height: 12px; + color: #BFC2C6; +} +.stocks ul > li.down .stock-price { + color: #FF6E49; +} +.stocks ul > li.same .stock-price { + color: #FFA928; +} +.stocks > .ui-button { + width: 100%; + margin-top: 30px; +} + +.operations { + overflow: auto; + position: relative; +} +.operations .insights { + padding: 16px 15px; + background-color: rgba(41, 127, 255, 0.04); + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + margin: 12px 0 16px; +} +.operations .insights .insight-header { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + margin-bottom: 5px; +} +.operations .insights .insight-header h6 { + margin: 0 6px; +} +.operations .insights > ul { + list-style: none; + padding: 0; + margin: 0; +} +.operations .insights > ul > li { + margin: 8px 0; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + color: #BFC2C6; +} +.operations .insights > ul > li span { + font-weight: 600; +} +.operations .insights > ul > li span > span { + font-size: 8px; + line-height: 10px; + font-weight: normal; +} +.operations > button { + width: 100%; +} + +.notification { + padding: 30px 24px; + background-color: #293241; + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; +} +.notification > h6 { + margin: 0; + color: #EAEBEC; +} +.notification > h6 > a { + margin-left: 10px; +} +.notification > h6 > a i { + -webkit-transform: rotate(45deg); + -moz-transform: rotate(45deg); + -o-transform: rotate(45deg); + -ms-transform: rotate(45deg); + transform: rotate(45deg); +} + +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav { + background-color: transparent; + margin: 0 -10px; + border: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav:before { + display: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header { + padding: 9px 0 0; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + background-color: transparent; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + margin: 0 10px; + border: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header a { + position: relative; + width: 52px; + height: 52px; + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + background-color: #D0D6DD; + cursor: pointer; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + color: #387fe9; + color: var(--primary-color); + border: 0 none; + overflow: visible; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header a img { + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header a .ui-badge { + position: absolute; + bottom: -5px; + right: -5px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header.ui-state-active { + padding: 0 0 9px; + border: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header.ui-state-active a { + box-shadow: 0px 0px 1px rgba(41, 50, 65, 0.16), 0px 1px 2px rgba(41, 50, 65, 0.04), 0px 6px 12px rgba(41, 50, 65, 0.24); + border: 0 none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header.ui-state-active:before { + content: ""; + width: 12px; + height: 2px; + background: #387fe9; + background: var(--primary-color); + border-radius: 3px; + position: absolute; + bottom: -10px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header.ui-state-hover { + border: none; + padding: 0 0 9px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels { + background-color: transparent; + border: none; + padding: 16px 0 0; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel { + padding: 0; + height: 350px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat { + position: relative; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + height: 350px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .fade { + position: absolute; + top: 0; + left: 0; + display: block; + width: 100%; + height: 44px; + background-image: linear-gradient(180deg, #293241 0%, rgba(234, 237, 243, 0) 100%); +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content { + max-height: 400px; + overflow: auto; + padding: 30px 6px 12px; + flex: 1 1 auto; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message { + display: -ms-flexbox; + display: flex; + flex-direction: column; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .name { + display: block; + color: #BFC2C6; + font-weight: 600; + font-size: 10px; + line-height: 14px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message { + max-width: 250px; + padding: 8px 10px; + box-shadow: 0px 0px 1px rgba(41, 50, 65, 0.5), 0px 1px 1px rgba(41, 50, 65, 0.2); + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + background-color: #303A48; + margin-bottom: 8px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message p { + padding: 0; + margin: 0 0 2px; + color: #EAEBEC; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message span { + display: block; + font-weight: 600; + font-size: 10px; + line-height: 14px; + color: #BFC2C6; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message.send { + -ms-flex-align: end; + align-items: flex-end; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message.send .message span { + text-align: right; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content.no-message { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content.no-message h4 { + color: #BFC2C6; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts { + flex: 1 1 auto; + max-height: 400px; + overflow: auto; + padding: 0px 0 12px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul { + padding: 0; + margin: 0; + list-style: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + margin-bottom: 6px; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + cursor: pointer; + padding: 8px 10px; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li img { + margin-right: 12px; + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li h6 { + margin: 0 0 2px; + color: #EAEBEC; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li span { + display: block; + color: #BFC2C6; + font-weight: 600; + font-size: 10px; + line-height: 14px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li:hover { + background-color: #303A48; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-input { + margin-top: 30px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-input input { + width: 100%; + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + padding: 20px 19px; + background-color: #3E4754; + border: none; +} + +.image-card { + padding: 0; + position: relative; +} +.image-card > span { + position: absolute; + right: 20px; + top: 20px; +} +.image-card > img { + width: 100%; + height: auto; + border-radius: 24px 24px 12px 12px; +} +.image-card .image-content { + padding: 32px 20px 28px; +} +.image-card .image-content h6 { + margin: 0 0 8px; +} +.image-card .image-content > p { + color: #BFC2C6; +} +.image-card .image-content > button { + margin-top: 32px; + width: 100%; +} + +.login-body { + background: #FFFFFF; +} +.login-body .login-wrapper { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + flex-direction: column; + height: 100vh; +} +.login-body .login-wrapper .login-panel { + width: 30%; + height: 100%; + text-align: center; + padding: 40px 20px; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + flex: 1 1 100%; +} +.login-body .login-wrapper .login-panel .logo { + margin-bottom: 50px; +} +.login-body .login-wrapper .login-panel .logo img { + width: 45px; + height: 53px; +} +.login-body .login-wrapper .login-panel > a { + font-weight: 500; + font-size: 10px; + line-height: 12px; + color: rgba(41, 50, 65, 0.3); +} +.login-body .login-wrapper .login-panel > p { + font-weight: 500; + margin: 0; + color: rgba(41, 50, 65, 0.5); + margin-top: 40px; +} +.login-body .login-wrapper .login-panel > p > a { + color: #387fe9; + cursor: pointer; +} +.login-body .login-wrapper .login-panel > input { + width: 85%; + max-width: 247px; + margin-bottom: 10px; + background-color: #F6F7F7; + border: 1.2px solid #D4D6D9; + color: #515C66; + padding: 12px 10px; +} +.login-body .login-wrapper .login-panel > input::placeholder { + color: gba(41, 50, 65, 0.3); +} +.login-body .login-wrapper .login-panel > button { + width: 85%; + max-width: 247px; + margin-bottom: 10px; + padding: 0; +} +.login-body .login-wrapper .login-panel > button > span { + padding: 15px 20px; + display: block; + font-weight: 600; + font-size: 14px; + line-height: 16px; +} +.login-body .login-wrapper .login-footer { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding-bottom: 70px; +} +.login-body .login-wrapper .login-footer h4 { + line-height: 22px; + margin: 0; + margin-right: 32px; +} +.login-body .login-wrapper .login-footer h6 { + line-height: 17px; + margin: 0; + color: #BFC2C6; + font-weight: 500; +} + +@media (max-width: 992px) { + .login-body .login-wrapper .login-panel { + width: 100%; + } +} +.exception-body .exception-topbar { + height: 62px; + background-color: #293241; + box-shadow: 0 10px 40px 0 rgba(41, 50, 65, 0.06); + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding: 0 16px; +} +.exception-body .exception-topbar .layout-topbar-logo > img { + height: 15px; +} +.exception-body .exception-wrapper { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + -ms-flex-align: center; + align-items: center; + min-height: calc(100vh - 62px); +} +.exception-body .exception-wrapper .exception-content { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: center; + justify-content: center; + flex: 1 1 auto; +} +.exception-body .exception-wrapper .exception-content > span { + font-weight: normal; + font-size: 60px; + line-height: 73px; + text-align: center; + display: block; +} +.exception-body .exception-wrapper .exception-footer { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding-bottom: 70px; +} +.exception-body .exception-wrapper .exception-footer h4 { + line-height: 22px; + margin: 0; + margin-right: 32px; +} +.exception-body .exception-wrapper .exception-footer h6 { + line-height: 17px; + margin: 0; + color: #BFC2C6; + font-weight: 500; +} +.exception-body.notfound .exception-wrapper { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + -ms-flex-align: center; + align-items: center; + min-height: calc(100vh - 62px); +} +.exception-body.notfound .exception-wrapper .exception-content { + text-align: center; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: center; + justify-content: center; + -ms-flex-align: center; + align-items: center; + flex: 1 1 auto; +} +.exception-body.notfound .exception-wrapper .exception-content img { + width: 332px; + height: 271px; + margin-bottom: -150px; +} +.exception-body.notfound .exception-wrapper .exception-content > span { + font-size: 140px; + line-height: 171px; +} +.exception-body.notfound .exception-wrapper .exception-content > span.exception-subtitle { + font-weight: 500; + font-size: 14px; + line-height: 17px; + color: #BFC2C6; +} +.exception-body.notfound .exception-wrapper .exception-content > button { + padding: 0; + margin-top: 20px; + width: 155px; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; +} +.exception-body.notfound .exception-wrapper .exception-content > button > span { + padding: 18px; + font-weight: 600; +} + +@media (max-width: 991px) { + .exception-body .exception-wrapper { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + -ms-flex-align: center; + align-items: center; + min-height: calc(100vh - 62px); + } + .exception-body .exception-wrapper .exception-footer { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding-bottom: 20px; + } +} +.landing-body { + background-color: #E5E5E5; +} +.landing-body .landing-topbar { + height: 83px; + background-color: #FFFFFF; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + width: 100%; + z-index: 999; + padding: 20px 40px; + position: relative; +} +.landing-body .landing-topbar .landing-topbar-left { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; +} +.landing-body .landing-topbar .landing-topbar-left .logo { + margin-right: 40px; +} +.landing-body .landing-topbar .landing-topbar-left .logo img { + height: 16px; + width: auto; +} +.landing-body .landing-topbar .landing-topbar-left > ul { + list-style-type: none; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + margin: 0; + padding: 0; +} +.landing-body .landing-topbar .landing-topbar-left > ul > li #landing-menu-close { + display: none; +} +.landing-body .landing-topbar .landing-topbar-left > ul > li > a { + font-weight: 600; + font-size: 12px; + line-height: 14px; + color: rgba(41, 50, 65, 0.9); + padding: 14px 10px; + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + margin: 0 10px; + min-width: 100px; + -moz-transition: color 0.2s; + -o-transition: color 0.2s; + -webkit-transition: color 0.2s; + transition: color 0.2s; +} +.landing-body .landing-topbar .landing-topbar-left > ul > li > a:hover { + color: #387fe9; +} +.landing-body .landing-topbar .landing-topbar-right .second-menubutton { + margin-right: 20px; + font-weight: 600; + font-size: 12px; + line-height: 14px; + color: rgba(41, 50, 65, 0.9); + padding: 14px 10px; + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + min-width: 100px; + -moz-transition: color 0.2s; + -o-transition: color 0.2s; + -webkit-transition: color 0.2s; + transition: color 0.2s; +} +.landing-body .landing-topbar .landing-topbar-right .second-menubutton:hover { + color: #387fe9; +} +.landing-body .landing-topbar .landing-topbar-right .landing-button span { + font-weight: 600; + font-size: 12px; + line-height: 14px; +} +.landing-body .landing-topbar .landing-topbar-right #landing-menu-button { + display: none; + padding: 0 8px; + cursor: pointer; +} +.landing-body .landing-topbar .landing-topbar-right #landing-menu-button i { + font-size: 20px; +} +.landing-body .landing-button { + background: linear-gradient(108.43deg, #297FFF 12.5%, #7A0EE7 96.32%); + border: none; + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.landing-body .landing-button.ui-button { + padding: 0; +} +.landing-body .landing-button.ui-button > .ui-button-text { + padding: 14px 10px; + min-width: 121px; + font-weight: 600; + font-size: 16px; + line-height: 19px; + display: block; +} +.landing-body .landing-button > a .ui-button-text { + padding: 14px 10px; + min-width: 87px; + font-weight: 600; + font-size: 16px; + line-height: 19px; + display: block; +} +.landing-body .landing-button:hover { + background: linear-gradient(108.43deg, #2f79e7 12.5%, #781cd4 96.32%); +} +.landing-body .landing-banner { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + padding: 303px 30px 218px; + position: relative; + transform-style: inherit; + background: url("#{resource['freya-layout:images/pages/asset-landing-header.jpg']}"); + background-size: cover; + height: 80vh; +} +.landing-body .landing-banner .landing-banner-content { + text-align: center; + position: relative; +} +.landing-body .landing-banner .landing-banner-content .title { + display: block; + font-weight: 500; + font-size: 70px; + line-height: 84px; + color: #FFFFFF; +} +.landing-body .landing-banner .landing-banner-content h3 { + margin: 40px 0 30px; + color: #FFFFFF; + font-weight: 500; + line-height: 29px; +} +.landing-body .section-header { + text-align: center; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + flex-direction: column; +} +.landing-body .section-header .title { + display: block; + font-weight: 500; + font-size: 70px; + line-height: 84px; + color: rgba(41, 50, 65, 0.9); +} +.landing-body .section-header h3 { + margin: 15px 0 100px; + color: rgba(41, 50, 65, 0.9); + font-weight: 500; + line-height: 29px; + max-width: 800px; +} +.landing-body .landing-features { + background-color: #FFFFFF; + position: relative; + display: -ms-flexbox; + display: flex; + flex-wrap: wrap; + padding: 36px 6% 125px; +} +.landing-body .landing-features .lg\:col-3 { + transition: transform 250ms linear; + -webkit-transition: transform 250ms linear; +} +.landing-body .landing-features .feature { + display: -ms-flexbox; + display: flex; +} +.landing-body .landing-features .feature > span { + font-weight: 500; + font-size: 20px; + line-height: 20px; + color: rgba(41, 50, 65, 0.8); + margin-top: 30px; + margin-right: 12px; +} +.landing-body .landing-features .feature .feature-card { + -moz-border-radius: 36px; + -webkit-border-radius: 36px; + border-radius: 36px; + padding: 28px 30px; + display: -ms-flexbox; + display: flex; + width: 100%; +} +.landing-body .landing-features .feature .feature-card > span { + display: none; +} +.landing-body .landing-features .feature .feature-card h3 { + font-weight: 500; + line-height: 36px; + margin: 0 0 20px; + color: rgba(41, 50, 65, 0.8); +} +.landing-body .landing-features .feature .feature-card h5 { + margin: 0; + font-weight: normal; + line-height: 150%; + color: rgba(41, 50, 65, 0.9); + opacity: 0.8; +} +.landing-body .landing-features .feature.yellow .feature-card { + padding-bottom: 128px; + background: linear-gradient(197.55deg, #FFD37D -1.02%, #FFDB7D 46.53%); +} +.landing-body .landing-features .feature.blue .feature-card { + padding-bottom: 67px; + background: linear-gradient(156.18deg, #DAF4FF 38.02%, #CEDFFF 95.69%); +} +.landing-body .landing-features .feature.darker-blue .feature-card { + padding-bottom: 164px; + background: linear-gradient(165.84deg, #C1E9FF 42.24%, rgba(219, 242, 255, 0.23) 97.17%); +} +.landing-body .landing-features .feature.darker-gray .feature-card { + padding-bottom: 109px; + background: linear-gradient(176.91deg, rgba(41, 50, 65, 0.6) 50%, rgba(41, 50, 65, 0.282) 115.03%); +} +.landing-body .landing-features .feature.darker-gray .feature-card h3 { + color: #FFFFFF; +} +.landing-body .landing-features .feature.darker-gray .feature-card h5 { + color: #FFFFFF; + opacity: 0.8; +} +.landing-body .landing-features .feature.gray .feature-card { + padding-bottom: 50px; + background: linear-gradient(11.49deg, rgba(41, 50, 65, 0.1) 60.37%, rgba(41, 50, 65, 0.026) 98.03%); +} +.landing-body .landing-pricing { + background-color: #FFFFFF; + position: relative; + padding: 125px 15% 260px; + text-align: center; +} +.landing-body .landing-pricing .pricing-card { + background: #FFFFFF; + box-shadow: 0px 0px 1px rgba(41, 50, 65, 0.5), 0px 1px 1px rgba(41, 50, 65, 0.2); + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + padding: 30px 20px 33px; + text-align: center; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + flex-direction: column; + position: relative; + margin-bottom: 60px; +} +.landing-body .landing-pricing .pricing-card .preferred-tag { + padding: 14px 24px; + background: linear-gradient(112.58deg, #FFD029 22.19%, #F1AF60 100%); + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + transform: rotate(-7.18deg); + position: absolute; + top: -32px; + color: #FFFFFF; + font-weight: bold; + font-size: 20px; + line-height: 24px; +} +.landing-body .landing-pricing .pricing-card h2 { + margin: 0 0 14px; + color: rgba(41, 50, 65, 0.9); +} +.landing-body .landing-pricing .pricing-card .price { + display: block; + color: #2170E7; + font-weight: bold; + font-size: 80px; + line-height: 95px; +} +.landing-body .landing-pricing .pricing-card .time { + color: rgba(41, 50, 65, 0.5); + font-size: 12px; + line-height: 14px; + display: block; + margin-bottom: 32px; +} +.landing-body .landing-pricing .pricing-card > ul { + padding: 42px 0 0; + width: 100%; + margin: 0; + list-style: none; + border-top: 1px solid rgba(41, 50, 65, 0.1); +} +.landing-body .landing-pricing .pricing-card > ul > li { + font-size: 16px; + line-height: 205.34%; + color: rgba(41, 50, 65, 0.5); +} +.landing-body .landing-pricing .pricing-card.pro { + background: linear-gradient(333.31deg, #EFF3FB 6.36%, #FFFFFF 72.79%); +} +.landing-body .landing-pricing .pricing-card.enterprise { + background: linear-gradient(156.19deg, rgba(41, 50, 65, 0.8) 10.28%, rgba(35, 40, 49, 0.496) 87.74%); +} +.landing-body .landing-pricing .pricing-card.enterprise h2 { + margin: 0 0 14px; + color: #FFFFFF; +} +.landing-body .landing-pricing .pricing-card.enterprise .price { + color: #FFFFFF; +} +.landing-body .landing-pricing .pricing-card.enterprise .time { + color: #FFFFFF; + opacity: 0.6; +} +.landing-body .landing-pricing .pricing-card.enterprise > ul { + border-top: 1px solid rgba(255, 255, 255, 0.2); +} +.landing-body .landing-pricing .pricing-card.enterprise > ul > li { + color: #FFFFFF; +} +.landing-body .landing-pricing > a { + font-size: 24px; + line-height: 29px; + display: block; +} +.landing-body .layout-footer { + background-color: #FFFFFF; + position: relative; +} +.landing-body .layout-footer .footer-menutitle { + color: rgba(41, 50, 65, 0.2); +} +.landing-body .layout-footer .footer-subtitle { + color: rgba(41, 50, 65, 0.3); +} +.landing-body .layout-footer ul > li { + color: rgba(41, 50, 65, 0.5); +} +.landing-body .layout-footer ul > li > a { + color: rgba(41, 50, 65, 0.5); +} +.landing-body .layout-footer ul > li > a:hover { + color: rgba(41, 50, 65, 0.3); +} +.landing-body .layout-footer .newsletter-input { + background-color: rgba(41, 50, 65, 0.04); +} +.landing-body .layout-footer .footer-bottom { + color: rgba(41, 50, 65, 0.7); +} +.landing-body .layout-footer .footer-bottom h6 { + color: rgba(41, 50, 65, 0.5); +} +.landing-body .landing-mask { + display: none; + width: 100%; + height: 100vh; + position: fixed; + top: 0; + left: 0; + background-color: rgba(0, 0, 0, 0.2); + z-index: 998; +} + +@media (max-width: 991px) { + .landing-body.block-scroll { + overflow: hidden; + } + .landing-body.block-scroll .landing-wrapper .landing-mask { + display: block; + } + .landing-body .landing-wrapper.landing-menu-active .landing-topbar .landing-menu { + transform: translate3d(0px, 0px, 0px); + } + .landing-body .landing-wrapper .landing-topbar { + padding: 0 13px; + } + .landing-body .landing-wrapper .landing-topbar .landing-menu { + position: fixed; + flex-direction: column; + -ms-flex-align: end; + align-items: flex-end; + right: 0; + top: 0; + padding: 28px 15px; + z-index: 999; + width: 220px; + height: 100%; + background-color: #EEF5FF; + box-shadow: 0 24px 64px -2px rgba(0, 0, 0, 0.02), 0 6px 16px -2px rgba(0, 0, 0, 0.06), 0 2px 6px -2px rgba(0, 0, 0, 0.08); + transform: translate3d(260px, 0px, 0px); + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li { + margin: 0; + width: 100%; + margin-bottom: 12px; + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li > a { + padding: 6px 16px; + font-size: 14px; + text-align: right; + background-color: #EEF5FF; + display: block; + color: rgba(41, 50, 65, 0.9); + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li > a:hover { + color: rgba(41, 50, 65, 0.6); + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li #landing-menu-close { + display: block; + font-size: 20px; + text-align: right; + color: rgba(41, 50, 65, 0.9); + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li #landing-menu-close:hover { + color: rgba(41, 50, 65, 0.6); + } + .landing-body .landing-wrapper .landing-topbar #landing-menu-button { + display: block; + color: rgba(41, 50, 65, 0.9); + font-size: 20px; + } + .landing-body .landing-wrapper .landing-topbar .landing-topbar-right { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + } + .landing-body .landing-wrapper .landing-topbar .landing-topbar-right .second-menubutton { + display: none; + } + .landing-body .landing-wrapper .landing-topbar .landing-topbar-right .landing-button { + margin-right: 20px; + } + .landing-body .landing-wrapper .landing-banner { + background-position: top; + padding: 80px 23px; + -ms-flex-pack: start; + justify-content: flex-start; + height: auto; + top: auto !important; + } + .landing-body .landing-wrapper .landing-banner .landing-banner-content { + text-align: left; + max-width: 262px; + top: auto !important; + } + .landing-body .landing-wrapper .landing-banner .landing-banner-content > span { + font-size: 60px; + line-height: 91.84%; + } + .landing-body .landing-wrapper .landing-banner .landing-banner-content > h3 { + font-size: 18px; + line-height: 130%; + } + .landing-body .landing-wrapper .landing-features { + padding: 36px 20px 30px; + } + .landing-body .landing-wrapper .landing-features .lg\:col-3 { + transform: translateY(0) !important; + margin-top: auto !important; + } + .landing-body .landing-wrapper .landing-features .feature-empty { + display: none; + } + .landing-body .landing-wrapper .landing-features .feature-3 { + margin-top: auto; + } + .landing-body .landing-wrapper .landing-features .feature-4 { + margin-top: auto; + } + .landing-body .landing-wrapper .landing-features .feature > span { + display: none; + } + .landing-body .landing-wrapper .landing-features .feature .feature-card { + padding-bottom: 28px !important; + } + .landing-body .landing-wrapper .landing-features .feature .feature-card > span { + font-weight: 500; + font-size: 20px; + line-height: 20px; + color: rgba(41, 50, 65, 0.8); + margin-right: 12px; + margin-top: 8px; + display: block; + } + .landing-body .landing-wrapper .landing-features .feature.blue .feature-card { + flex-direction: row-reverse; + text-align: right; + } + .landing-body .landing-wrapper .landing-features .feature.blue .feature-card > span { + margin-right: 0px; + margin-left: 12px; + } + .landing-body .landing-wrapper .landing-features .feature.darker-gray .feature-card { + flex-direction: row-reverse; + text-align: right; + } + .landing-body .landing-wrapper .landing-features .feature.darker-gray .feature-card > span { + color: #FFFFFF; + float: right; + margin-right: 0px; + margin-left: 12px; + } + .landing-body .landing-wrapper .section-header .title { + font-size: 60px; + line-height: 72px; + } + .landing-body .landing-wrapper .section-header h3 { + font-size: 18px; + line-height: 130%; + } + .landing-body .landing-wrapper .landing-pricing { + padding: 30px 20px 97px; + } + .landing-body .landing-wrapper .landing-pricing .pricing-card { + margin-bottom: 20px; + } + .landing-body .landing-wrapper .landing-pricing .pricing-card > ul { + display: none; + } + .landing-body .landing-wrapper .landing-pricing .preferred { + order: -1 !important; + } + .landing-body .landing-wrapper .landing-pricing .preferred .pricing-card > ul { + display: block; + } +} +.help-page p { + margin: 0; +} +.help-page .help-search { + background-image: url("#{resource['freya-layout:images/pages/search.png']}"); + padding: 0; + text-align: center; +} +.help-page .help-search .help-search-content { + padding: 5rem 12rem; +} +.help-page .help-search .help-search-content h3 { + color: #EAEBEC; + font-weight: 500; +} +.help-page .help-search .search-container { + font-size: 1rem; + padding: 1rem; + position: relative; +} +.help-page .help-search .search-container input { + appearance: none; + font-size: 1rem; + text-indent: 2rem; + padding: 1rem; + width: 100%; +} +.help-page .help-search .search-container i { + width: 1rem; + position: absolute; + margin-left: 1rem; + top: 50%; + margin-top: -0.5rem; +} +.help-page .status-bars { + margin-top: 1rem; + display: -ms-flexbox; + display: flex; +} +.help-page .status-bars .status-bar { + flex: 1 1 0; + -ms-flex: 1 1 0px; + background: #6EC180; + height: 50px; + margin-right: 0.25rem; + transition: transform 0.2s; +} +.help-page .status-bars .status-bar:last-child { + margin-right: 0; +} +.help-page .status-bars .status-bar.status-bar-failure { + background: #FF6E49; +} +.help-page .status-bars .status-bar:hover { + transform: scale(1.1); +} +.help-page .status-bar-footer { + padding: 1rem 0 0 0; + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; +} +.help-page .blog-post { + border-radius: 4px; + padding: 20px; + margin: 3rem 2rem; + border: 1px solid #383838; + background-color: #293241; + position: relative; + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; +} +.help-page .blog-post:last-child { + margin-bottom: 1rem; +} +.help-page .blog-post img { + width: 100%; + position: absolute; + left: 0; + top: 0; +} +.help-page .blog-post .blog-text h1 { + color: #EAEBEC; + margin-bottom: 1rem; + font-weight: 500; +} +.help-page .blog-post .blog-text span { + color: #BFC2C6; + line-height: 1.4; +} +.help-page .blog-post .blog-profile { + position: absolute; + top: -25px; + left: -25px; +} +.help-page .blog-post .blog-profile img { + width: 50px; + height: 50px; + border-radius: 50%; +} + +@media screen and (max-width: 991px) { + .help-page .help-search .help-search-content { + padding: 6rem 2rem; + } +} +.invoice { + padding: 2rem; +} +.invoice .invoice-header { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; +} +.invoice .invoice-company .logo-image { + height: 50px; + margin-bottom: 0.5rem; +} +.invoice .invoice-company div { + margin-bottom: 0.5rem; +} +.invoice .invoice-company .company-name { + font-weight: 500; + font-size: 1.5rem; +} +.invoice .invoice-title { + font-size: 2rem; + margin-bottom: 2rem; + text-align: right; + font-weight: 300; +} +.invoice .invoice-details { + width: 15rem; + display: -ms-flexbox; + display: flex; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} +.invoice .invoice-details > div { + width: 50%; + margin-bottom: 0.5rem; +} +.invoice .invoice-details .invoice-label { + text-align: left; + font-weight: 500; +} +.invoice .invoice-details .invoice-value { + text-align: right; +} +.invoice .invoice-to { + margin-top: 1.5rem; + padding-top: 2rem; + border-top: 1px solid #3E4754; +} +.invoice .invoice-to .bill-to { + font-size: 1.25rem; + font-weight: 500; + margin-bottom: 0.5rem; +} +.invoice .invoice-to .invoice-to-info div { + margin-bottom: 0.5rem; +} +.invoice .invoice-items { + margin-top: 2rem; + padding-top: 2rem; +} +.invoice .invoice-items table { + width: 100%; + border-collapse: collapse; +} +.invoice .invoice-items table tr { + border-bottom: 1px solid #3E4754; +} +.invoice .invoice-items table th { + font-weight: 500; +} +.invoice .invoice-items table th, .invoice .invoice-items table td { + padding: 1rem; + text-align: right; +} +.invoice .invoice-items table th:first-child, .invoice .invoice-items table td:first-child { + text-align: left; +} +.invoice .invoice-summary { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; + margin-top: 2.5rem; + padding-top: 2.5rem; +} +.invoice .invoice-summary .invoice-value { + font-weight: 500; +} + +@media print { + body * { + visibility: hidden; + } + + #invoice-content * { + visibility: visible; + } + + #invoice-content { + width: 100%; + position: absolute; + left: 0; + top: 0; + padding: 0; + margin: 0; + background: #ffffff; + color: rgba(41, 50, 65, 0.8); + } + + .invoice .invoice-to { + border-top: 1px solid #F2F4F6; + } + .invoice .invoice-items table tr { + border-bottom: 1px solid #F2F4F6; + } +} +.layout-config { + width: 16rem; + height: 100%; + position: fixed; + right: 0; + top: 0; + padding: 1rem; + overflow: auto; + background: #1e1e1e; + z-index: 999; + border-left: 1px solid #383838; + transform: translateX(100%); + transition: transform 0.2s cubic-bezier(0.05, 0.74, 0.2, 0.99); +} +.layout-config.layout-config-active { + transform: translateX(0); + box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); +} +.layout-config.layout-config-active .layout-config-content .layout-config-button i { + transform: rotate(360deg); +} +.layout-config .ui-selectoneradio td { + padding: 0.5rem; +} +.layout-config p { + line-height: 1.5rem; + color: rgba(255, 255, 255, 0.6); +} +.layout-config .layout-themes { + display: -ms-flexbox; + display: flex; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} +.layout-config .layout-themes > div { + padding: 0.25rem; +} +.layout-config .layout-themes a { + width: 2rem; + height: 2rem; + border-radius: 24px; + display: block; + position: relative; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + transition: transform 0.2s; + box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); +} +.layout-config .layout-themes a i { + font-size: 1rem; + position: absolute; + top: 50%; + left: 50%; + margin-left: -0.5rem; + margin-top: -0.5rem; +} +.layout-config .layout-themes a:hover { + transform: scale(1.1); +} + +.layout-config-button { + display: block; + position: fixed; + width: 3rem; + height: 3rem; + line-height: 3rem; + background: #90CAF9; + color: #121212; + text-align: center; + top: 50%; + right: 0; + margin-top: -1.5rem; + border-top-left-radius: 24px; + border-bottom-left-radius: 24px; + transition: background-color 0.2s; + overflow: hidden; + cursor: pointer; + z-index: 999; + box-shadow: -0.25rem 0 1rem rgba(0, 0, 0, 0.15); +} +.layout-config-button i { + font-size: 2rem; + line-height: inherit; + transform: rotate(0deg); + transition: transform 1s; +} +.layout-config-button:hover { + background: #a8d6fa; +} + +/* Add your customizations of the layout styles here */ +.layout-wrapper .layout-rightpanel .rightpanel-wrapper { + position: relative; + height: 100%; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-header { + text-align: center; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-header .profile { + padding: 12px; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-actions { + padding: 12px 6px 36px; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-actions .actions .action-buttons .col-6, .layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-actions .actions .action-buttons .md\:col-4 { + padding: 0.2em; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav { + background-color: #384454; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav li.ui-tabs-header { + padding: 1rem; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav li.ui-tabs-header a { + font-size: 12px; + font-weight: 500; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav li.ui-tabs-header > span { + font-size: 10px; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active { + background-color: #303A48; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-panels { + background-color: #384454; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-panels .ui-tabs-panel { + padding: 0; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message { + width: 80%; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-panels .ui-tabs-panel .chat .chat-input input { + width: 105px; + margin-right: 7px; +} diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-dark.scss b/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-dark.scss new file mode 100644 index 0000000..1a4faa1 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-dark.scss @@ -0,0 +1,5 @@ +$primaryColor:lighten(#2170E7, 5%); +$primaryTextColor:#ffffff; + +@import '../../sass/variables/layout/_layout_dark'; +@import '../../sass/layout/_layout'; \ No newline at end of file diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-light.css b/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-light.css new file mode 100644 index 0000000..258f85f --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-light.css @@ -0,0 +1,4257 @@ +/* Add your customizations of the layout variables here */ +@-webkit-keyframes fadeInDown { + from { + opacity: 0; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } + to { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} +@keyframes fadeInDown { + from { + opacity: 0; + transform: translate3d(0, -20px, 0); + } + to { + opacity: 1; + transform: none; + } +} +@-webkit-keyframes fadeOutUp { + from { + opacity: 1; + } + to { + opacity: 0; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } +} +@keyframes fadeOutUp { + from { + opacity: 1; + } + to { + opacity: 0; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } +} +@keyframes fadeinmask { + from { + opacity: 0; + } + to { + opacity: 0.8; + } +} +.fadeInDown { + -webkit-animation-name: fadeInDown; + animation-name: fadeInDown; +} + +.fadeOutUp { + -webkit-animation-name: fadeOutUp; + animation-name: fadeOutUp; +} + +@-webkit-keyframes modal-in { + from { + background-color: transparent; + } + to { + background-color: rgba(0, 0, 0, 0.6); + } +} +@keyframes modal-in { + from { + background-color: transparent; + } + to { + background-color: rgba(0, 0, 0, 0.6); + } +} +.modal-in { + -webkit-animation-name: modal-in; + animation-name: modal-in; +} + +h1, h2, h3, h4, h5, h6 { + margin: 1.5rem 0 1rem 0; + font-family: inherit; + font-weight: 600; + line-height: 1.2; + color: inherit; +} +h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { + margin-top: 0; +} + +h1 { + font-size: 2.5rem; +} + +h2 { + font-size: 2rem; +} + +h3 { + font-size: 1.75rem; +} + +h4 { + font-size: 1.5rem; +} + +h5 { + font-size: 1.25rem; +} + +h6 { + font-size: 1rem; +} + +mark { + background: #FFF8E1; + padding: 0.25rem 0.4rem; + border-radius: 24px; + font-family: monospace; +} + +blockquote { + margin: 1rem 0; + padding: 0 2rem; + border-left: 4px solid #90A4AE; +} + +hr { + border-top: solid #dee2e6; + border-width: 1px 0 0 0; + margin: 1rem 0; +} + +p { + margin: 0 0 1rem 0; + line-height: 1.5; +} +p:last-child { + margin-bottom: 0; +} + +html { + height: 100%; + font-size: 14px; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + font-size: 14px; + font-weight: 400; + color: rgba(41, 50, 65, 0.8); + padding: 0; + margin: 0; + min-height: 100%; + background-color: #F2F4F6; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} +body.blocked-scroll { + overflow: auto; +} + +a { + text-decoration: none; + color: #4f8eec; + color: var(--primary-color); +} + +.ajax-loader { + font-size: 32px; + color: #2170E7; + color: var(--primary-color); +} + +.layout-main { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + min-height: 100vh; + padding-top: 82px; + -moz-transition: padding-left 0.2s; + -o-transition: padding-left 0.2s; + -webkit-transition: padding-left 0.2s; + transition: padding-left 0.2s; +} + +.layout-mask { + display: none; + position: fixed; + top: 0; + left: 0; + z-index: 998; + width: 100%; + height: 100%; + animation-duration: 0.2s; + animation-timing-function: cubic-bezier(0.05, 0.74, 0.2, 0.99); + animation-fill-mode: forwards; +} + +.layout-content { + padding: 30px 36px; + flex: 1 1 auto; +} + +@media (max-width: 991px) { + .layout-content { + padding: 32px 14px; + } +} +.layout-topbar-light .layout-topbar { + position: fixed; + top: 0; + z-index: 999; + width: 100%; + -moz-transition: width 0.2s; + -o-transition: width 0.2s; + -webkit-transition: width 0.2s; + transition: width 0.2s; + height: 62px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper { + height: 100%; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left { + height: 100%; + padding: 0 16px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + z-index: 999; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo { + height: 15px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo > img { + height: 15px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button { + padding: 6px; + margin-right: 16px; + border-radius: 4px; + display: none; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button i { + font-size: 18px; + width: 18px; + height: 18px; + background-color: transparent; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right { + height: 100%; + flex-grow: 1; + padding: 0 16px 0 12px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + border-right: solid 1px transparent; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: end; + justify-content: flex-end; + flex-grow: 1; + list-style-type: none; + margin: 0; + padding: 0; + height: 100%; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li { + position: relative; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + height: 100%; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a { + width: 100%; + padding: 6px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a > .topbar-icon { + font-size: 18px; + border-radius: 6px; + width: 30px; + height: 30px; + background-color: transparent; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a.layout-rightpanel-button i { + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + display: none; + position: absolute; + top: 62px; + right: 0px; + list-style-type: none; + margin: 0; + padding: 7px 0 8px; + z-index: 1000; + -moz-border-radius-bottomleft: 2px; + -webkit-border-bottom-left-radius: 2px; + border-bottom-left-radius: 2px; + -moz-border-radius-bottomright: 2px; + -webkit-border-bottom-right-radius: 2px; + border-bottom-right-radius: 2px; + min-width: 250px; + animation-duration: 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .angle-icon { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: end; + justify-content: flex-end; + flex-grow: 1; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li { + padding: 10px 15px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + cursor: pointer; + list-style: none; + margin-bottom: 4px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + font-weight: 600; + font-size: 12px; + line-height: 14px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a i { + margin-right: 10px; + padding: 6px; + border-radius: 2px; + width: 26px; + height: 26px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a img { + height: 36px; + width: 36px; + margin-right: 10px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item a { + width: auto; + display: block; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper { + position: relative; + width: 0; + opacity: 0; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper .ui-inputfield { + background: #F7FAFF; + width: 100%; + position: relative; + padding: 9px; + padding-left: 37px; + border: none; + color: #3E4754; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper i { + position: absolute; + left: 9px; + font-size: 18px; + top: 50%; + margin-top: -9px; + display: none; + z-index: 1; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.user-profile > a { + margin-left: 16px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.user-profile > a > img { + height: 28px; + width: 28px; + border-radius: 10px; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: none; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item .search-input-wrapper { + width: 200px; + opacity: 1; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item .search-input-wrapper i { + display: block; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: none; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem > ul { + display: block; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button { + font-size: 18px; + border-radius: 6px; + width: 30px; + height: 30px; + margin-left: 26px; + z-index: 1; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +@media (max-width: 991px) { + .layout-topbar-light .layout-topbar .layout-topbar-wrapper { + -ms-flex-align: start; + align-items: flex-start; + position: relative; + padding: 0 6px; + } +} +@media (max-width: 576px) { + .layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: block; + } + .layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > .search-input-wrapper { + display: none; + } + .layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: block; + padding: 0; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + } + .layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + left: 10px; + right: 10px; + position: fixed; + top: 62px; + } +} +.layout-topbar-light .layout-topbar { + background-color: #ffffff; + box-shadow: 0 10px 40px 0 rgba(41, 50, 65, 0.06); +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button > i { + color: #293241; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button:hover { + background-color: #E8EDF0; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a > .topbar-icon { + color: #293241; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a:hover i { + background-color: #E8EDF0; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper input { + background-color: #f8fafc; + border: 1px solid #ebedef; + color: #4f8eec; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper input::placeholder { + color: #4f8eec; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper i { + color: #293241; + opacity: 0.5; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + box-shadow: 0 2px 8px 0 rgba(25, 26, 28, 0.12); + background-color: white; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header { + background-color: #4688eb; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header h6 { + color: #ffffff; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header:hover { + background-color: #4688eb; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a { + color: rgba(41, 50, 65, 0.8); +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a i { + background-color: rgba(33, 112, 231, 0.8); + color: #ffffff; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a .notification-detail { + color: rgba(41, 50, 65, 0.5); +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li .menu-text p { + color: rgba(41, 50, 65, 0.8); +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li .menu-text span { + color: rgba(41, 50, 65, 0.5); +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li:hover { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button { + color: #293241; + background-color: transparent; +} +.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button:hover { + background-color: #E8EDF0; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} + +.layout-topbar-dark .layout-topbar { + position: fixed; + top: 0; + z-index: 999; + width: 100%; + -moz-transition: width 0.2s; + -o-transition: width 0.2s; + -webkit-transition: width 0.2s; + transition: width 0.2s; + height: 62px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper { + height: 100%; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left { + height: 100%; + padding: 0 16px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + z-index: 999; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo { + height: 15px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo > img { + height: 15px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button { + padding: 6px; + margin-right: 16px; + border-radius: 4px; + display: none; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button i { + font-size: 18px; + width: 18px; + height: 18px; + background-color: transparent; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right { + height: 100%; + flex-grow: 1; + padding: 0 16px 0 12px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + border-right: solid 1px transparent; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: end; + justify-content: flex-end; + flex-grow: 1; + list-style-type: none; + margin: 0; + padding: 0; + height: 100%; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li { + position: relative; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + height: 100%; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a { + width: 100%; + padding: 6px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a > .topbar-icon { + font-size: 18px; + border-radius: 6px; + width: 30px; + height: 30px; + background-color: transparent; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a.layout-rightpanel-button i { + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + display: none; + position: absolute; + top: 62px; + right: 0px; + list-style-type: none; + margin: 0; + padding: 7px 0 8px; + z-index: 1000; + -moz-border-radius-bottomleft: 2px; + -webkit-border-bottom-left-radius: 2px; + border-bottom-left-radius: 2px; + -moz-border-radius-bottomright: 2px; + -webkit-border-bottom-right-radius: 2px; + border-bottom-right-radius: 2px; + min-width: 250px; + animation-duration: 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .angle-icon { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: end; + justify-content: flex-end; + flex-grow: 1; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li { + padding: 10px 15px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + cursor: pointer; + list-style: none; + margin-bottom: 4px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + font-weight: 600; + font-size: 12px; + line-height: 14px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a i { + margin-right: 10px; + padding: 6px; + border-radius: 2px; + width: 26px; + height: 26px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a img { + height: 36px; + width: 36px; + margin-right: 10px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item a { + width: auto; + display: block; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper { + position: relative; + width: 0; + opacity: 0; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper .ui-inputfield { + background: #F7FAFF; + width: 100%; + position: relative; + padding: 9px; + padding-left: 37px; + border: none; + color: #3E4754; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item .search-input-wrapper i { + position: absolute; + left: 9px; + font-size: 18px; + top: 50%; + margin-top: -9px; + display: none; + z-index: 1; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.user-profile > a { + margin-left: 16px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.user-profile > a > img { + height: 28px; + width: 28px; + border-radius: 10px; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: none; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item .search-input-wrapper { + width: 200px; + opacity: 1; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item .search-input-wrapper i { + display: block; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: none; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem > ul { + display: block; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button { + font-size: 18px; + border-radius: 6px; + width: 30px; + height: 30px; + margin-left: 26px; + z-index: 1; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +@media (max-width: 991px) { + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper { + -ms-flex-align: start; + align-items: flex-start; + position: relative; + padding: 0 6px; + } +} +@media (max-width: 576px) { + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: block; + } + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > .search-input-wrapper { + display: none; + } + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: block; + padding: 0; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + } + .layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + left: 10px; + right: 10px; + position: fixed; + top: 62px; + } +} +.layout-topbar-dark .layout-topbar { + background-color: #293241; + box-shadow: none; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button > i { + color: #E9E9E9; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button:hover { + background-color: #333e51; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a > .topbar-icon { + color: #E9E9E9; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > a:hover i { + background-color: #333e51; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper input { + background-color: #333e51; + border: 1px solid #333e51; + color: #7dabf1; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper input::placeholder { + color: #7dabf1; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.search-item > form > .search-input-wrapper i { + color: #E9E9E9; + opacity: 0.5; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul { + box-shadow: 0 2px 8px 0 rgba(25, 26, 28, 0.12); + background-color: #333e51; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header { + background-color: #4688eb; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header h6 { + color: #ffffff; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul .layout-submenu-header:hover { + background-color: #4688eb; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a { + color: #E9E9E9; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a i { + background-color: rgba(33, 112, 231, 0.8); + color: #ffffff; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li > a .notification-detail { + color: #C2C2C2; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li .menu-text p { + color: #E9E9E9; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li .menu-text span { + color: #C2C2C2; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li > ul > li:hover { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button { + color: #E9E9E9; + background-color: transparent; +} +.layout-topbar-dark .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-rightpanel-button:hover { + background-color: #333e51; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} + +.menu-wrapper { + height: 100%; + position: fixed; + top: 0; + z-index: 999; + left: 0; +} +.menu-wrapper .sidebar-logo { + height: 62px; + display: -ms-flexbox; + display: flex; + -ms-flex-pack: start; + justify-content: flex-start; + -ms-flex-align: center; + align-items: center; + padding: 0 22px; + padding-right: 20px; +} +.menu-wrapper .sidebar-logo .sidebar-pin { + display: none; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.menu-wrapper .sidebar-logo .sidebar-pin > span { + display: block; + height: 16px; + width: 16px; + -moz-border-radius: 50%; + -webkit-border-radius: 50%; + border-radius: 50%; + border: 2px solid #dee2e6; +} +.menu-wrapper .sidebar-logo img { + width: 17px; + height: 20px; + border: 0 none; +} +.menu-wrapper .layout-menu-container { + height: calc(100% - 62px); +} +.menu-wrapper .layout-menu-container .layout-menu { + list-style-type: none; + margin: 0; + padding: 0; + max-width: 62px; + overflow: hidden; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.menu-wrapper .layout-menu-container .layout-menu > li > a { + position: relative; +} +.menu-wrapper .layout-menu-container .layout-menu > li > a::before { + content: ""; + width: 4px; + height: 12px; + display: block; + border-radius: 0px 3px 3px 0px; + position: absolute; + left: 0; +} +.menu-wrapper .layout-menu-container .layout-menu > li > ul > li { + margin-left: 6px; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; +} +.menu-wrapper .layout-menu-container .layout-menu li { + padding: 10px 0; +} +.menu-wrapper .layout-menu-container .layout-menu li.active-menuitem > a i.layout-submenu-toggler { + -webkit-transform: rotate(-180deg); + -moz-transform: rotate(-180deg); + -o-transform: rotate(-180deg); + -ms-transform: rotate(-180deg); + transform: rotate(-180deg); +} +.menu-wrapper .layout-menu-container .layout-menu li .layout-menu-tooltip { + display: none; +} +.menu-wrapper .layout-menu-container .layout-menu li > a { + margin: 0px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; + font-size: 13px; + padding: 6px 20px; + user-select: none; + cursor: pointer; +} +.menu-wrapper .layout-menu-container .layout-menu li > a > span { + margin: 0 8px; + margin-left: 14px; + font-weight: 600; + font-size: 12px; + line-height: 14px; + visibility: hidden; + white-space: nowrap; +} +.menu-wrapper .layout-menu-container .layout-menu li > a > i { + font-size: 24px; +} +.menu-wrapper .layout-menu-container .layout-menu li > a > i.layout-submenu-toggler { + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; + margin-left: auto; + font-size: 12px; + visibility: hidden; +} +.menu-wrapper .layout-menu-container .layout-menu li > a.rotated-icon i { + transform: rotate(90deg); +} +.menu-wrapper .layout-menu-container .layout-menu li > ul { + display: none; + list-style-type: none; + overflow: hidden; + padding: 0; + margin: 0; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul li ul { + display: none; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li { + padding: 0; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li > a { + padding: 10px 18px; + margin-left: 0px; + padding-right: 8px; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li i { + font-size: 14px; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li ul li { + padding: 0; +} +.menu-wrapper .layout-menu-container .layout-menu li > ul > li.layout-root-menuitem > a { + display: -ms-flexbox; + display: flex; +} + +@media (min-width: 992px) { + .layout-wrapper.layout-sidebar .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo { + display: none; + } + .layout-wrapper.layout-sidebar .layout-main { + padding-left: 62px; + } + .layout-wrapper.layout-static .menu-wrapper { + transform: translate3d(0px, 0px, 0px); + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo { + justify-content: space-between; + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo img { + display: inline; + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo .app-name { + display: inline; + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo .sidebar-pin { + display: inline-block; + } + .layout-wrapper.layout-static .menu-wrapper .sidebar-logo .sidebar-pin > span { + display: block; + height: 16px; + width: 16px; + -moz-border-radius: 50%; + -webkit-border-radius: 50%; + border-radius: 50%; + border: 2px solid #dee2e6; + border: 2px solid var(--primary-light-color); + background-color: #dee2e6; + background-color: var(--primary-lighter-color); + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu { + max-width: 230px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu > li { + min-width: 230px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu > li > ul > li { + margin-left: 10px; + margin-right: 12px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li a { + padding-left: 20px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li a { + padding-left: 30px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li a { + padding-left: 40px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li a { + padding-left: 50px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li > a > span { + visibility: visible; + white-space: normal; + } + .layout-wrapper.layout-static .menu-wrapper .layout-menu li > a i.layout-submenu-toggler { + visibility: visible; + } + .layout-wrapper.layout-static .layout-main { + padding-left: 230px; + -moz-transition: padding-left 0.2s; + -o-transition: padding-left 0.2s; + -webkit-transition: padding-left 0.2s; + transition: padding-left 0.2s; + } + + .menu-wrapper.layout-sidebar-active { + transform: translate3d(0px, 0px, 0px); + } + .menu-wrapper.layout-sidebar-active .sidebar-logo { + justify-content: space-between; + } + .menu-wrapper.layout-sidebar-active .sidebar-logo img { + display: inline; + } + .menu-wrapper.layout-sidebar-active .sidebar-logo .app-name { + display: inline; + } + .menu-wrapper.layout-sidebar-active .sidebar-logo .sidebar-pin { + display: inline-block; + } + .menu-wrapper.layout-sidebar-active .sidebar-logo .sidebar-pin > span { + display: block; + height: 16px; + width: 16px; + -moz-border-radius: 50%; + -webkit-border-radius: 50%; + border-radius: 50%; + border: 2px solid #dee2e6; + } + .menu-wrapper.layout-sidebar-active .layout-menu { + max-width: 230px; + } + .menu-wrapper.layout-sidebar-active .layout-menu > li { + min-width: 230px; + } + .menu-wrapper.layout-sidebar-active .layout-menu > li > ul > li { + margin-left: 10px; + margin-right: 12px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li a { + padding-left: 20px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li a { + padding-left: 30px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li a { + padding-left: 40px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li a { + padding-left: 50px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .menu-wrapper.layout-sidebar-active .layout-menu li > a > span { + visibility: visible; + white-space: normal; + } + .menu-wrapper.layout-sidebar-active .layout-menu li > a i.layout-submenu-toggler { + visibility: visible; + } + .menu-wrapper.layout-sidebar-active .layout-menu-container { + overflow: auto; + } +} +@media (max-width: 991px) { + .layout-wrapper .menu-wrapper { + top: 62px; + z-index: 1010; + -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); + transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); + transform: translate3d(-230px, 0px, 0px); + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + } + .layout-wrapper .menu-wrapper .sidebar-logo { + display: none; + } + .layout-wrapper .menu-wrapper .layout-menu-container .layout-menu { + max-width: 230px; + } + .layout-wrapper.layout-mobile-active { + overflow: hidden; + height: 100vh; + } + .layout-wrapper.layout-mobile-active .menu-wrapper { + transform: translate3d(0px, 0px, 0px); + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu { + max-width: 230px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu > li { + min-width: 230px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu > li > ul > li { + margin-left: 10px; + margin-right: 12px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li a { + padding-left: 20px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li a { + padding-left: 30px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li a { + padding-left: 40px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li a { + padding-left: 50px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li > a > span { + visibility: visible; + white-space: normal; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu li > a i.layout-submenu-toggler { + visibility: visible; + } + .layout-wrapper.layout-mobile-active .menu-wrapper .layout-menu-container { + overflow: auto; + } + .layout-wrapper.layout-mobile-active .layout-mask { + display: block; + } + .layout-wrapper .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button { + display: block; + } +} +@media (min-width: 992px) { + .layout-wrapper.layout-horizontal .menu-wrapper { + top: 0px; + width: 100%; + height: 62px; + position: relative; + } + .layout-wrapper.layout-horizontal .menu-wrapper .sidebar-logo { + display: none; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container { + height: 100%; + display: flex; + align-items: center; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu { + list-style-type: none; + margin: 0px 16px; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: row; + flex-direction: row; + max-width: 100%; + overflow: visible; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu li.active-menuitem > a i.layout-submenu-toggler { + -webkit-transform: rotate(-180deg); + -moz-transform: rotate(-180deg); + -o-transform: rotate(-180deg); + -ms-transform: rotate(-180deg); + transform: rotate(-180deg); + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li { + padding: 0; + position: relative; + margin: 0 9px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li .layout-menu-tooltip { + display: none; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a { + margin: 0px; + padding: 10px 5px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a:before { + display: none; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a > span { + margin: 0 8px; + font-weight: 600; + font-size: 12px; + line-height: 14px; + visibility: visible; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a > i { + font-size: 14px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li a > i.layout-submenu-toggler { + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; + margin-left: auto; + font-size: 12px; + visibility: visible; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.layout-root-menuitem > div { + display: none; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul { + display: none; + list-style-type: none; + top: 44px; + left: 0px; + width: 230px; + position: absolute; + padding: 10px; + margin: 0; + z-index: 100; + overflow: auto; + max-height: 460px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li { + border: 0 none; + margin: 0; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li a { + padding-left: 20px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li a { + padding-left: 30px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li a { + padding-left: 40px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li a { + padding-left: 50px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .layout-wrapper.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul > li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .layout-wrapper.layout-horizontal .layout-topbar .layout-topbar-wrapper .layout-topbar-left .menu-button-wrapper .menu-button { + display: none; + } + .layout-wrapper.layout-horizontal .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item a { + display: block; + } + .layout-wrapper.layout-horizontal .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > .search-input-wrapper { + display: none; + } + .layout-wrapper.layout-horizontal .layout-topbar .layout-topbar-wrapper .layout-topbar-right .layout-topbar-actions > li.active-topmenuitem.search-item > ul { + display: block; + padding: 0; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + } +} +@media (min-width: 992px) { + .layout-wrapper.layout-slim .menu-wrapper { + width: 62px; + overflow: visible; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container { + padding: 0; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu { + overflow: visible; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip { + display: none; + padding: 0 0.412px; + position: absolute; + left: 72px; + top: 16px; + line-height: 1; + border-radius: 2px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-text { + padding: 6px 8px; + font-weight: 500; + min-width: 75px; + white-space: nowrap; + text-align: center; + -webkit-box-shadow: 0 2px 10px 0 rgba(0, 3, 6, 0.16); + -moz-box-shadow: 0 2px 10px 0 rgba(0, 3, 6, 0.16); + box-shadow: 0 2px 10px 0 rgba(0, 3, 6, 0.16); + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-arrow { + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + top: 50%; + left: -4px; + margin-top: -5px; + border-width: 5px 5px 5px 0; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li { + position: relative; + padding: 10px 12px 10px 14px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a { + margin: 0px; + padding: 6px; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + position: relative; + border: none; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a:before { + display: none; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a span { + display: none; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a i { + margin-right: 0; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a i.layout-submenu-toggler { + display: none; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a .menuitem-badge { + display: none; + margin-left: auto; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > a:hover + .layout-menu-tooltip { + display: block; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul { + position: absolute; + top: 0; + left: 62px; + min-width: 250px; + max-height: 450px; + display: none; + padding: 10px; + overflow: auto; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li { + margin: 0; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + padding: 10px 5px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a > span { + visibility: visible; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a > i.layout-submenu-toggler { + visibility: visible; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li a { + padding-left: 20px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li a { + padding-left: 30px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li a { + padding-left: 40px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li a { + padding-left: 50px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li a { + padding-left: 60px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 70px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 80px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 90px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li ul li ul li ul li ul li ul li ul li ul li ul li ul li a { + padding-left: 100px; + } + .layout-wrapper.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover + .layout-menu-tooltip { + display: none; + } + .layout-wrapper.layout-slim .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo { + display: none; + } + .layout-wrapper.layout-slim .layout-main { + padding-left: 62px; + } +} +.layout-menu-dark .menu-wrapper { + background-color: #293241; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #2170E7; + color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: #293241; +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: #293241; + color: #2170E7; + color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(233, 233, 233, 0.8); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #2170E7; + color: var(--primary-light-color); +} +.layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-light-color); +} +@media (min-width: 992px) { + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + color: #E9E9E9; + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #E9E9E9; + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-light-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + color: #E9E9E9; + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #E9E9E9; + } + .layout-menu-dark.layout-horizontal .menu-wrapper { + box-shadow: none; + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + color: var(--primary-light-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a i { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul { + background-color: #293241; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a:hover { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip { + background-color: #293241; + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-text { + color: #ffffff; + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-arrow { + border-right-color: #293241; + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a i { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul { + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + background-color: #293241; + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a:hover { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #2170E7; + color: var(--primary-light-color); + } +} +@media (max-width: 991px) { + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #E9E9E9; + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #2170E7; + color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-light-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + color: #E9E9E9; + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(233, 233, 233, 0.8); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-dark .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #E9E9E9; + } +} + +.layout-menu-light .menu-wrapper { + background-color: #ffffff; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #293241; +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #2170E7; + color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: #ffffff; +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: #ffffff; + color: #2170E7; + color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(41, 50, 65, 0.7); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #2170E7; + color: var(--primary-color); +} +.layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-color); +} +@media (min-width: 992px) { + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > a { + color: #293241; + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + color: #293241; + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-light .menu-wrapper.layout-sidebar-active .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #293241; + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #293241; + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + color: #293241; + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-light.layout-static .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #293241; + } + .layout-menu-light.layout-horizontal .menu-wrapper { + box-shadow: none; + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #293241; + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + color: var(--primary-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a i { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul { + background-color: #ffffff; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a:hover { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light.layout-horizontal .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip { + background-color: #293241; + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-text { + color: #ffffff; + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu .layout-menu-tooltip .layout-menu-tooltip-arrow { + border-right-color: #293241; + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a i { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a:hover { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul { + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + background-color: #ffffff; + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li > a:hover { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light.layout-slim .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #2170E7; + color: var(--primary-color); + } +} +@media (max-width: 991px) { + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > a { + color: #293241; + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > a:hover { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a { + color: #2170E7; + color: var(--primary-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li.active-menuitem > a::before { + background-color: #2170E7; + background-color: var(--primary-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem { + background-color: rgba(33, 112, 231, 0.2); + background-color: var(--primary-lighter-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul > li.active-menuitem > a { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + color: #293241; + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li a { + color: rgba(41, 50, 65, 0.7); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li a:hover { + background-color: rgba(33, 112, 231, 0.1); + background-color: var(--primary-lighter-color); + } + .layout-menu-light .menu-wrapper .layout-menu-container .layout-menu > li > ul li.active-menuitem > a { + color: #293241; + } +} + +.layout-rightpanel { + position: fixed; + z-index: 1000; + right: 0; + top: 62px; + height: calc(100% - 62px); + padding: 0; + width: 418px; + overflow: auto; + background-color: #F7FAFF; + transform: translate3d(418px, 0px, 0px); + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + backface-visibility: hidden; + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); +} +.layout-rightpanel .rightpanel-wrapper { + padding: 22px 20px 40px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section { + padding: 16px 0; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section .section-header { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + margin-bottom: 16px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section .section-header > h6 { + margin: 0; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding: 14px 16px; + background-image: url("#{resource['demo:images/rightpanel/asset-weather.png']}"); + background-position: center; + background-repeat: no-repeat; + background-size: cover; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; + -webkit-box-shadow: 0px 10px 40 rgba(41, 50, 65, 0.06); + -moz-box-shadow: 0px 10px 40 rgba(41, 50, 65, 0.06); + box-shadow: 0px 10px 40 rgba(41, 50, 65, 0.06); + color: rgba(41, 50, 65, 0.8); +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather > img { + height: 60px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather .weather-info { + margin-left: 16px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather .weather-info h6 { + margin: 0 0 2px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.weather-section .weather .weather-info h1 { + margin: 0; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul { + padding: 0; + margin: 0; + list-style: none; + overflow: auto; + max-height: 320px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li { + padding: 16px; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; + background-color: #ffffff; + margin-bottom: 12px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li .task-info h6 { + color: #3E4754; + margin: 0 0 4px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li .task-info > span { + display: block; + font-weight: 500; + font-size: 14px; + line-height: 140%; + color: rgba(41, 50, 65, 0.5); +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li.done { + opacity: 0.5; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.tasks-section > ul > li.done .task-info h6 { + text-decoration: line-through; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + flex-wrap: wrap; + margin: -7px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items .favorite-item { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + box-shadow: 0px 0px 1px rgba(41, 50, 65, 0.5), 0px 1px 1px rgba(41, 50, 65, 0.2); + width: 80px; + height: 80px; + background-color: #ffffff; + margin: 7px; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items .favorite-item:hover { + background-color: #F7F7F8; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items .add-item { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + width: 80px; + height: 80px; + margin: 7px; + border: 1px dashed #dee2e6; + color: #dee2e6; + -moz-transition: background-color 0.2s; + -o-transition: background-color 0.2s; + -webkit-transition: background-color 0.2s; + transition: background-color 0.2s; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.favorites-section .favorite-items .add-item:hover { + background-color: #F7F7F8; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section { + margin-top: 40px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel { + height: 400px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat { + height: 400px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .fade { + background-image: linear-gradient(180deg, #F7FAFF 0%, rgba(234, 237, 243, 0) 100%); +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content { + max-height: 400px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message { + background-color: #ffffff; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts { + max-height: 400px; +} +.layout-rightpanel .rightpanel-wrapper .rightpanel-section.chat-section .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li:hover { + background-color: #ffffff; +} + +.layout-wrapper.layout-rightpanel-active .layout-rightpanel { + transform: translate3d(0px, 0px, 0px); +} + +@media (max-width: 576px) { + .layout-rightpanel { + width: 100%; + transform: translate3d(100%, 0px, 0px); + } +} +.layout-footer { + padding: 30px 36px; +} +.layout-footer .footer-menutitle { + color: rgba(41, 50, 65, 0.5); + font-weight: 600; + font-size: 12px; + line-height: 14px; + min-height: 15px; + display: block; + margin-bottom: 9px; +} +.layout-footer .footer-subtitle { + font-weight: 500; + font-size: 14px; + display: block; + color: rgba(41, 50, 65, 0.5); +} +.layout-footer ul { + padding: 0; + margin: 0; + list-style: none; +} +.layout-footer ul > li { + padding: 7px 0; +} +.layout-footer ul > li > a { + color: rgba(41, 50, 65, 0.8); + -moz-transition: color 0.2s; + -o-transition: color 0.2s; + -webkit-transition: color 0.2s; + transition: color 0.2s; +} +.layout-footer ul > li > a:hover { + color: rgba(41, 50, 65, 0.5); +} +.layout-footer .newsletter-input { + margin-top: 16px; + background-color: #ffffff; + position: relative; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; +} +.layout-footer .newsletter-input > input { + width: 100%; + background-color: transparent; + border: none; + padding: 11px 16px; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + font-size: 14px; + line-height: 200%; +} +.layout-footer .newsletter-input > button { + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + border-radius: 8px; + position: absolute; + right: 6px; + top: 50%; + margin-top: -16px; +} +.layout-footer .newsletter-input > button > span { + display: block; + padding: 0; + width: 100%; + font-weight: 600; + font-size: 14px; +} +.layout-footer .footer-bottom { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; +} +.layout-footer .footer-bottom h4 { + line-height: 22px; + margin: 0; + margin-right: 32px; +} +.layout-footer .footer-bottom h6 { + line-height: 17px; + margin: 0; + color: rgba(41, 50, 65, 0.5); + font-weight: 500; +} + +/* Utils */ +.clearfix:after { + content: " "; + display: block; + clear: both; +} + +.card { + background: #ffffff; + padding: 20px; + box-sizing: border-box; + box-shadow: 0 10px 40px rgba(41, 50, 65, 0.06); + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + margin-bottom: 2rem; +} +.card:last-child { + margin-bottom: 0; +} +.card .card-header { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; + padding-bottom: 16px; +} +.card .card-header h6 { + margin-bottom: 2px; +} +.card .card-header .subtitle { + font-weight: 600; + color: rgba(41, 50, 65, 0.5); +} +.card .card-subtitle { + color: rgba(41, 50, 65, 0.5); + font-weight: 600; + margin: -1rem 0 1rem 0; +} +.card.no-gutter { + margin-bottom: 0; +} + +.sr-only { + border: 0; + clip: rect(1px, 1px, 1px, 1px); + clip-path: inset(50%); + height: 1px; + margin: -1px; + overflow: hidden; + padding: 0; + position: absolute; + width: 1px; + word-wrap: normal !important; +} + +.ui-text-secondary { + color: rgba(41, 50, 65, 0.5); +} + +.layout-wrapper .layout-ajax-loader { + position: absolute; + right: 15px; + bottom: 70px; +} +.layout-wrapper .layout-ajax-loader .layout-ajax-loader-icon { + color: red; + font-size: 32px; +} + +.layout-dashboard .chart { + overflow: auto; + position: relative; +} +.layout-dashboard .mobile-teams { + display: none; +} + +@media (max-width: 1200px) { + .layout-dashboard .desktop-teams { + display: none; + } + .layout-dashboard .mobile-teams { + display: block; + } + .layout-dashboard .mobile-teams .team { + height: 100%; + flex-direction: column; + -ms-flex-pack: start; + justify-content: flex-start; + -ms-flex-align: start; + align-items: flex-start; + } + .layout-dashboard .mobile-teams .team .peoples { + margin: 12px -8px; + } +} +.overview-box { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; + padding-top: 24px; + height: 100%; + min-width: 200px; +} +.overview-box .overview-info > h6 { + margin: 0 0 2px; +} +.overview-box .overview-info > h1 { + margin: 0; +} +.overview-box > i { + font-size: 24px; +} +.overview-box.white { + background: #FFFFFF; + color: rgba(41, 50, 65, 0.8); +} +.overview-box.blue { + background: #69B7FF; + color: #FFFFFF; +} +.overview-box.gray { + background: rgba(41, 50, 65, 0.4); + color: #FFFFFF; +} +.overview-box.darkgray { + background: rgba(41, 50, 65, 0.8); + color: #FFFFFF; +} +.overview-box.orange { + background: linear-gradient(90deg, #FFB340 0%, #FFA740 100%); + color: #FFFFFF; +} + +.timeline { + padding-right: 4px; +} +.timeline > ul { + padding: 0; + margin: 0; + list-style: none; + max-height: 372px; + overflow: auto; + margin-bottom: 1em; +} +.timeline > ul > li { + display: -ms-flexbox; + display: flex; + margin-bottom: 16px; +} +.timeline > ul > li > i { + font-size: 8px; + margin-right: 10px; + margin-top: 4px; +} +.timeline > ul > li .event-content span { + display: block; + margin-bottom: 4px; + font-weight: 600; + font-size: 12px; + color: rgba(41, 50, 65, 0.5); +} +.timeline > ul > li .event-content span.event-title { + color: #3E4754; +} +.timeline > ul > li .event-content span.time { + font-size: 10px; + font-weight: 400; + color: rgba(41, 50, 65, 0.5); +} +.timeline > ul > li.blue > i { + color: #297FFF; +} +.timeline > ul > li.green > i { + color: #34B56F; +} +.timeline > ul > li.orange > i { + color: #FFA928; +} + +.device-status .content { + color: rgba(41, 50, 65, 0.5); + line-height: 1.4; + margin-bottom: 20px; +} +.device-status .progress { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding: 10px 0; + color: rgba(41, 50, 65, 0.5); +} +.device-status .progress > span { + min-width: 40px; +} +.device-status .progress .ui-progressbar { + width: 100%; + margin: 0 12px; + background: rgba(41, 127, 255, 0.2); + background: var(--primary-lighter-color); +} +.device-status .progress .ui-progressbar .ui-progressbar-value { + background: rgba(41, 127, 255, 0.2); + background: var(--primary-color); + opacity: 0.8; + border-radius: 24px; +} +.device-status .progress.active .ui-progressbar { + width: 100%; + margin: 0 12px; + background: rgba(41, 127, 255, 0.2); + background: var(--primary-lighter-color); +} +.device-status .progress.active .ui-progressbar .ui-progressbar-value { + background: linear-gradient(270deg, #42BBFF 0%, #6129FF 100%); + background: linear-gradient(270deg, var(--primary-lighter-color) 0%, var(--primary-color) 100%); + opacity: 0.8; +} +.device-status .device { + margin-bottom: 16px; +} +.device-status .device span { + color: #2170E7; + color: var(--primary-color); + font-size: 14px; + font-weight: 600; +} +.device-status .device span > span { + font-size: 8px; + font-weight: normal; +} +.device-status .device span.status { + font-size: 12px; + color: rgba(41, 50, 65, 0.5); + margin-top: 4px; + display: block; +} + +.team { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; +} +.team .card-header { + padding: 0; + min-width: 70px; +} +.team .peoples { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + flex-wrap: wrap; +} +.team .peoples > img { + -moz-border-radius: 10px; + -webkit-border-radius: 10px; + border-radius: 10px; + margin: 8px 8px; + width: 32px; + height: 32px; +} +.team .peoples .no-picture { + cursor: pointer; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-border-radius: 10px; + -webkit-border-radius: 10px; + border-radius: 10px; + margin: 8px 8px; + width: 32px; + height: 32px; + background: rgba(41, 50, 65, 0.1); + color: rgba(41, 50, 65, 0.8); + font-size: 12px; + -moz-transition: background 0.2s; + -o-transition: background 0.2s; + -webkit-transition: background 0.2s; + transition: background 0.2s; +} +.team .peoples .no-picture:hover { + background: rgba(41, 50, 65, 0.2); +} + +.map { + padding: 0; +} +.map > img { + width: 100%; + height: auto; + border-radius: 24px 24px 12px 12px; +} +.map .map-content { + padding: 50px 20px 28px; +} +.map .map-content h6 { + margin: 0 0 16px; +} +.map .map-content .city { + margin-bottom: 16px; +} +.map .map-content .city span { + color: #2170E7; + color: var(--primary-color); + font-size: 14px; + font-weight: 600; +} +.map .map-content .city span > span { + font-size: 8px; + font-weight: normal; +} +.map .map-content .city span.status { + font-size: 12px; + color: rgba(41, 50, 65, 0.5); + margin-top: 4px; + display: block; +} + +.schedule > p { + color: rgba(41, 50, 65, 0.5); +} +.schedule > ul { + list-style: none; + padding: 0; + margin: 0; +} +.schedule > ul > li { + background: #F7F7F8; + border-radius: 8px; + margin-bottom: 10px; + padding: 5px 16px 12px; +} +.schedule > ul > li .schedule-header { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; + -ms-flex-align: center; + align-items: center; +} +.schedule > ul > li .schedule-header h6 { + line-height: 24px; + margin: 0; +} +.schedule > ul > li .schedule-header span { + color: rgba(41, 50, 65, 0.5); + font-weight: 600; + font-size: 10px; + line-height: 14px; +} +.schedule > ul > li > span { + margin-top: 4px; + color: rgba(41, 50, 65, 0.5); + display: block; + font-size: 12px; + line-height: 14px; +} + +.statistics .statistic-item .item-title { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + margin-bottom: 4px; +} +.statistics .statistic-item .item-title span { + display: block; + margin-right: 12px; +} +.statistics .statistic-item .item-title h5 { + margin: 0; + font-weight: 700; +} +.statistics .statistic-item h6 { + margin: 0; + font-weight: 600; + color: rgba(41, 50, 65, 0.5); +} + +.stocks ul { + list-style: none; + padding: 0; + margin: 0; +} +.stocks ul > li { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + background-color: #F7FAFF; + padding: 0; + margin: 0 0 12px; + -moz-border-radius: 6px; + -webkit-border-radius: 6px; + border-radius: 6px; + overflow: hidden; +} +.stocks ul > li .stock-name { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + background-color: #EEF5FF; + padding: 18px 10px; + min-width: 70px; + margin-right: 4px; +} +.stocks ul > li .stock-name h6 { + margin: 0; + color: rgba(41, 50, 65, 0.8); + line-height: 17px; + font-weight: 600; +} +.stocks ul > li > img { + margin: 0 4px; + height: 25px; +} +.stocks ul > li .stock-price { + padding: 0 10px; + color: #34B56F; + margin: 0 4px; +} +.stocks ul > li .stock-price h6 { + line-height: 17px; + font-weight: 600; + display: inline-block; +} +.stocks ul > li .stock-price i { + display: inline-block; +} +.stocks ul > li .stock-status { + margin-left: 4px; + padding: 0 20px; +} +.stocks ul > li .stock-status span { + display: block; + font-weight: 600; + font-size: 10px; + line-height: 12px; + color: rgba(41, 50, 65, 0.5); +} +.stocks ul > li.down .stock-price { + color: #FF6E49; +} +.stocks ul > li.same .stock-price { + color: #FFA928; +} +.stocks > .ui-button { + width: 100%; + margin-top: 30px; +} + +.operations { + overflow: auto; + position: relative; +} +.operations .insights { + padding: 16px 15px; + background-color: rgba(41, 127, 255, 0.04); + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + margin: 12px 0 16px; +} +.operations .insights .insight-header { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + margin-bottom: 5px; +} +.operations .insights .insight-header h6 { + margin: 0 6px; +} +.operations .insights > ul { + list-style: none; + padding: 0; + margin: 0; +} +.operations .insights > ul > li { + margin: 8px 0; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + color: rgba(41, 50, 65, 0.5); +} +.operations .insights > ul > li span { + font-weight: 600; +} +.operations .insights > ul > li span > span { + font-size: 8px; + line-height: 10px; + font-weight: normal; +} +.operations > button { + width: 100%; +} + +.notification { + padding: 30px 24px; + background-color: #ffffff; + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; +} +.notification > h6 { + margin: 0; + color: rgba(41, 50, 65, 0.8); +} +.notification > h6 > a { + margin-left: 10px; +} +.notification > h6 > a i { + -webkit-transform: rotate(45deg); + -moz-transform: rotate(45deg); + -o-transform: rotate(45deg); + -ms-transform: rotate(45deg); + transform: rotate(45deg); +} + +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav { + background-color: transparent; + margin: 0 -10px; + border: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav:before { + display: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header { + padding: 9px 0 0; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + background-color: transparent; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + margin: 0 10px; + border: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header a { + position: relative; + width: 52px; + height: 52px; + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + background-color: #D0D6DD; + cursor: pointer; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + color: #2170E7; + color: var(--primary-color); + border: 0 none; + overflow: visible; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header a img { + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header a .ui-badge { + position: absolute; + bottom: -5px; + right: -5px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header.ui-state-active { + padding: 0 0 9px; + border: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header.ui-state-active a { + box-shadow: 0px 0px 1px rgba(41, 50, 65, 0.16), 0px 1px 2px rgba(41, 50, 65, 0.04), 0px 6px 12px rgba(41, 50, 65, 0.24); + border: 0 none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header.ui-state-active:before { + content: ""; + width: 12px; + height: 2px; + background: #2170E7; + background: var(--primary-color); + border-radius: 3px; + position: absolute; + bottom: -10px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-nav .ui-tabs-header.ui-state-hover { + border: none; + padding: 0 0 9px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels { + background-color: transparent; + border: none; + padding: 16px 0 0; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel { + padding: 0; + height: 350px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat { + position: relative; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + height: 350px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .fade { + position: absolute; + top: 0; + left: 0; + display: block; + width: 100%; + height: 44px; + background-image: linear-gradient(180deg, #ffffff 0%, rgba(234, 237, 243, 0) 100%); +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content { + max-height: 400px; + overflow: auto; + padding: 30px 6px 12px; + flex: 1 1 auto; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message { + display: -ms-flexbox; + display: flex; + flex-direction: column; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .name { + display: block; + color: rgba(41, 50, 65, 0.5); + font-weight: 600; + font-size: 10px; + line-height: 14px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message { + max-width: 250px; + padding: 8px 10px; + box-shadow: 0px 0px 1px rgba(41, 50, 65, 0.5), 0px 1px 1px rgba(41, 50, 65, 0.2); + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + background-color: #F7FAFF; + margin-bottom: 8px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message p { + padding: 0; + margin: 0 0 2px; + color: rgba(41, 50, 65, 0.8); +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message span { + display: block; + font-weight: 600; + font-size: 10px; + line-height: 14px; + color: rgba(41, 50, 65, 0.5); +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message.send { + -ms-flex-align: end; + align-items: flex-end; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message.send .message span { + text-align: right; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content.no-message { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-content.no-message h4 { + color: rgba(41, 50, 65, 0.5); +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts { + flex: 1 1 auto; + max-height: 400px; + overflow: auto; + padding: 0px 0 12px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul { + padding: 0; + margin: 0; + list-style: none; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + margin-bottom: 6px; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; + cursor: pointer; + padding: 8px 10px; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li img { + margin-right: 12px; + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li h6 { + margin: 0 0 2px; + color: rgba(41, 50, 65, 0.8); +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li span { + display: block; + color: rgba(41, 50, 65, 0.5); + font-weight: 600; + font-size: 10px; + line-height: 14px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .contacts ul > li:hover { + background-color: #F7FAFF; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-input { + margin-top: 30px; +} +.chat .ui-tabs.ui-tabs-top .ui-tabs-panels .ui-tabs-panel .chat .chat-input input { + width: 100%; + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + padding: 20px 19px; + background-color: #F7F7F8; + border: none; +} + +.image-card { + padding: 0; + position: relative; +} +.image-card > span { + position: absolute; + right: 20px; + top: 20px; +} +.image-card > img { + width: 100%; + height: auto; + border-radius: 24px 24px 12px 12px; +} +.image-card .image-content { + padding: 32px 20px 28px; +} +.image-card .image-content h6 { + margin: 0 0 8px; +} +.image-card .image-content > p { + color: rgba(41, 50, 65, 0.5); +} +.image-card .image-content > button { + margin-top: 32px; + width: 100%; +} + +.login-body { + background: #FFFFFF; +} +.login-body .login-wrapper { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + flex-direction: column; + height: 100vh; +} +.login-body .login-wrapper .login-panel { + width: 30%; + height: 100%; + text-align: center; + padding: 40px 20px; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + flex: 1 1 100%; +} +.login-body .login-wrapper .login-panel .logo { + margin-bottom: 50px; +} +.login-body .login-wrapper .login-panel .logo img { + width: 45px; + height: 53px; +} +.login-body .login-wrapper .login-panel > a { + font-weight: 500; + font-size: 10px; + line-height: 12px; + color: rgba(41, 50, 65, 0.3); +} +.login-body .login-wrapper .login-panel > p { + font-weight: 500; + margin: 0; + color: rgba(41, 50, 65, 0.5); + margin-top: 40px; +} +.login-body .login-wrapper .login-panel > p > a { + color: #2170E7; + cursor: pointer; +} +.login-body .login-wrapper .login-panel > input { + width: 85%; + max-width: 247px; + margin-bottom: 10px; + background-color: #F6F7F7; + border: 1.2px solid #D4D6D9; + color: #515C66; + padding: 12px 10px; +} +.login-body .login-wrapper .login-panel > input::placeholder { + color: gba(41, 50, 65, 0.3); +} +.login-body .login-wrapper .login-panel > button { + width: 85%; + max-width: 247px; + margin-bottom: 10px; + padding: 0; +} +.login-body .login-wrapper .login-panel > button > span { + padding: 15px 20px; + display: block; + font-weight: 600; + font-size: 14px; + line-height: 16px; +} +.login-body .login-wrapper .login-footer { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding-bottom: 70px; +} +.login-body .login-wrapper .login-footer h4 { + line-height: 22px; + margin: 0; + margin-right: 32px; +} +.login-body .login-wrapper .login-footer h6 { + line-height: 17px; + margin: 0; + color: rgba(41, 50, 65, 0.5); + font-weight: 500; +} + +@media (max-width: 992px) { + .login-body .login-wrapper .login-panel { + width: 100%; + } +} +.exception-body .exception-topbar { + height: 62px; + background-color: #ffffff; + box-shadow: 0 10px 40px 0 rgba(41, 50, 65, 0.06); + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding: 0 16px; +} +.exception-body .exception-topbar .layout-topbar-logo > img { + height: 15px; +} +.exception-body .exception-wrapper { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + -ms-flex-align: center; + align-items: center; + min-height: calc(100vh - 62px); +} +.exception-body .exception-wrapper .exception-content { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: center; + justify-content: center; + flex: 1 1 auto; +} +.exception-body .exception-wrapper .exception-content > span { + font-weight: normal; + font-size: 60px; + line-height: 73px; + text-align: center; + display: block; +} +.exception-body .exception-wrapper .exception-footer { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding-bottom: 70px; +} +.exception-body .exception-wrapper .exception-footer h4 { + line-height: 22px; + margin: 0; + margin-right: 32px; +} +.exception-body .exception-wrapper .exception-footer h6 { + line-height: 17px; + margin: 0; + color: rgba(41, 50, 65, 0.5); + font-weight: 500; +} +.exception-body.notfound .exception-wrapper { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + -ms-flex-align: center; + align-items: center; + min-height: calc(100vh - 62px); +} +.exception-body.notfound .exception-wrapper .exception-content { + text-align: center; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: center; + justify-content: center; + -ms-flex-align: center; + align-items: center; + flex: 1 1 auto; +} +.exception-body.notfound .exception-wrapper .exception-content img { + width: 332px; + height: 271px; + margin-bottom: -150px; +} +.exception-body.notfound .exception-wrapper .exception-content > span { + font-size: 140px; + line-height: 171px; +} +.exception-body.notfound .exception-wrapper .exception-content > span.exception-subtitle { + font-weight: 500; + font-size: 14px; + line-height: 17px; + color: rgba(41, 50, 65, 0.5); +} +.exception-body.notfound .exception-wrapper .exception-content > button { + padding: 0; + margin-top: 20px; + width: 155px; + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; +} +.exception-body.notfound .exception-wrapper .exception-content > button > span { + padding: 18px; + font-weight: 600; +} + +@media (max-width: 991px) { + .exception-body .exception-wrapper { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: justify; + justify-content: space-between; + -ms-flex-align: center; + align-items: center; + min-height: calc(100vh - 62px); + } + .exception-body .exception-wrapper .exception-footer { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding-bottom: 20px; + } +} +.landing-body { + background-color: #E5E5E5; +} +.landing-body .landing-topbar { + height: 83px; + background-color: #FFFFFF; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + width: 100%; + z-index: 999; + padding: 20px 40px; + position: relative; +} +.landing-body .landing-topbar .landing-topbar-left { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; +} +.landing-body .landing-topbar .landing-topbar-left .logo { + margin-right: 40px; +} +.landing-body .landing-topbar .landing-topbar-left .logo img { + height: 16px; + width: auto; +} +.landing-body .landing-topbar .landing-topbar-left > ul { + list-style-type: none; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + margin: 0; + padding: 0; +} +.landing-body .landing-topbar .landing-topbar-left > ul > li #landing-menu-close { + display: none; +} +.landing-body .landing-topbar .landing-topbar-left > ul > li > a { + font-weight: 600; + font-size: 12px; + line-height: 14px; + color: rgba(41, 50, 65, 0.9); + padding: 14px 10px; + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + margin: 0 10px; + min-width: 100px; + -moz-transition: color 0.2s; + -o-transition: color 0.2s; + -webkit-transition: color 0.2s; + transition: color 0.2s; +} +.landing-body .landing-topbar .landing-topbar-left > ul > li > a:hover { + color: #2170E7; +} +.landing-body .landing-topbar .landing-topbar-right .second-menubutton { + margin-right: 20px; + font-weight: 600; + font-size: 12px; + line-height: 14px; + color: rgba(41, 50, 65, 0.9); + padding: 14px 10px; + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + min-width: 100px; + -moz-transition: color 0.2s; + -o-transition: color 0.2s; + -webkit-transition: color 0.2s; + transition: color 0.2s; +} +.landing-body .landing-topbar .landing-topbar-right .second-menubutton:hover { + color: #2170E7; +} +.landing-body .landing-topbar .landing-topbar-right .landing-button span { + font-weight: 600; + font-size: 12px; + line-height: 14px; +} +.landing-body .landing-topbar .landing-topbar-right #landing-menu-button { + display: none; + padding: 0 8px; + cursor: pointer; +} +.landing-body .landing-topbar .landing-topbar-right #landing-menu-button i { + font-size: 20px; +} +.landing-body .landing-button { + background: linear-gradient(108.43deg, #297FFF 12.5%, #7A0EE7 96.32%); + border: none; + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + -moz-transition: all 0.2s; + -o-transition: all 0.2s; + -webkit-transition: all 0.2s; + transition: all 0.2s; +} +.landing-body .landing-button.ui-button { + padding: 0; +} +.landing-body .landing-button.ui-button > .ui-button-text { + padding: 14px 10px; + min-width: 121px; + font-weight: 600; + font-size: 16px; + line-height: 19px; + display: block; +} +.landing-body .landing-button > a .ui-button-text { + padding: 14px 10px; + min-width: 87px; + font-weight: 600; + font-size: 16px; + line-height: 19px; + display: block; +} +.landing-body .landing-button:hover { + background: linear-gradient(108.43deg, #2f79e7 12.5%, #781cd4 96.32%); +} +.landing-body .landing-banner { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + padding: 303px 30px 218px; + position: relative; + transform-style: inherit; + background: url("#{resource['freya-layout:images/pages/asset-landing-header.jpg']}"); + background-size: cover; + height: 80vh; +} +.landing-body .landing-banner .landing-banner-content { + text-align: center; + position: relative; +} +.landing-body .landing-banner .landing-banner-content .title { + display: block; + font-weight: 500; + font-size: 70px; + line-height: 84px; + color: #FFFFFF; +} +.landing-body .landing-banner .landing-banner-content h3 { + margin: 40px 0 30px; + color: #FFFFFF; + font-weight: 500; + line-height: 29px; +} +.landing-body .section-header { + text-align: center; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + flex-direction: column; +} +.landing-body .section-header .title { + display: block; + font-weight: 500; + font-size: 70px; + line-height: 84px; + color: rgba(41, 50, 65, 0.9); +} +.landing-body .section-header h3 { + margin: 15px 0 100px; + color: rgba(41, 50, 65, 0.9); + font-weight: 500; + line-height: 29px; + max-width: 800px; +} +.landing-body .landing-features { + background-color: #FFFFFF; + position: relative; + display: -ms-flexbox; + display: flex; + flex-wrap: wrap; + padding: 36px 6% 125px; +} +.landing-body .landing-features .lg\:col-3 { + transition: transform 250ms linear; + -webkit-transition: transform 250ms linear; +} +.landing-body .landing-features .feature { + display: -ms-flexbox; + display: flex; +} +.landing-body .landing-features .feature > span { + font-weight: 500; + font-size: 20px; + line-height: 20px; + color: rgba(41, 50, 65, 0.8); + margin-top: 30px; + margin-right: 12px; +} +.landing-body .landing-features .feature .feature-card { + -moz-border-radius: 36px; + -webkit-border-radius: 36px; + border-radius: 36px; + padding: 28px 30px; + display: -ms-flexbox; + display: flex; + width: 100%; +} +.landing-body .landing-features .feature .feature-card > span { + display: none; +} +.landing-body .landing-features .feature .feature-card h3 { + font-weight: 500; + line-height: 36px; + margin: 0 0 20px; + color: rgba(41, 50, 65, 0.8); +} +.landing-body .landing-features .feature .feature-card h5 { + margin: 0; + font-weight: normal; + line-height: 150%; + color: rgba(41, 50, 65, 0.9); + opacity: 0.8; +} +.landing-body .landing-features .feature.yellow .feature-card { + padding-bottom: 128px; + background: linear-gradient(197.55deg, #FFD37D -1.02%, #FFDB7D 46.53%); +} +.landing-body .landing-features .feature.blue .feature-card { + padding-bottom: 67px; + background: linear-gradient(156.18deg, #DAF4FF 38.02%, #CEDFFF 95.69%); +} +.landing-body .landing-features .feature.darker-blue .feature-card { + padding-bottom: 164px; + background: linear-gradient(165.84deg, #C1E9FF 42.24%, rgba(219, 242, 255, 0.23) 97.17%); +} +.landing-body .landing-features .feature.darker-gray .feature-card { + padding-bottom: 109px; + background: linear-gradient(176.91deg, rgba(41, 50, 65, 0.6) 50%, rgba(41, 50, 65, 0.282) 115.03%); +} +.landing-body .landing-features .feature.darker-gray .feature-card h3 { + color: #FFFFFF; +} +.landing-body .landing-features .feature.darker-gray .feature-card h5 { + color: #FFFFFF; + opacity: 0.8; +} +.landing-body .landing-features .feature.gray .feature-card { + padding-bottom: 50px; + background: linear-gradient(11.49deg, rgba(41, 50, 65, 0.1) 60.37%, rgba(41, 50, 65, 0.026) 98.03%); +} +.landing-body .landing-pricing { + background-color: #FFFFFF; + position: relative; + padding: 125px 15% 260px; + text-align: center; +} +.landing-body .landing-pricing .pricing-card { + background: #FFFFFF; + box-shadow: 0px 0px 1px rgba(41, 50, 65, 0.5), 0px 1px 1px rgba(41, 50, 65, 0.2); + -moz-border-radius: 24px; + -webkit-border-radius: 24px; + border-radius: 24px; + padding: 30px 20px 33px; + text-align: center; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + flex-direction: column; + position: relative; + margin-bottom: 60px; +} +.landing-body .landing-pricing .pricing-card .preferred-tag { + padding: 14px 24px; + background: linear-gradient(112.58deg, #FFD029 22.19%, #F1AF60 100%); + box-shadow: 0px 10px 40px rgba(41, 50, 65, 0.06); + -moz-border-radius: 12px; + -webkit-border-radius: 12px; + border-radius: 12px; + transform: rotate(-7.18deg); + position: absolute; + top: -32px; + color: #FFFFFF; + font-weight: bold; + font-size: 20px; + line-height: 24px; +} +.landing-body .landing-pricing .pricing-card h2 { + margin: 0 0 14px; + color: rgba(41, 50, 65, 0.9); +} +.landing-body .landing-pricing .pricing-card .price { + display: block; + color: #2170E7; + font-weight: bold; + font-size: 80px; + line-height: 95px; +} +.landing-body .landing-pricing .pricing-card .time { + color: rgba(41, 50, 65, 0.5); + font-size: 12px; + line-height: 14px; + display: block; + margin-bottom: 32px; +} +.landing-body .landing-pricing .pricing-card > ul { + padding: 42px 0 0; + width: 100%; + margin: 0; + list-style: none; + border-top: 1px solid rgba(41, 50, 65, 0.1); +} +.landing-body .landing-pricing .pricing-card > ul > li { + font-size: 16px; + line-height: 205.34%; + color: rgba(41, 50, 65, 0.5); +} +.landing-body .landing-pricing .pricing-card.pro { + background: linear-gradient(333.31deg, #EFF3FB 6.36%, #FFFFFF 72.79%); +} +.landing-body .landing-pricing .pricing-card.enterprise { + background: linear-gradient(156.19deg, rgba(41, 50, 65, 0.8) 10.28%, rgba(35, 40, 49, 0.496) 87.74%); +} +.landing-body .landing-pricing .pricing-card.enterprise h2 { + margin: 0 0 14px; + color: #FFFFFF; +} +.landing-body .landing-pricing .pricing-card.enterprise .price { + color: #FFFFFF; +} +.landing-body .landing-pricing .pricing-card.enterprise .time { + color: #FFFFFF; + opacity: 0.6; +} +.landing-body .landing-pricing .pricing-card.enterprise > ul { + border-top: 1px solid rgba(255, 255, 255, 0.2); +} +.landing-body .landing-pricing .pricing-card.enterprise > ul > li { + color: #FFFFFF; +} +.landing-body .landing-pricing > a { + font-size: 24px; + line-height: 29px; + display: block; +} +.landing-body .layout-footer { + background-color: #FFFFFF; + position: relative; +} +.landing-body .layout-footer .footer-menutitle { + color: rgba(41, 50, 65, 0.2); +} +.landing-body .layout-footer .footer-subtitle { + color: rgba(41, 50, 65, 0.3); +} +.landing-body .layout-footer ul > li { + color: rgba(41, 50, 65, 0.5); +} +.landing-body .layout-footer ul > li > a { + color: rgba(41, 50, 65, 0.5); +} +.landing-body .layout-footer ul > li > a:hover { + color: rgba(41, 50, 65, 0.3); +} +.landing-body .layout-footer .newsletter-input { + background-color: rgba(41, 50, 65, 0.04); +} +.landing-body .layout-footer .footer-bottom { + color: rgba(41, 50, 65, 0.7); +} +.landing-body .layout-footer .footer-bottom h6 { + color: rgba(41, 50, 65, 0.5); +} +.landing-body .landing-mask { + display: none; + width: 100%; + height: 100vh; + position: fixed; + top: 0; + left: 0; + background-color: rgba(0, 0, 0, 0.2); + z-index: 998; +} + +@media (max-width: 991px) { + .landing-body.block-scroll { + overflow: hidden; + } + .landing-body.block-scroll .landing-wrapper .landing-mask { + display: block; + } + .landing-body .landing-wrapper.landing-menu-active .landing-topbar .landing-menu { + transform: translate3d(0px, 0px, 0px); + } + .landing-body .landing-wrapper .landing-topbar { + padding: 0 13px; + } + .landing-body .landing-wrapper .landing-topbar .landing-menu { + position: fixed; + flex-direction: column; + -ms-flex-align: end; + align-items: flex-end; + right: 0; + top: 0; + padding: 28px 15px; + z-index: 999; + width: 220px; + height: 100%; + background-color: #EEF5FF; + box-shadow: 0 24px 64px -2px rgba(0, 0, 0, 0.02), 0 6px 16px -2px rgba(0, 0, 0, 0.06), 0 2px 6px -2px rgba(0, 0, 0, 0.08); + transform: translate3d(260px, 0px, 0px); + -moz-transition: transform 0.2s; + -o-transition: transform 0.2s; + -webkit-transition: transform 0.2s; + transition: transform 0.2s; + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li { + margin: 0; + width: 100%; + margin-bottom: 12px; + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li > a { + padding: 6px 16px; + font-size: 14px; + text-align: right; + background-color: #EEF5FF; + display: block; + color: rgba(41, 50, 65, 0.9); + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li > a:hover { + color: rgba(41, 50, 65, 0.6); + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li #landing-menu-close { + display: block; + font-size: 20px; + text-align: right; + color: rgba(41, 50, 65, 0.9); + } + .landing-body .landing-wrapper .landing-topbar .landing-menu > li #landing-menu-close:hover { + color: rgba(41, 50, 65, 0.6); + } + .landing-body .landing-wrapper .landing-topbar #landing-menu-button { + display: block; + color: rgba(41, 50, 65, 0.9); + font-size: 20px; + } + .landing-body .landing-wrapper .landing-topbar .landing-topbar-right { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + } + .landing-body .landing-wrapper .landing-topbar .landing-topbar-right .second-menubutton { + display: none; + } + .landing-body .landing-wrapper .landing-topbar .landing-topbar-right .landing-button { + margin-right: 20px; + } + .landing-body .landing-wrapper .landing-banner { + background-position: top; + padding: 80px 23px; + -ms-flex-pack: start; + justify-content: flex-start; + height: auto; + top: auto !important; + } + .landing-body .landing-wrapper .landing-banner .landing-banner-content { + text-align: left; + max-width: 262px; + top: auto !important; + } + .landing-body .landing-wrapper .landing-banner .landing-banner-content > span { + font-size: 60px; + line-height: 91.84%; + } + .landing-body .landing-wrapper .landing-banner .landing-banner-content > h3 { + font-size: 18px; + line-height: 130%; + } + .landing-body .landing-wrapper .landing-features { + padding: 36px 20px 30px; + } + .landing-body .landing-wrapper .landing-features .lg\:col-3 { + transform: translateY(0) !important; + margin-top: auto !important; + } + .landing-body .landing-wrapper .landing-features .feature-empty { + display: none; + } + .landing-body .landing-wrapper .landing-features .feature-3 { + margin-top: auto; + } + .landing-body .landing-wrapper .landing-features .feature-4 { + margin-top: auto; + } + .landing-body .landing-wrapper .landing-features .feature > span { + display: none; + } + .landing-body .landing-wrapper .landing-features .feature .feature-card { + padding-bottom: 28px !important; + } + .landing-body .landing-wrapper .landing-features .feature .feature-card > span { + font-weight: 500; + font-size: 20px; + line-height: 20px; + color: rgba(41, 50, 65, 0.8); + margin-right: 12px; + margin-top: 8px; + display: block; + } + .landing-body .landing-wrapper .landing-features .feature.blue .feature-card { + flex-direction: row-reverse; + text-align: right; + } + .landing-body .landing-wrapper .landing-features .feature.blue .feature-card > span { + margin-right: 0px; + margin-left: 12px; + } + .landing-body .landing-wrapper .landing-features .feature.darker-gray .feature-card { + flex-direction: row-reverse; + text-align: right; + } + .landing-body .landing-wrapper .landing-features .feature.darker-gray .feature-card > span { + color: #FFFFFF; + float: right; + margin-right: 0px; + margin-left: 12px; + } + .landing-body .landing-wrapper .section-header .title { + font-size: 60px; + line-height: 72px; + } + .landing-body .landing-wrapper .section-header h3 { + font-size: 18px; + line-height: 130%; + } + .landing-body .landing-wrapper .landing-pricing { + padding: 30px 20px 97px; + } + .landing-body .landing-wrapper .landing-pricing .pricing-card { + margin-bottom: 20px; + } + .landing-body .landing-wrapper .landing-pricing .pricing-card > ul { + display: none; + } + .landing-body .landing-wrapper .landing-pricing .preferred { + order: -1 !important; + } + .landing-body .landing-wrapper .landing-pricing .preferred .pricing-card > ul { + display: block; + } +} +.help-page p { + margin: 0; +} +.help-page .help-search { + background-image: url("#{resource['freya-layout:images/pages/search.png']}"); + padding: 0; + text-align: center; +} +.help-page .help-search .help-search-content { + padding: 5rem 12rem; +} +.help-page .help-search .help-search-content h3 { + color: rgba(41, 50, 65, 0.8); + font-weight: 500; +} +.help-page .help-search .search-container { + font-size: 1rem; + padding: 1rem; + position: relative; +} +.help-page .help-search .search-container input { + appearance: none; + font-size: 1rem; + text-indent: 2rem; + padding: 1rem; + width: 100%; +} +.help-page .help-search .search-container i { + width: 1rem; + position: absolute; + margin-left: 1rem; + top: 50%; + margin-top: -0.5rem; +} +.help-page .status-bars { + margin-top: 1rem; + display: -ms-flexbox; + display: flex; +} +.help-page .status-bars .status-bar { + flex: 1 1 0; + -ms-flex: 1 1 0px; + background: #6EC180; + height: 50px; + margin-right: 0.25rem; + transition: transform 0.2s; +} +.help-page .status-bars .status-bar:last-child { + margin-right: 0; +} +.help-page .status-bars .status-bar.status-bar-failure { + background: #FF6E49; +} +.help-page .status-bars .status-bar:hover { + transform: scale(1.1); +} +.help-page .status-bar-footer { + padding: 1rem 0 0 0; + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; +} +.help-page .blog-post { + border-radius: 4px; + padding: 20px; + margin: 3rem 2rem; + border: 1px solid #dee2e6; + background-color: #ffffff; + position: relative; + -moz-border-radius: 20px; + -webkit-border-radius: 20px; + border-radius: 20px; +} +.help-page .blog-post:last-child { + margin-bottom: 1rem; +} +.help-page .blog-post img { + width: 100%; + position: absolute; + left: 0; + top: 0; +} +.help-page .blog-post .blog-text h1 { + color: rgba(41, 50, 65, 0.8); + margin-bottom: 1rem; + font-weight: 500; +} +.help-page .blog-post .blog-text span { + color: rgba(41, 50, 65, 0.5); + line-height: 1.4; +} +.help-page .blog-post .blog-profile { + position: absolute; + top: -25px; + left: -25px; +} +.help-page .blog-post .blog-profile img { + width: 50px; + height: 50px; + border-radius: 50%; +} + +@media screen and (max-width: 991px) { + .help-page .help-search .help-search-content { + padding: 6rem 2rem; + } +} +.invoice { + padding: 2rem; +} +.invoice .invoice-header { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; +} +.invoice .invoice-company .logo-image { + height: 50px; + margin-bottom: 0.5rem; +} +.invoice .invoice-company div { + margin-bottom: 0.5rem; +} +.invoice .invoice-company .company-name { + font-weight: 500; + font-size: 1.5rem; +} +.invoice .invoice-title { + font-size: 2rem; + margin-bottom: 2rem; + text-align: right; + font-weight: 300; +} +.invoice .invoice-details { + width: 15rem; + display: -ms-flexbox; + display: flex; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} +.invoice .invoice-details > div { + width: 50%; + margin-bottom: 0.5rem; +} +.invoice .invoice-details .invoice-label { + text-align: left; + font-weight: 500; +} +.invoice .invoice-details .invoice-value { + text-align: right; +} +.invoice .invoice-to { + margin-top: 1.5rem; + padding-top: 2rem; + border-top: 1px solid #F2F4F6; +} +.invoice .invoice-to .bill-to { + font-size: 1.25rem; + font-weight: 500; + margin-bottom: 0.5rem; +} +.invoice .invoice-to .invoice-to-info div { + margin-bottom: 0.5rem; +} +.invoice .invoice-items { + margin-top: 2rem; + padding-top: 2rem; +} +.invoice .invoice-items table { + width: 100%; + border-collapse: collapse; +} +.invoice .invoice-items table tr { + border-bottom: 1px solid #F2F4F6; +} +.invoice .invoice-items table th { + font-weight: 500; +} +.invoice .invoice-items table th, .invoice .invoice-items table td { + padding: 1rem; + text-align: right; +} +.invoice .invoice-items table th:first-child, .invoice .invoice-items table td:first-child { + text-align: left; +} +.invoice .invoice-summary { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: justify; + justify-content: space-between; + margin-top: 2.5rem; + padding-top: 2.5rem; +} +.invoice .invoice-summary .invoice-value { + font-weight: 500; +} + +@media print { + body * { + visibility: hidden; + } + + #invoice-content * { + visibility: visible; + } + + #invoice-content { + width: 100%; + position: absolute; + left: 0; + top: 0; + padding: 0; + margin: 0; + background: #ffffff; + color: rgba(41, 50, 65, 0.8); + } + + .invoice .invoice-to { + border-top: 1px solid #F2F4F6; + } + .invoice .invoice-items table tr { + border-bottom: 1px solid #F2F4F6; + } +} +.layout-config { + width: 16rem; + height: 100%; + position: fixed; + right: 0; + top: 0; + padding: 1rem; + overflow: auto; + background: #ffffff; + z-index: 999; + border-left: 0 none; + transform: translateX(100%); + transition: transform 0.2s cubic-bezier(0.05, 0.74, 0.2, 0.99); +} +.layout-config.layout-config-active { + transform: translateX(0); + box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); +} +.layout-config.layout-config-active .layout-config-content .layout-config-button i { + transform: rotate(360deg); +} +.layout-config .ui-selectoneradio td { + padding: 0.5rem; +} +.layout-config p { + line-height: 1.5rem; + color: #6c757d; +} +.layout-config .layout-themes { + display: -ms-flexbox; + display: flex; + -ms-flex-wrap: wrap; + flex-wrap: wrap; +} +.layout-config .layout-themes > div { + padding: 0.25rem; +} +.layout-config .layout-themes a { + width: 2rem; + height: 2rem; + border-radius: 24px; + display: block; + position: relative; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + transition: transform 0.2s; + box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); +} +.layout-config .layout-themes a i { + font-size: 1rem; + position: absolute; + top: 50%; + left: 50%; + margin-left: -0.5rem; + margin-top: -0.5rem; +} +.layout-config .layout-themes a:hover { + transform: scale(1.1); +} + +.layout-config-button { + display: block; + position: fixed; + width: 3rem; + height: 3rem; + line-height: 3rem; + background: #1976D2; + color: #ffffff; + text-align: center; + top: 50%; + right: 0; + margin-top: -1.5rem; + border-top-left-radius: 24px; + border-bottom-left-radius: 24px; + transition: background-color 0.2s; + overflow: hidden; + cursor: pointer; + z-index: 999; + box-shadow: -0.25rem 0 1rem rgba(0, 0, 0, 0.15); +} +.layout-config-button i { + font-size: 2rem; + line-height: inherit; + transform: rotate(0deg); + transition: transform 1s; +} +.layout-config-button:hover { + background: #2083e4; +} + +/* Add your customizations of the layout styles here */ +.layout-wrapper .layout-rightpanel .rightpanel-wrapper { + position: relative; + height: 100%; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-header { + text-align: center; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-header .profile { + padding: 12px; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-actions { + padding: 12px 6px 36px; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-actions .actions .action-buttons .col-6, .layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-actions .actions .action-buttons .md\:col-4 { + padding: 0.2em; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav { + background-color: white; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav li.ui-tabs-header { + padding: 1rem; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav li.ui-tabs-header a { + font-size: 12px; + font-weight: 500; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav li.ui-tabs-header > span { + font-size: 10px; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active { + background-color: #F7FAFF; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-panels { + background-color: white; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-panels .ui-tabs-panel { + padding: 0; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-panels .ui-tabs-panel .chat .chat-content .chat-message .message { + width: 80%; +} +.layout-wrapper .layout-rightpanel .rightpanel-wrapper .rightpanel-chat .ui-tabs .ui-tabs-panels .ui-tabs-panel .chat .chat-input input { + width: 105px; + margin-right: 7px; +} diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-light.scss b/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-light.scss new file mode 100644 index 0000000..ed65b45 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/css/layout-light.scss @@ -0,0 +1,5 @@ +$primaryColor:#2170E7; +$primaryTextColor:#ffffff; + +@import '../../sass/variables/layout/_layout_light'; +@import '../../sass/layout/_layout'; \ No newline at end of file diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/css/primeflex-v2.min.css b/src/main/resources/META-INF/resources/resources/freya-layout/css/primeflex-v2.min.css new file mode 100644 index 0000000..1f4ccda --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/css/primeflex-v2.min.css @@ -0,0 +1 @@ +.p-grid{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-1rem;margin-left:-1rem;margin-top:-1rem}.p-grid>.p-col,.p-grid>[class*=p-col]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.p-nogutter{margin-right:0;margin-left:0;margin-top:0}.p-nogutter>.p-col,.p-nogutter>[class*=p-col-]{padding:0}.p-col{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;padding:1rem}.p-col-fixed{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;padding:1rem}.p-col-1,.p-col-2,.p-col-3,.p-col-4,.p-col-5,.p-col-6,.p-col-7,.p-col-8,.p-col-9,.p-col-10,.p-col-11,.p-col-12{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;padding:1rem}.p-col-1{width:8.3333%}.p-col-2{width:16.6667%}.p-col-3{width:25%}.p-col-4{width:33.3333%}.p-col-5{width:41.6667%}.p-col-6{width:50%}.p-col-7{width:58.3333%}.p-col-8{width:66.6667%}.p-col-9{width:75%}.p-col-10{width:83.3333%}.p-col-11{width:91.6667%}.p-col-12{width:100%}.p-offset-12{margin-left:100%}.p-offset-11{margin-left:91.66666667%}.p-offset-10{margin-left:83.33333333%}.p-offset-9{margin-left:75%}.p-offset-8{margin-left:66.66666667%}.p-offset-7{margin-left:58.33333333%}.p-offset-6{margin-left:50%}.p-offset-5{margin-left:41.66666667%}.p-offset-4{margin-left:33.33333333%}.p-offset-3{margin-left:25%}.p-offset-2{margin-left:16.66666667%}.p-offset-1{margin-left:8.33333333%}.p-offset-0{margin-left:0%}.p-sm-1,.p-sm-2,.p-sm-3,.p-sm-4,.p-sm-5,.p-sm-6,.p-sm-7,.p-sm-8,.p-sm-9,.p-sm-10,.p-sm-11,.p-sm-12,.p-md-1,.p-md-2,.p-md-3,.p-md-4,.p-md-5,.p-md-6,.p-md-7,.p-md-8,.p-md-9,.p-md-10,.p-md-11,.p-md-12,.p-lg-1,.p-lg-2,.p-lg-3,.p-lg-4,.p-lg-5,.p-lg-6,.p-lg-7,.p-lg-8,.p-lg-9,.p-lg-10,.p-lg-11,.p-lg-12,.p-xl-1,.p-xl-2,.p-xl-3,.p-xl-4,.p-xl-5,.p-xl-6,.p-xl-7,.p-xl-8,.p-xl-9,.p-xl-10,.p-xl-11,.p-xl-12{padding:1rem}.p-col-nogutter{padding:0}@media screen and (min-width: 576px){.p-sm-1,.p-sm-2,.p-sm-3,.p-sm-4,.p-sm-5,.p-sm-6,.p-sm-7,.p-sm-8,.p-sm-9,.p-sm-10,.p-sm-11,.p-sm-12{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.p-sm-1{width:8.3333%}.p-sm-2{width:16.6667%}.p-sm-3{width:25%}.p-sm-4{width:33.3333%}.p-sm-5{width:41.6667%}.p-sm-6{width:50%}.p-sm-7{width:58.3333%}.p-sm-8{width:66.6667%}.p-sm-9{width:75%}.p-sm-10{width:83.3333%}.p-sm-11{width:91.6667%}.p-sm-12{width:100%}.p-sm-offset-12{margin-left:100%}.p-sm-offset-11{margin-left:91.66666667%}.p-sm-offset-10{margin-left:83.33333333%}.p-sm-offset-9{margin-left:75%}.p-sm-offset-8{margin-left:66.66666667%}.p-sm-offset-7{margin-left:58.33333333%}.p-sm-offset-6{margin-left:50%}.p-sm-offset-5{margin-left:41.66666667%}.p-sm-offset-4{margin-left:33.33333333%}.p-sm-offset-3{margin-left:25%}.p-sm-offset-2{margin-left:16.66666667%}.p-sm-offset-1{margin-left:8.33333333%}.p-sm-offset-0{margin-left:0%}}@media screen and (min-width: 768px){.p-md-1,.p-md-2,.p-md-3,.p-md-4,.p-md-5,.p-md-6,.p-md-7,.p-md-8,.p-md-9,.p-md-10,.p-md-11,.p-md-12{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.p-md-1{width:8.3333%}.p-md-2{width:16.6667%}.p-md-3{width:25%}.p-md-4{width:33.3333%}.p-md-5{width:41.6667%}.p-md-6{width:50%}.p-md-7{width:58.3333%}.p-md-8{width:66.6667%}.p-md-9{width:75%}.p-md-10{width:83.3333%}.p-md-11{width:91.6667%}.p-md-12{width:100%}.p-md-offset-12{margin-left:100%}.p-md-offset-11{margin-left:91.66666667%}.p-md-offset-10{margin-left:83.33333333%}.p-md-offset-9{margin-left:75%}.p-md-offset-8{margin-left:66.66666667%}.p-md-offset-7{margin-left:58.33333333%}.p-md-offset-6{margin-left:50%}.p-md-offset-5{margin-left:41.66666667%}.p-md-offset-4{margin-left:33.33333333%}.p-md-offset-3{margin-left:25%}.p-md-offset-2{margin-left:16.66666667%}.p-md-offset-1{margin-left:8.33333333%}.p-md-offset-0{margin-left:0%}}@media screen and (min-width: 992px){.p-lg-1,.p-lg-2,.p-lg-3,.p-lg-4,.p-lg-5,.p-lg-6,.p-lg-7,.p-lg-8,.p-lg-9,.p-lg-10,.p-lg-11,.p-lg-12{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.p-lg-1{width:8.3333%}.p-lg-2{width:16.6667%}.p-lg-3{width:25%}.p-lg-4{width:33.3333%}.p-lg-5{width:41.6667%}.p-lg-6{width:50%}.p-lg-7{width:58.3333%}.p-lg-8{width:66.6667%}.p-lg-9{width:75%}.p-lg-10{width:83.3333%}.p-lg-11{width:91.6667%}.p-lg-12{width:100%}.p-lg-offset-12{margin-left:100%}.p-lg-offset-11{margin-left:91.66666667%}.p-lg-offset-10{margin-left:83.33333333%}.p-lg-offset-9{margin-left:75%}.p-lg-offset-8{margin-left:66.66666667%}.p-lg-offset-7{margin-left:58.33333333%}.p-lg-offset-6{margin-left:50%}.p-lg-offset-5{margin-left:41.66666667%}.p-lg-offset-4{margin-left:33.33333333%}.p-lg-offset-3{margin-left:25%}.p-lg-offset-2{margin-left:16.66666667%}.p-lg-offset-1{margin-left:8.33333333%}.p-lg-offset-0{margin-left:0%}}@media screen and (min-width: 1200px){.p-xl-1,.p-xl-2,.p-xl-3,.p-xl-4,.p-xl-5,.p-xl-6,.p-xl-7,.p-xl-8,.p-xl-9,.p-xl-10,.p-xl-11,.p-xl-12{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.p-xl-1{width:8.3333%}.p-xl-2{width:16.6667%}.p-xl-3{width:25%}.p-xl-4{width:33.3333%}.p-xl-5{width:41.6667%}.p-xl-6{width:50%}.p-xl-7{width:58.3333%}.p-xl-8{width:66.6667%}.p-xl-9{width:75%}.p-xl-10{width:83.3333%}.p-xl-11{width:91.6667%}.p-xl-12{width:100%}.p-xl-offset-12{margin-left:100%}.p-xl-offset-11{margin-left:91.66666667%}.p-xl-offset-10{margin-left:83.33333333%}.p-xl-offset-9{margin-left:75%}.p-xl-offset-8{margin-left:66.66666667%}.p-xl-offset-7{margin-left:58.33333333%}.p-xl-offset-6{margin-left:50%}.p-xl-offset-5{margin-left:41.66666667%}.p-xl-offset-4{margin-left:33.33333333%}.p-xl-offset-3{margin-left:25%}.p-xl-offset-2{margin-left:16.66666667%}.p-xl-offset-1{margin-left:8.33333333%}.p-xl-offset-0{margin-left:0%}}.p-justify-start{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.p-justify-end{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.p-justify-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.p-justify-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.p-justify-around{-ms-flex-pack:distribute;justify-content:space-around}.p-justify-even{-webkit-box-pack:space-evenly;-ms-flex-pack:space-evenly;justify-content:space-evenly}.p-align-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.p-align-end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.p-align-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.p-align-baseline{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.p-align-stretch{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.p-col-align-start{-ms-flex-item-align:start;align-self:flex-start}.p-col-align-end{-ms-flex-item-align:end;align-self:flex-end}.p-col-align-center{-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.p-col-align-baseline{-ms-flex-item-align:baseline;align-self:baseline}.p-col-align-stretch{-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.p-dir-row{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.p-dir-rev{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.p-dir-col{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.p-dir-col-rev{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.p-dir-col>.p-col,.p-dir-col-rev>.p-col{-ms-flex-preferred-size:auto;flex-basis:auto}.p-col-order-first{-ms-flex-order:-1;order:-1}.p-col-order-last{-ms-flex-order:13;order:13}.p-col-order-0{-ms-flex-order:0;order:0}.p-col-order-1{-ms-flex-order:1;order:1}.p-col-order-2{-ms-flex-order:2;order:2}.p-col-order-3{-ms-flex-order:3;order:3}.p-col-order-4{-ms-flex-order:4;order:4}.p-col-order-5{-ms-flex-order:5;order:5}.p-col-order-6{-ms-flex-order:6;order:6}.p-col-order-7{-ms-flex-order:7;order:7}.p-col-order-8{-ms-flex-order:8;order:8}.p-col-order-9{-ms-flex-order:9;order:9}.p-col-order-10{-ms-flex-order:10;order:10}.p-col-order-11{-ms-flex-order:11;order:11}.p-col-order-12{-ms-flex-order:12;order:12}@media screen and (min-width: 576px){.p-sm-order-first{-ms-flex-order:-1;order:-1}.p-sm-order-last{-ms-flex-order:13;order:13}.p-sm-order-0{-ms-flex-order:0;order:0}.p-sm-order-1{-ms-flex-order:1;order:1}.p-sm-order-2{-ms-flex-order:2;order:2}.p-sm-order-3{-ms-flex-order:3;order:3}.p-sm-order-4{-ms-flex-order:4;order:4}.p-sm-order-5{-ms-flex-order:5;order:5}.p-sm-order-6{-ms-flex-order:6;order:6}.p-sm-order-7{-ms-flex-order:7;order:7}.p-sm-order-8{-ms-flex-order:8;order:8}.p-sm-order-9{-ms-flex-order:9;order:9}.p-sm-order-10{-ms-flex-order:10;order:10}.p-sm-order-11{-ms-flex-order:11;order:11}.p-sm-order-12{-ms-flex-order:12;order:12}}@media screen and (min-width: 768px){.p-md-order-first{-ms-flex-order:-1;order:-1}.p-md-order-last{-ms-flex-order:13;order:13}.p-md-order-0{-ms-flex-order:0;order:0}.p-md-order-1{-ms-flex-order:1;order:1}.p-md-order-2{-ms-flex-order:2;order:2}.p-md-order-3{-ms-flex-order:3;order:3}.p-md-order-4{-ms-flex-order:4;order:4}.p-md-order-5{-ms-flex-order:5;order:5}.p-md-order-6{-ms-flex-order:6;order:6}.p-md-order-7{-ms-flex-order:7;order:7}.p-md-order-8{-ms-flex-order:8;order:8}.p-md-order-9{-ms-flex-order:9;order:9}.p-md-order-10{-ms-flex-order:10;order:10}.p-md-order-11{-ms-flex-order:11;order:11}.p-md-order-12{-ms-flex-order:12;order:12}}@media screen and (min-width: 992px){.p-lg-order-first{-ms-flex-order:-1;order:-1}.p-lg-order-last{-ms-flex-order:13;order:13}.p-lg-order-0{-ms-flex-order:0;order:0}.p-lg-order-1{-ms-flex-order:1;order:1}.p-lg-order-2{-ms-flex-order:2;order:2}.p-lg-order-3{-ms-flex-order:3;order:3}.p-lg-order-4{-ms-flex-order:4;order:4}.p-lg-order-5{-ms-flex-order:5;order:5}.p-lg-order-6{-ms-flex-order:6;order:6}.p-lg-order-7{-ms-flex-order:7;order:7}.p-lg-order-8{-ms-flex-order:8;order:8}.p-lg-order-9{-ms-flex-order:9;order:9}.p-lg-order-10{-ms-flex-order:10;order:10}.p-lg-order-11{-ms-flex-order:11;order:11}.p-lg-order-12{-ms-flex-order:12;order:12}}@media screen and (min-width: 1200px){.p-xl-order-first{-ms-flex-order:-1;order:-1}.p-xl-order-last{-ms-flex-order:13;order:13}.p-xl-order-0{-ms-flex-order:0;order:0}.p-xl-order-1{-ms-flex-order:1;order:1}.p-xl-order-2{-ms-flex-order:2;order:2}.p-xl-order-3{-ms-flex-order:3;order:3}.p-xl-order-4{-ms-flex-order:4;order:4}.p-xl-order-5{-ms-flex-order:5;order:5}.p-xl-order-6{-ms-flex-order:6;order:6}.p-xl-order-7{-ms-flex-order:7;order:7}.p-xl-order-8{-ms-flex-order:8;order:8}.p-xl-order-9{-ms-flex-order:9;order:9}.p-xl-order-10{-ms-flex-order:10;order:10}.p-xl-order-11{-ms-flex-order:11;order:11}.p-xl-order-12{-ms-flex-order:12;order:12}}.p-field{margin-bottom:1rem}.p-field>label{display:inline-block;margin-bottom:.5rem}.p-field.p-grid>label{display:flex;align-items:center}.p-field>small{margin-top:.25rem}.p-field.p-grid,.p-formgrid.p-grid{margin-top:0}.p-field.p-grid .p-col-fixed,.p-formgrid.p-grid .p-col-fixed,.p-field.p-grid .p-col,.p-formgrid.p-grid .p-col,.p-field.p-grid .p-col-1,.p-formgrid.p-grid .p-col-1,.p-field.p-grid .p-col-2,.p-formgrid.p-grid .p-col-2,.p-field.p-grid .p-col-3,.p-formgrid.p-grid .p-col-3,.p-field.p-grid .p-col-4,.p-formgrid.p-grid .p-col-4,.p-field.p-grid .p-col-5,.p-formgrid.p-grid .p-col-5,.p-field.p-grid .p-col-6,.p-formgrid.p-grid .p-col-6,.p-field.p-grid .p-col-7,.p-formgrid.p-grid .p-col-7,.p-field.p-grid .p-col-8,.p-formgrid.p-grid .p-col-8,.p-field.p-grid .p-col-9,.p-formgrid.p-grid .p-col-9,.p-field.p-grid .p-col-10,.p-formgrid.p-grid .p-col-10,.p-field.p-grid .p-col-11,.p-formgrid.p-grid .p-col-11,.p-field.p-grid .p-col-12,.p-formgrid.p-grid .p-col-12{padding-top:0;padding-bottom:0}.p-formgroup-inline{display:flex;flex-wrap:wrap;align-items:flex-start}.p-formgroup-inline .p-field,.p-formgroup-inline .p-field-checkbox,.p-formgroup-inline .p-field-radiobutton{margin-right:1rem}.p-formgroup-inline .p-field>label,.p-formgroup-inline .p-field-checkbox>label,.p-formgroup-inline .p-field-radiobutton>label{margin-right:.5rem;margin-bottom:0}.p-field-checkbox,.p-field-radiobutton{margin-bottom:1rem;display:flex;align-items:center}.p-field-checkbox>label,.p-field-radiobutton>label{margin-left:.5rem;line-height:1}.p-d-none{display:none !important}.p-d-inline{display:inline !important}.p-d-inline-block{display:inline-block !important}.p-d-block{display:block !important}.p-d-flex{display:flex !important}.p-d-inline-flex{display:inline-flex !important}@media screen and (min-width: 576px){.p-d-sm-none{display:none !important}.p-d-sm-inline{display:inline !important}.p-d-sm-inline-block{display:inline-block !important}.p-d-sm-block{display:block !important}.p-d-sm-flex{display:flex !important}.p-d-sm-inline-flex{display:inline-flex !important}}@media screen and (min-width: 768px){.p-d-md-none{display:none !important}.p-d-md-inline{display:inline !important}.p-d-md-inline-block{display:inline-block !important}.p-d-md-block{display:block !important}.p-d-md-flex{display:flex !important}.p-d-md-inline-flex{display:inline-flex !important}}@media screen and (min-width: 992px){.p-d-lg-none{display:none !important}.p-d-lg-inline{display:inline !important}.p-d-lg-inline-block{display:inline-block !important}.p-d-lg-block{display:block !important}.p-d-lg-flex{display:flex !important}.p-d-lg-inline-flex{display:inline-flex !important}}@media screen and (min-width: 1200px){.p-d-xl-none{display:none !important}.p-d-xl-inline{display:inline !important}.p-d-xl-inline-block{display:inline-block !important}.p-d-xl-block{display:block !important}.p-d-xl-flex{display:flex !important}.p-d-xl-inline-flex{display:inline-flex !important}}@media print{.p-d-print-none{display:none !important}.p-d-print-inline{display:inline !important}.p-d-print-inline-block{display:inline-block !important}.p-d-print-block{display:block !important}.p-d-print-flex{display:flex !important}.p-d-print-inline-flex{display:inline-flex !important}}.p-text-justify{text-align:justify !important}.p-text-left{text-align:left !important}.p-text-right{text-align:right !important}.p-text-center{text-align:center !important}.p-text-nowrap{white-space:nowrap !important}.p-text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.p-text-lowercase{text-transform:lowercase !important}.p-text-uppercase{text-transform:uppercase !important}.p-text-capitalize{text-transform:capitalize !important}.p-text-bold{font-weight:700 !important}.p-text-normal{font-weight:400 !important}.p-text-light{font-weight:300 !important}.p-text-italic{font-style:italic !important}@media screen and (min-width: 576px){.p-text-sm-justify{text-align:justify !important}.p-text-sm-left{text-align:left !important}.p-text-sm-right{text-align:right !important}.p-text-sm-center{text-align:center !important}}@media screen and (min-width: 768px){.p-text-md-justify{text-align:justify !important}.p-text-md-left{text-align:left !important}.p-text-md-right{text-align:right !important}.p-text-md-center{text-align:center !important}}@media screen and (min-width: 992px){.p-text-lg-justify{text-align:justify !important}.p-text-lg-left{text-align:left !important}.p-text-lg-right{text-align:right !important}.p-text-lg-center{text-align:center !important}}@media screen and (min-width: 1200px){.p-text-xl-justify{text-align:justify !important}.p-text-xl-left{text-align:left !important}.p-text-xl-right{text-align:right !important}.p-text-xl-center{text-align:center !important}}.p-flex-row{flex-direction:row !important}.p-flex-row-reverse{flex-direction:row-reverse !important}.p-flex-column{flex-direction:column !important}.p-flex-column-reverse{flex-direction:column-reverse !important}@media screen and (min-width: 576px){.p-flex-sm-row{flex-direction:row !important}.p-flex-sm-row-reverse{flex-direction:row-reverse !important}.p-flex-sm-column{flex-direction:column !important}.p-flex-sm-column-reverse{flex-direction:column-reverse !important}}@media screen and (min-width: 768px){.p-flex-md-row{flex-direction:row !important}.p-flex-md-row-reverse{flex-direction:row-reverse !important}.p-flex-md-column{flex-direction:column !important}.p-flex-md-column-reverse{flex-direction:column-reverse !important}}@media screen and (min-width: 992px){.p-flex-lg-row{flex-direction:row !important}.p-flex-lg-row-reverse{flex-direction:row-reverse !important}.p-flex-lg-column{flex-direction:column !important}.p-flex-lg-column-reverse{flex-direction:column-reverse !important}}@media screen and (min-width: 1200px){.p-flex-xl-row{flex-direction:row !important}.p-flex-xl-row-reverse{flex-direction:row-reverse !important}.p-flex-xl-column{flex-direction:column !important}.p-flex-xl-column-reverse{flex-direction:column-reverse !important}}.p-jc-start{justify-content:flex-start}.p-jc-end{justify-content:flex-end}.p-jc-center{justify-content:center}.p-jc-between{justify-content:space-between}.p-jc-around{justify-content:space-around}.p-jc-evenly{justify-content:space-evenly}@media screen and (min-width: 576px){.p-jc-sm-start{justify-content:flex-start}.p-jc-sm-end{justify-content:flex-end}.p-jc-sm-center{justify-content:center}.p-jc-sm-between{justify-content:space-between}.p-jc-sm-around{justify-content:space-around}.p-jc-sm-evenly{justify-content:space-evenly}}@media screen and (min-width: 768px){.p-jc-md-start{justify-content:flex-start}.p-jc-md-end{justify-content:flex-end}.p-jc-md-center{justify-content:center}.p-jc-md-between{justify-content:space-between}.p-jc-md-around{justify-content:space-around}.p-jc-md-evenly{justify-content:space-evenly}}@media screen and (min-width: 992px){.p-jc-lg-start{justify-content:flex-start}.p-jc-lg-end{justify-content:flex-end}.p-jc-lg-center{justify-content:center}.p-jc-lg-between{justify-content:space-between}.p-jc-lg-around{justify-content:space-around}.p-jc-lg-evenly{justify-content:space-evenly}}@media screen and (min-width: 1200px){.p-jc-xl-start{justify-content:flex-start}.p-jc-xl-end{justify-content:flex-end}.p-jc-xl-center{justify-content:center}.p-jc-xl-between{justify-content:space-between}.p-jc-xl-around{justify-content:space-around}.p-jc-xl-evenly{justify-content:space-evenly}}.p-ai-start{align-items:flex-start}.p-ai-end{align-items:flex-end}.p-ai-center{align-items:center}.p-ai-baseline{align-items:baseline}.p-ai-stretch{align-items:stretch}@media screen and (min-width: 576px){.p-ai-sm-start{align-items:flex-start}.p-ai-sm-end{align-items:flex-end}.p-ai-sm-center{align-items:center}.p-ai-sm-baseline{align-items:baseline}.p-ai-sm-stretch{align-items:stretch}}@media screen and (min-width: 768px){.p-ai-md-start{align-items:flex-start}.p-ai-md-end{align-items:flex-end}.p-ai-md-center{align-items:center}.p-ai-md-baseline{align-items:baseline}.p-ai-md-stretch{align-items:stretch}}@media screen and (min-width: 992px){.p-ai-lg-start{align-items:flex-start}.p-ai-lg-end{align-items:flex-end}.p-ai-lg-center{align-items:center}.p-ai-lg-baseline{align-items:baseline}.p-ai-lg-stretch{align-items:stretch}}@media screen and (min-width: 1200px){.p-ai-xl-start{align-items:flex-start}.p-ai-xl-end{align-items:flex-end}.p-ai-xl-center{align-items:center}.p-ai-xl-baseline{align-items:baseline}.p-ai-xl-stretch{align-items:stretch}}.p-as-start{align-self:start}.p-as-end{align-self:flex-end}.p-as-center{align-self:center}.p-as-baseline{align-self:baseline}.p-as-stretch{align-self:stretch}@media screen and (min-width: 576px){.p-as-sm-start{align-self:start}.p-as-sm-end{align-self:flex-end}.p-as-sm-center{align-self:center}.p-as-sm-baseline{align-self:baseline}.p-as-sm-stretch{align-self:stretch}}@media screen and (min-width: 768px){.p-as-md-start{align-self:start}.p-as-md-end{align-self:flex-end}.p-as-md-center{align-self:center}.p-as-md-baseline{align-self:baseline}.p-as-md-stretch{align-self:stretch}}@media screen and (min-width: 992px){.p-as-lg-start{align-self:start}.p-as-lg-end{align-self:flex-end}.p-as-lg-center{align-self:center}.p-as-lg-baseline{align-self:baseline}.p-as-lg-stretch{align-self:stretch}}@media screen and (min-width: 1200px){.p-as-xl-start{align-self:start}.p-as-xl-end{align-self:flex-end}.p-as-xl-center{align-self:center}.p-as-xl-baseline{align-self:baseline}.p-as-xl-stretch{align-self:stretch}}.p-ac-start{align-content:flex-start}.p-ac-end{align-content:flex-end}.p-ac-center{align-content:center}.p-ac-around{align-content:space-around}.p-ac-stretch{align-content:stretch}.p-ac-between{align-content:space-between}@media screen and (min-width: 576px){.p-ac-sm-start{align-content:flex-start}.p-ac-sm-end{align-content:flex-end}.p-ac-sm-center{align-content:center}.p-ac-sm-around{align-content:space-around}.p-ac-sm-stretch{align-content:stretch}.p-ac-sm-between{align-content:space-between}}@media screen and (min-width: 768px){.p-ac-md-start{align-content:flex-start}.p-ac-md-end{align-content:flex-end}.p-ac-md-center{align-content:center}.p-ac-md-around{align-content:space-around}.p-ac-md-stretch{align-content:stretch}.p-ac-md-between{align-content:space-between}}@media screen and (min-width: 992px){.p-ac-lg-start{align-content:flex-start}.p-ac-lg-end{align-content:flex-end}.p-ac-lg-center{align-content:center}.p-ac-lg-around{align-content:space-around}.p-ac-lg-stretch{align-content:stretch}.p-ac-lg-between{align-content:space-between}}@media screen and (min-width: 1200px){.p-ac-xl-start{align-content:flex-start}.p-ac-xl-end{align-content:flex-end}.p-ac-xl-center{align-content:center}.p-ac-xl-around{align-content:space-around}.p-ac-xl-stretch{align-content:stretch}.p-ac-xl-between{align-content:space-between}}.p-order-0{order:0}.p-order-1{order:1}.p-order-2{order:2}.p-order-3{order:3}.p-order-4{order:4}.p-order-5{order:5}.p-order-6{order:6}@media screen and (min-width: 576px){.p-order-sm-0{order:0}.p-order-sm-1{order:1}.p-order-sm-2{order:2}.p-order-sm-3{order:3}.p-order-sm-4{order:4}.p-order-sm-5{order:5}.p-order-sm-6{order:6}}@media screen and (min-width: 768px){.p-order-md-0{order:0}.p-order-md-1{order:1}.p-order-md-2{order:2}.p-order-md-3{order:3}.p-order-md-4{order:4}.p-order-md-5{order:5}.p-order-md-6{order:6}}@media screen and (min-width: 992px){.p-order-lg-0{order:0}.p-order-lg-1{order:1}.p-order-lg-2{order:2}.p-order-lg-3{order:3}.p-order-lg-4{order:4}.p-order-lg-5{order:5}.p-order-lg-6{order:6}}@media screen and (min-width: 1200px){.p-order-xl-0{order:0}.p-order-xl-1{order:1}.p-order-xl-2{order:2}.p-order-xl-3{order:3}.p-order-xl-4{order:4}.p-order-xl-5{order:5}.p-order-xl-6{order:6}}.p-flex-nowrap{flex-wrap:nowrap}.p-flex-wrap{flex-wrap:wrap}.p-flex-wrap-reverse{flex-wrap:wrap-reverse}@media screen and (min-width: 576px){.p-flex-sm-nowrap{flex-wrap:nowrap}.p-flex-sm-wrap{flex-wrap:wrap}.p-flex-sm-wrap-reverse{flex-wrap:wrap-reverse}}@media screen and (min-width: 768px){.p-flex-md-nowrap{flex-wrap:nowrap}.p-flex-md-wrap{flex-wrap:wrap}.p-flex-md-wrap-reverse{flex-wrap:wrap-reverse}}@media screen and (min-width: 992px){.p-flex-lg-nowrap{flex-wrap:nowrap}.p-flex-lg-wrap{flex-wrap:wrap}.p-flex-lg-wrap-reverse{flex-wrap:wrap-reverse}}@media screen and (min-width: 1200px){.p-flex-xl-nowrap{flex-wrap:nowrap}.p-flex-xl-wrap{flex-wrap:wrap}.p-flex-xl-wrap-reverse{flex-wrap:wrap-reverse}}.p-pt-0{padding-top:0 !important}.p-pt-1{padding-top:.25rem !important}.p-pt-2{padding-top:.5rem !important}.p-pt-3{padding-top:1rem !important}.p-pt-4{padding-top:1.5rem !important}.p-pt-5{padding-top:2rem !important}.p-pt-6{padding-top:3rem !important}.p-pr-0{padding-right:0 !important}.p-pr-1{padding-right:.25rem !important}.p-pr-2{padding-right:.5rem !important}.p-pr-3{padding-right:1rem !important}.p-pr-4{padding-right:1.5rem !important}.p-pr-5{padding-right:2rem !important}.p-pr-6{padding-right:3rem !important}.p-pl-0{padding-left:0 !important}.p-pl-1{padding-left:.25rem !important}.p-pl-2{padding-left:.5rem !important}.p-pl-3{padding-left:1rem !important}.p-pl-4{padding-left:1.5rem !important}.p-pl-5{padding-left:2rem !important}.p-pl-6{padding-left:3rem !important}.p-pb-0{padding-bottom:0 !important}.p-pb-1{padding-bottom:.25rem !important}.p-pb-2{padding-bottom:.5rem !important}.p-pb-3{padding-bottom:1rem !important}.p-pb-4{padding-bottom:1.5rem !important}.p-pb-5{padding-bottom:2rem !important}.p-pb-6{padding-bottom:3rem !important}.p-px-0{padding-left:0 !important;padding-right:0 !important}.p-px-1{padding-left:.25rem !important;padding-right:.25rem !important}.p-px-2{padding-left:.5rem !important;padding-right:.5rem !important}.p-px-3{padding-left:1rem !important;padding-right:1rem !important}.p-px-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.p-px-5{padding-left:2rem !important;padding-right:2rem !important}.p-px-6{padding-left:3rem !important;padding-right:3rem !important}.p-py-0{padding-top:0 !important;padding-bottom:0 !important}.p-py-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.p-py-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.p-py-3{padding-top:1rem !important;padding-bottom:1rem !important}.p-py-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.p-py-5{padding-top:2rem !important;padding-bottom:2rem !important}.p-py-6{padding-top:3rem !important;padding-bottom:3rem !important}.p-p-0{padding:0 !important}.p-p-1{padding:.25rem !important}.p-p-2{padding:.5rem !important}.p-p-3{padding:1rem !important}.p-p-4{padding:1.5rem !important}.p-p-5{padding:2rem !important}.p-p-6{padding:3rem !important}@media screen and (min-width: 576px){.p-pt-sm-0{padding-top:0 !important}.p-pt-sm-1{padding-top:.25rem !important}.p-pt-sm-2{padding-top:.5rem !important}.p-pt-sm-3{padding-top:1rem !important}.p-pt-sm-4{padding-top:1.5rem !important}.p-pt-sm-5{padding-top:2rem !important}.p-pt-sm-6{padding-top:3rem !important}.p-pr-sm-0{padding-right:0 !important}.p-pr-sm-1{padding-right:.25rem !important}.p-pr-sm-2{padding-right:.5rem !important}.p-pr-sm-3{padding-right:1rem !important}.p-pr-sm-4{padding-right:1.5rem !important}.p-pr-sm-5{padding-right:2rem !important}.p-pr-sm-6{padding-right:3rem !important}.p-pl-sm-0{padding-left:0 !important}.p-pl-sm-1{padding-left:.25rem !important}.p-pl-sm-2{padding-left:.5rem !important}.p-pl-sm-3{padding-left:1rem !important}.p-pl-sm-4{padding-left:1.5rem !important}.p-pl-sm-5{padding-left:2rem !important}.p-pl-sm-6{padding-left:3rem !important}.p-pb-sm-0{padding-bottom:0 !important}.p-pb-sm-1{padding-bottom:.25rem !important}.p-pb-sm-2{padding-bottom:.5rem !important}.p-pb-sm-3{padding-bottom:1rem !important}.p-pb-sm-4{padding-bottom:1.5rem !important}.p-pb-sm-5{padding-bottom:2rem !important}.p-pb-sm-6{padding-bottom:3rem !important}.p-px-sm-0{padding-left:0 !important;padding-right:0 !important}.p-px-sm-1{padding-left:.25rem !important;padding-right:.25rem !important}.p-px-sm-2{padding-left:.5rem !important;padding-right:.5rem !important}.p-px-sm-3{padding-left:1rem !important;padding-right:1rem !important}.p-px-sm-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.p-px-sm-5{padding-left:2rem !important;padding-right:2rem !important}.p-px-sm-6{padding-left:3rem !important;padding-right:3rem !important}.p-py-sm-0{padding-top:0 !important;padding-bottom:0 !important}.p-py-sm-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.p-py-sm-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.p-py-sm-3{padding-top:1rem !important;padding-bottom:1rem !important}.p-py-sm-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.p-py-sm-5{padding-top:2rem !important;padding-bottom:2rem !important}.p-py-sm-6{padding-top:3rem !important;padding-bottom:3rem !important}.p-p-sm-0{padding:0 !important}.p-p-sm-1{padding:.25rem !important}.p-p-sm-2{padding:.5rem !important}.p-p-sm-3{padding:1rem !important}.p-p-sm-4{padding:1.5rem !important}.p-p-sm-5{padding:2rem !important}.p-p-sm-6{padding:3rem !important}}@media screen and (min-width: 768px){.p-pt-md-0{padding-top:0 !important}.p-pt-md-1{padding-top:.25rem !important}.p-pt-md-2{padding-top:.5rem !important}.p-pt-md-3{padding-top:1rem !important}.p-pt-md-4{padding-top:1.5rem !important}.p-pt-md-5{padding-top:2rem !important}.p-pt-md-6{padding-top:3rem !important}.p-pr-md-0{padding-right:0 !important}.p-pr-md-1{padding-right:.25rem !important}.p-pr-md-2{padding-right:.5rem !important}.p-pr-md-3{padding-right:1rem !important}.p-pr-md-4{padding-right:1.5rem !important}.p-pr-md-5{padding-right:2rem !important}.p-pr-md-6{padding-right:3rem !important}.p-pl-md-0{padding-left:0 !important}.p-pl-md-1{padding-left:.25rem !important}.p-pl-md-2{padding-left:.5rem !important}.p-pl-md-3{padding-left:1rem !important}.p-pl-md-4{padding-left:1.5rem !important}.p-pl-md-5{padding-left:2rem !important}.p-pl-md-6{padding-left:3rem !important}.p-pb-md-0{padding-bottom:0 !important}.p-pb-md-1{padding-bottom:.25rem !important}.p-pb-md-2{padding-bottom:.5rem !important}.p-pb-md-3{padding-bottom:1rem !important}.p-pb-md-4{padding-bottom:1.5rem !important}.p-pb-md-5{padding-bottom:2rem !important}.p-pb-md-6{padding-bottom:3rem !important}.p-px-md-0{padding-left:0 !important;padding-right:0 !important}.p-px-md-1{padding-left:.25rem !important;padding-right:.25rem !important}.p-px-md-2{padding-left:.5rem !important;padding-right:.5rem !important}.p-px-md-3{padding-left:1rem !important;padding-right:1rem !important}.p-px-md-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.p-px-md-5{padding-left:2rem !important;padding-right:2rem !important}.p-px-md-6{padding-left:3rem !important;padding-right:3rem !important}.p-py-md-0{padding-top:0 !important;padding-bottom:0 !important}.p-py-md-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.p-py-md-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.p-py-md-3{padding-top:1rem !important;padding-bottom:1rem !important}.p-py-md-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.p-py-md-5{padding-top:2rem !important;padding-bottom:2rem !important}.p-py-md-6{padding-top:3rem !important;padding-bottom:3rem !important}.p-p-md-0{padding:0 !important}.p-p-md-1{padding:.25rem !important}.p-p-md-2{padding:.5rem !important}.p-p-md-3{padding:1rem !important}.p-p-md-4{padding:1.5rem !important}.p-p-md-5{padding:2rem !important}.p-p-md-6{padding:3rem !important}}@media screen and (min-width: 992px){.p-pt-lg-0{padding-top:0 !important}.p-pt-lg-1{padding-top:.25rem !important}.p-pt-lg-2{padding-top:.5rem !important}.p-pt-lg-3{padding-top:1rem !important}.p-pt-lg-4{padding-top:1.5rem !important}.p-pt-lg-5{padding-top:2rem !important}.p-pt-lg-6{padding-top:3rem !important}.p-pt-lg-auto{padding-top:3rem !important}.p-pr-lg-0{padding-right:0 !important}.p-pr-lg-1{padding-right:.25rem !important}.p-pr-lg-2{padding-right:.5rem !important}.p-pr-lg-3{padding-right:1rem !important}.p-pr-lg-4{padding-right:1.5rem !important}.p-pr-lg-5{padding-right:2rem !important}.p-pr-lg-6{padding-right:3rem !important}.p-pl-lg-0{padding-left:0 !important}.p-pl-lg-1{padding-left:.25rem !important}.p-pl-lg-2{padding-left:.5rem !important}.p-pl-lg-3{padding-left:1rem !important}.p-pl-lg-4{padding-left:1.5rem !important}.p-pl-lg-5{padding-left:2rem !important}.p-pl-lg-6{padding-left:3rem !important}.p-pb-lg-0{padding-bottom:0 !important}.p-pb-lg-1{padding-bottom:.25rem !important}.p-pb-lg-2{padding-bottom:.5rem !important}.p-pb-lg-3{padding-bottom:1rem !important}.p-pb-lg-4{padding-bottom:1.5rem !important}.p-pb-lg-5{padding-bottom:2rem !important}.p-pb-lg-6{padding-bottom:3rem !important}.p-px-lg-0{padding-left:0 !important;padding-right:0 !important}.p-px-lg-1{padding-left:.25rem !important;padding-right:.25rem !important}.p-px-lg-2{padding-left:.5rem !important;padding-right:.5rem !important}.p-px-lg-3{padding-left:1rem !important;padding-right:1rem !important}.p-px-lg-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.p-px-lg-5{padding-left:2rem !important;padding-right:2rem !important}.p-px-lg-6{padding-left:3rem !important;padding-right:3rem !important}.p-py-lg-0{padding-top:0 !important;padding-bottom:0 !important}.p-py-lg-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.p-py-lg-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.p-py-lg-3{padding-top:1rem !important;padding-bottom:1rem !important}.p-py-lg-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.p-py-lg-5{padding-top:2rem !important;padding-bottom:2rem !important}.p-py-lg-6{padding-top:3rem !important;padding-bottom:3rem !important}.p-p-lg-0{padding:0 !important}.p-p-lg-1{padding:.25rem !important}.p-p-lg-2{padding:.5rem !important}.p-p-lg-3{padding:1rem !important}.p-p-lg-4{padding:1.5rem !important}.p-p-lg-5{padding:2rem !important}.p-p-lg-6{padding:3rem !important}}@media screen and (min-width: 1200px){.p-pt-xl-0{padding-top:0 !important}.p-pt-xl-1{padding-top:.25rem !important}.p-pt-xl-2{padding-top:.5rem !important}.p-pt-xl-3{padding-top:1rem !important}.p-pt-xl-4{padding-top:1.5rem !important}.p-pt-xl-5{padding-top:2rem !important}.p-pt-xl-6{padding-top:3rem !important}.p-pr-xl-0{padding-right:0 !important}.p-pr-xl-1{padding-right:.25rem !important}.p-pr-xl-2{padding-right:.5rem !important}.p-pr-xl-3{padding-right:1rem !important}.p-pr-xl-4{padding-right:1.5rem !important}.p-pr-xl-5{padding-right:2rem !important}.p-pr-xl-6{padding-right:3rem !important}.p-pl-xl-0{padding-left:0 !important}.p-pl-xl-1{padding-left:.25rem !important}.p-pl-xl-2{padding-left:.5rem !important}.p-pl-xl-3{padding-left:1rem !important}.p-pl-xl-4{padding-left:1.5rem !important}.p-pl-xl-5{padding-left:2rem !important}.p-pl-xl-6{padding-left:3rem !important}.p-pb-xl-0{padding-bottom:0 !important}.p-pb-xl-1{padding-bottom:.25rem !important}.p-pb-xl-2{padding-bottom:.5rem !important}.p-pb-xl-3{padding-bottom:1rem !important}.p-pb-xl-4{padding-bottom:1.5rem !important}.p-pb-xl-5{padding-bottom:2rem !important}.p-pb-xl-6{padding-bottom:3rem !important}.p-px-xl-0{padding-left:0 !important;padding-right:0 !important}.p-px-xl-1{padding-left:.25rem !important;padding-right:.25rem !important}.p-px-xl-2{padding-left:.5rem !important;padding-right:.5rem !important}.p-px-xl-3{padding-left:1rem !important;padding-right:1rem !important}.p-px-xl-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.p-px-xl-5{padding-left:2rem !important;padding-right:2rem !important}.p-px-xl-6{padding-left:3rem !important;padding-right:3rem !important}.p-py-xl-0{padding-top:0 !important;padding-bottom:0 !important}.p-py-xl-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.p-py-xl-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.p-py-xl-3{padding-top:1rem !important;padding-bottom:1rem !important}.p-py-xl-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.p-py-xl-5{padding-top:2rem !important;padding-bottom:2rem !important}.p-py-xl-6{padding-top:3rem !important;padding-bottom:3rem !important}.p-p-xl-0{padding:0 !important}.p-p-xl-1{padding:.25rem !important}.p-p-xl-2{padding:.5rem !important}.p-p-xl-3{padding:1rem !important}.p-p-xl-4{padding:1.5rem !important}.p-p-xl-5{padding:2rem !important}.p-p-xl-6{padding:3rem !important}}.p-mt-0{margin-top:0 !important}.p-mt-1{margin-top:.25rem !important}.p-mt-2{margin-top:.5rem !important}.p-mt-3{margin-top:1rem !important}.p-mt-4{margin-top:1.5rem !important}.p-mt-5{margin-top:2rem !important}.p-mt-6{margin-top:3rem !important}.p-mt-auto{margin-top:auto !important}.p-mr-0{margin-right:0 !important}.p-mr-1{margin-right:.25rem !important}.p-mr-2{margin-right:.5rem !important}.p-mr-3{margin-right:1rem !important}.p-mr-4{margin-right:1.5rem !important}.p-mr-5{margin-right:2rem !important}.p-mr-6{margin-right:3rem !important}.p-mr-auto{margin-right:auto !important}.p-ml-0{margin-left:0 !important}.p-ml-1{margin-left:.25rem !important}.p-ml-2{margin-left:.5rem !important}.p-ml-3{margin-left:1rem !important}.p-ml-4{margin-left:1.5rem !important}.p-ml-5{margin-left:2rem !important}.p-ml-6{margin-left:3rem !important}.p-ml-auto{margin-left:auto !important}.p-mb-0{margin-bottom:0 !important}.p-mb-1{margin-bottom:.25rem !important}.p-mb-2{margin-bottom:.5rem !important}.p-mb-3{margin-bottom:1rem !important}.p-mb-4{margin-bottom:1.5rem !important}.p-mb-5{margin-bottom:2rem !important}.p-mb-6{margin-bottom:3rem !important}.p-mb-auto{margin-bottom:auto !important}.p-mx-0{margin-left:0 !important;margin-right:0 !important}.p-mx-1{margin-left:.25rem !important;margin-right:.25rem !important}.p-mx-2{margin-left:.5rem !important;margin-right:.5rem !important}.p-mx-3{margin-left:1rem !important;margin-right:1rem !important}.p-mx-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.p-mx-5{margin-left:2rem !important;margin-right:2rem !important}.p-mx-6{margin-left:3rem !important;margin-right:3rem !important}.p-mx-auto{margin-left:auto !important;margin-right:auto !important}.p-my-0{margin-top:0 !important;margin-bottom:0 !important}.p-my-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.p-my-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.p-my-3{margin-top:1rem !important;margin-bottom:1rem !important}.p-my-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.p-my-5{margin-top:2rem !important;margin-bottom:2rem !important}.p-my-6{margin-top:3rem !important;margin-bottom:3rem !important}.p-my-auto{margin-top:auto !important;margin-bottom:auto !important}.p-m-0{margin:0 !important}.p-m-1{margin:.25rem !important}.p-m-2{margin:.5rem !important}.p-m-3{margin:1rem !important}.p-m-4{margin:1.5rem !important}.p-m-5{margin:2rem !important}.p-m-6{margin:3rem !important}.p-m-auto{margin:auto !important}@media screen and (min-width: 576px){.p-mt-sm-0{margin-top:0 !important}.p-mt-sm-1{margin-top:.25rem !important}.p-mt-sm-2{margin-top:.5rem !important}.p-mt-sm-3{margin-top:1rem !important}.p-mt-sm-4{margin-top:1.5rem !important}.p-mt-sm-5{margin-top:2rem !important}.p-mt-sm-6{margin-top:3rem !important}.p-mt-sm-auto{margin-top:3rem !important}.p-mr-sm-0{margin-right:0 !important}.p-mr-sm-1{margin-right:.25rem !important}.p-mr-sm-2{margin-right:.5rem !important}.p-mr-sm-3{margin-right:1rem !important}.p-mr-sm-4{margin-right:1.5rem !important}.p-mr-sm-5{margin-right:2rem !important}.p-mr-sm-6{margin-right:3rem !important}.p-mr-sm-auto{margin-right:auto !important}.p-ml-sm-0{margin-left:0 !important}.p-ml-sm-1{margin-left:.25rem !important}.p-ml-sm-2{margin-left:.5rem !important}.p-ml-sm-3{margin-left:1rem !important}.p-ml-sm-4{margin-left:1.5rem !important}.p-ml-sm-5{margin-left:2rem !important}.p-ml-sm-6{margin-left:3rem !important}.p-ml-sm-auto{margin-left:auto !important}.p-mb-sm-0{margin-bottom:0 !important}.p-mb-sm-1{margin-bottom:.25rem !important}.p-mb-sm-2{margin-bottom:.5rem !important}.p-mb-sm-3{margin-bottom:1rem !important}.p-mb-sm-4{margin-bottom:1.5rem !important}.p-mb-sm-5{margin-bottom:2rem !important}.p-mb-sm-6{margin-bottom:3rem !important}.p-mb-sm-auto{margin-bottom:auto !important}.p-mx-sm-0{margin-left:0 !important;margin-right:0 !important}.p-mx-sm-1{margin-left:.25rem !important;margin-right:.25rem !important}.p-mx-sm-2{margin-left:.5rem !important;margin-right:.5rem !important}.p-mx-sm-3{margin-left:1rem !important;margin-right:1rem !important}.p-mx-sm-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.p-mx-sm-5{margin-left:2rem !important;margin-right:2rem !important}.p-mx-sm-6{margin-left:3rem !important;margin-right:3rem !important}.p-mx-sm-auto{margin-left:auto !important;margin-right:auto !important}.p-my-sm-0{margin-top:0 !important;margin-bottom:0 !important}.p-my-sm-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.p-my-sm-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.p-my-sm-3{margin-top:1rem !important;margin-bottom:1rem !important}.p-my-sm-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.p-my-sm-5{margin-top:2rem !important;margin-bottom:2rem !important}.p-my-sm-6{margin-top:3rem !important;margin-bottom:3rem !important}.p-my-sm-auto{margin-top:auto !important;margin-bottom:auto !important}.p-m-sm-0{margin:0 !important}.p-m-sm-1{margin:.25rem !important}.p-m-sm-2{margin:.5rem !important}.p-m-sm-3{margin:1rem !important}.p-m-sm-4{margin:1.5rem !important}.p-m-sm-5{margin:2rem !important}.p-m-sm-6{margin:3rem !important}.p-m-sm-auto{margin:auto !important}}@media screen and (min-width: 768px){.p-mt-md-0{margin-top:0 !important}.p-mt-md-1{margin-top:.25rem !important}.p-mt-md-2{margin-top:.5rem !important}.p-mt-md-3{margin-top:1rem !important}.p-mt-md-4{margin-top:1.5rem !important}.p-mt-md-5{margin-top:2rem !important}.p-mt-md-6{margin-top:3rem !important}.p-mt-md-auto{margin-top:3rem !important}.p-mr-md-0{margin-right:0 !important}.p-mr-md-1{margin-right:.25rem !important}.p-mr-md-2{margin-right:.5rem !important}.p-mr-md-3{margin-right:1rem !important}.p-mr-md-4{margin-right:1.5rem !important}.p-mr-md-5{margin-right:2rem !important}.p-mr-md-6{margin-right:3rem !important}.p-mr-md-auto{margin-right:auto !important}.p-ml-md-0{margin-left:0 !important}.p-ml-md-1{margin-left:.25rem !important}.p-ml-md-2{margin-left:.5rem !important}.p-ml-md-3{margin-left:1rem !important}.p-ml-md-4{margin-left:1.5rem !important}.p-ml-md-5{margin-left:2rem !important}.p-ml-md-6{margin-left:3rem !important}.p-ml-md-auto{margin-left:auto !important}.p-mb-md-0{margin-bottom:0 !important}.p-mb-md-1{margin-bottom:.25rem !important}.p-mb-md-2{margin-bottom:.5rem !important}.p-mb-md-3{margin-bottom:1rem !important}.p-mb-md-4{margin-bottom:1.5rem !important}.p-mb-md-5{margin-bottom:2rem !important}.p-mb-md-6{margin-bottom:3rem !important}.p-mb-md-auto{margin-bottom:auto !important}.p-mx-md-0{margin-left:0 !important;margin-right:0 !important}.p-mx-md-1{margin-left:.25rem !important;margin-right:.25rem !important}.p-mx-md-2{margin-left:.5rem !important;margin-right:.5rem !important}.p-mx-md-3{margin-left:1rem !important;margin-right:1rem !important}.p-mx-md-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.p-mx-md-5{margin-left:2rem !important;margin-right:2rem !important}.p-mx-md-6{margin-left:3rem !important;margin-right:3rem !important}.p-mx-md-auto{margin-left:auto !important;margin-right:auto !important}.p-my-md-0{margin-top:0 !important;margin-bottom:0 !important}.p-my-md-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.p-my-md-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.p-my-md-3{margin-top:1rem !important;margin-bottom:1rem !important}.p-my-md-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.p-my-md-5{margin-top:2rem !important;margin-bottom:2rem !important}.p-my-md-6{margin-top:3rem !important;margin-bottom:3rem !important}.p-my-md-auto{margin-top:auto !important;margin-bottom:auto !important}.p-m-md-0{margin:0 !important}.p-m-md-1{margin:.25rem !important}.p-m-md-2{margin:.5rem !important}.p-m-md-3{margin:1rem !important}.p-m-md-4{margin:1.5rem !important}.p-m-md-5{margin:2rem !important}.p-m-md-6{margin:3rem !important}.p-m-md-auto{margin:auto !important}}@media screen and (min-width: 992px){.p-mt-lg-0{margin-top:0 !important}.p-mt-lg-1{margin-top:.25rem !important}.p-mt-lg-2{margin-top:.5rem !important}.p-mt-lg-3{margin-top:1rem !important}.p-mt-lg-4{margin-top:1.5rem !important}.p-mt-lg-5{margin-top:2rem !important}.p-mt-lg-6{margin-top:3rem !important}.p-mt-lg-auto{margin-top:3rem !important}.p-mr-lg-0{margin-right:0 !important}.p-mr-lg-1{margin-right:.25rem !important}.p-mr-lg-2{margin-right:.5rem !important}.p-mr-lg-3{margin-right:1rem !important}.p-mr-lg-4{margin-right:1.5rem !important}.p-mr-lg-5{margin-right:2rem !important}.p-mr-lg-6{margin-right:3rem !important}.p-mr-lg-auto{margin-right:auto !important}.p-ml-lg-0{margin-left:0 !important}.p-ml-lg-1{margin-left:.25rem !important}.p-ml-lg-2{margin-left:.5rem !important}.p-ml-lg-3{margin-left:1rem !important}.p-ml-lg-4{margin-left:1.5rem !important}.p-ml-lg-5{margin-left:2rem !important}.p-ml-lg-6{margin-left:3rem !important}.p-ml-lg-auto{margin-left:auto !important}.p-mb-lg-0{margin-bottom:0 !important}.p-mb-lg-1{margin-bottom:.25rem !important}.p-mb-lg-2{margin-bottom:.5rem !important}.p-mb-lg-3{margin-bottom:1rem !important}.p-mb-lg-4{margin-bottom:1.5rem !important}.p-mb-lg-5{margin-bottom:2rem !important}.p-mb-lg-6{margin-bottom:3rem !important}.p-mb-lg-auto{margin-bottom:auto !important}.p-mx-lg-0{margin-left:0 !important;margin-right:0 !important}.p-mx-lg-1{margin-left:.25rem !important;margin-right:.25rem !important}.p-mx-lg-2{margin-left:.5rem !important;margin-right:.5rem !important}.p-mx-lg-3{margin-left:1rem !important;margin-right:1rem !important}.p-mx-lg-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.p-mx-lg-5{margin-left:2rem !important;margin-right:2rem !important}.p-mx-lg-6{margin-left:3rem !important;margin-right:3rem !important}.p-mx-lg-auto{margin-left:auto !important;margin-right:auto !important}.p-my-lg-0{margin-top:0 !important;margin-bottom:0 !important}.p-my-lg-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.p-my-lg-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.p-my-lg-3{margin-top:1rem !important;margin-bottom:1rem !important}.p-my-lg-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.p-my-lg-5{margin-top:2rem !important;margin-bottom:2rem !important}.p-my-lg-6{margin-top:3rem !important;margin-bottom:3rem !important}.p-my-lg-auto{margin-top:auto !important;margin-bottom:auto !important}.p-m-lg-0{margin:0 !important}.p-m-lg-1{margin:.25rem !important}.p-m-lg-2{margin:.5rem !important}.p-m-lg-3{margin:1rem !important}.p-m-lg-4{margin:1.5rem !important}.p-m-lg-5{margin:2rem !important}.p-m-lg-6{margin:3rem !important}.p-m-lg-auto{margin:auto !important}}@media screen and (min-width: 1200px){.p-mt-xl-0{margin-top:0 !important}.p-mt-xl-1{margin-top:.25rem !important}.p-mt-xl-2{margin-top:.5rem !important}.p-mt-xl-3{margin-top:1rem !important}.p-mt-xl-4{margin-top:1.5rem !important}.p-mt-xl-5{margin-top:2rem !important}.p-mt-xl-6{margin-top:3rem !important}.p-mt-xl-auto{margin-top:3rem !important}.p-mr-xl-0{margin-right:0 !important}.p-mr-xl-1{margin-right:.25rem !important}.p-mr-xl-2{margin-right:.5rem !important}.p-mr-xl-3{margin-right:1rem !important}.p-mr-xl-4{margin-right:1.5rem !important}.p-mr-xl-5{margin-right:2rem !important}.p-mr-xl-6{margin-right:3rem !important}.p-mr-xl-auto{margin-right:auto !important}.p-ml-xl-0{margin-left:0 !important}.p-ml-xl-1{margin-left:.25rem !important}.p-ml-xl-2{margin-left:.5rem !important}.p-ml-xl-3{margin-left:1rem !important}.p-ml-xl-4{margin-left:1.5rem !important}.p-ml-xl-5{margin-left:2rem !important}.p-ml-xl-6{margin-left:3rem !important}.p-ml-xl-auto{margin-left:auto !important}.p-mb-xl-0{margin-bottom:0 !important}.p-mb-xl-1{margin-bottom:.25rem !important}.p-mb-xl-2{margin-bottom:.5rem !important}.p-mb-xl-3{margin-bottom:1rem !important}.p-mb-xl-4{margin-bottom:1.5rem !important}.p-mb-xl-5{margin-bottom:2rem !important}.p-mb-xl-6{margin-bottom:3rem !important}.p-mb-xl-auto{margin-bottom:auto !important}.p-mx-xl-0{margin-left:0 !important;margin-right:0 !important}.p-mx-xl-1{margin-left:.25rem !important;margin-right:.25rem !important}.p-mx-xl-2{margin-left:.5rem !important;margin-right:.5rem !important}.p-mx-xl-3{margin-left:1rem !important;margin-right:1rem !important}.p-mx-xl-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.p-mx-xl-5{margin-left:2rem !important;margin-right:2rem !important}.p-mx-xl-6{margin-left:3rem !important;margin-right:3rem !important}.p-mx-xl-auto{margin-left:auto !important;margin-right:auto !important}.p-my-xl-0{margin-top:0 !important;margin-bottom:0 !important}.p-my-xl-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.p-my-xl-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.p-my-xl-3{margin-top:1rem !important;margin-bottom:1rem !important}.p-my-xl-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.p-my-xl-5{margin-top:2rem !important;margin-bottom:2rem !important}.p-my-xl-6{margin-top:3rem !important;margin-bottom:3rem !important}.p-my-xl-auto{margin-top:auto !important;margin-bottom:auto !important}.p-m-xl-0{margin:0 !important}.p-m-xl-1{margin:.25rem !important}.p-m-xl-2{margin:.5rem !important}.p-m-xl-3{margin:1rem !important}.p-m-xl-4{margin:1.5rem !important}.p-m-xl-5{margin:2rem !important}.p-m-xl-6{margin:3rem !important}.p-m-xl-auto{margin:auto !important}}.p-shadow-1{box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)}.p-shadow-2{box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)}.p-shadow-3{box-shadow:0 3px 3px -2px rgba(0,0,0,.2),0 3px 4px 0 rgba(0,0,0,.14),0 1px 8px 0 rgba(0,0,0,.12)}.p-shadow-4{box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)}.p-shadow-5{box-shadow:0 3px 5px -1px rgba(0,0,0,.2),0 5px 8px 0 rgba(0,0,0,.14),0 1px 14px 0 rgba(0,0,0,.12)}.p-shadow-6{box-shadow:0 3px 5px -1px rgba(0,0,0,.2),0 6px 10px 0 rgba(0,0,0,.14),0 1px 18px 0 rgba(0,0,0,.12)}.p-shadow-7{box-shadow:0 4px 5px -2px rgba(0,0,0,.2),0 7px 10px 1px rgba(0,0,0,.14),0 2px 16px 1px rgba(0,0,0,.12)}.p-shadow-8{box-shadow:0 5px 5px -3px rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12)}.p-shadow-9{box-shadow:0 5px 6px -3px rgba(0,0,0,.2),0 9px 12px 1px rgba(0,0,0,.14),0 3px 16px 2px rgba(0,0,0,.12)}.p-shadow-10{box-shadow:0 6px 6px -3px rgba(0,0,0,.2),0 10px 14px 1px rgba(0,0,0,.14),0 4px 18px 3px rgba(0,0,0,.12)}.p-shadow-11{box-shadow:0 6px 7px -4px rgba(0,0,0,.2),0 11px 15px 1px rgba(0,0,0,.14),0 4px 20px 3px rgba(0,0,0,.12)}.p-shadow-12{box-shadow:0 7px 8px -4px rgba(0,0,0,.2),0 12px 17px 2px rgba(0,0,0,.14),0 5px 22px 4px rgba(0,0,0,.12)}.p-shadow-13{box-shadow:0 7px 8px -4px rgba(0,0,0,.2),0 13px 19px 2px rgba(0,0,0,.14),0 5px 24px 4px rgba(0,0,0,.12)}.p-shadow-14{box-shadow:0 7px 9px -4px rgba(0,0,0,.2),0 14px 21px 2px rgba(0,0,0,.14),0 5px 26px 4px rgba(0,0,0,.12)}.p-shadow-15{box-shadow:0 8px 9px -5px rgba(0,0,0,.2),0 15px 22px 2px rgba(0,0,0,.14),0 6px 28px 5px rgba(0,0,0,.12)}.p-shadow-16{box-shadow:0 8px 10px -5px rgba(0,0,0,.2),0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12)}.p-shadow-17{box-shadow:0 8px 11px -5px rgba(0,0,0,.2),0 17px 26px 2px rgba(0,0,0,.14),0 6px 32px 5px rgba(0,0,0,.12)}.p-shadow-18{box-shadow:0 9px 11px -5px rgba(0,0,0,.2),0 18px 28px 2px rgba(0,0,0,.14),0 7px 34px 6px rgba(0,0,0,.12)}.p-shadow-19{box-shadow:0 9px 12px -6px rgba(0,0,0,.2),0 19px 29px 2px rgba(0,0,0,.14),0 7px 36px 6px rgba(0,0,0,.12)}.p-shadow-20{box-shadow:0 10px 13px -6px rgba(0,0,0,.2),0 20px 31px 3px rgba(0,0,0,.14),0 8px 38px 7px rgba(0,0,0,.12)}.p-shadow-21{box-shadow:0 10px 13px -6px rgba(0,0,0,.2),0 21px 33px 3px rgba(0,0,0,.14),0 8px 40px 7px rgba(0,0,0,.12)}.p-shadow-22{box-shadow:0 10px 14px -6px rgba(0,0,0,.2),0 22px 35px 3px rgba(0,0,0,.14),0 8px 42px 7px rgba(0,0,0,.12)}.p-shadow-23{box-shadow:0 11px 14px -7px rgba(0,0,0,.2),0 23px 36px 3px rgba(0,0,0,.14),0 9px 44px 8px rgba(0,0,0,.12)}.p-shadow-24{box-shadow:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12)} \ No newline at end of file diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/css/primeflex.min.css b/src/main/resources/META-INF/resources/resources/freya-layout/css/primeflex.min.css new file mode 100644 index 0000000..bfe2752 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/css/primeflex.min.css @@ -0,0 +1 @@ +.grid{display:flex;flex-wrap:wrap;margin-right:-0.5rem;margin-left:-0.5rem;margin-top:-0.5rem}.grid>.col,.grid>[class*=col]{box-sizing:border-box}.grid-nogutter{margin-right:0;margin-left:0;margin-top:0}.grid-nogutter>.col,.grid-nogutter>[class*=col-]{padding:0}.col{flex-grow:1;flex-basis:0;padding:.5rem}.col-fixed{flex:0 0 auto;padding:.5rem}.col-1{flex:0 0 auto;padding:.5rem;width:8.3333%}.col-2{flex:0 0 auto;padding:.5rem;width:16.6667%}.col-3{flex:0 0 auto;padding:.5rem;width:25%}.col-4{flex:0 0 auto;padding:.5rem;width:33.3333%}.col-5{flex:0 0 auto;padding:.5rem;width:41.6667%}.col-6{flex:0 0 auto;padding:.5rem;width:50%}.col-7{flex:0 0 auto;padding:.5rem;width:58.3333%}.col-8{flex:0 0 auto;padding:.5rem;width:66.6667%}.col-9{flex:0 0 auto;padding:.5rem;width:75%}.col-10{flex:0 0 auto;padding:.5rem;width:83.3333%}.col-11{flex:0 0 auto;padding:.5rem;width:91.6667%}.col-12{flex:0 0 auto;padding:.5rem;width:100%}@media screen and (min-width: 576px){.sm\:col{flex-grow:1;flex-basis:0;padding:.5rem}.sm\:col-fixed{flex:0 0 auto;padding:.5rem}.sm\:col-1{flex:0 0 auto;padding:.5rem;width:8.3333%}.sm\:col-2{flex:0 0 auto;padding:.5rem;width:16.6667%}.sm\:col-3{flex:0 0 auto;padding:.5rem;width:25%}.sm\:col-4{flex:0 0 auto;padding:.5rem;width:33.3333%}.sm\:col-5{flex:0 0 auto;padding:.5rem;width:41.6667%}.sm\:col-6{flex:0 0 auto;padding:.5rem;width:50%}.sm\:col-7{flex:0 0 auto;padding:.5rem;width:58.3333%}.sm\:col-8{flex:0 0 auto;padding:.5rem;width:66.6667%}.sm\:col-9{flex:0 0 auto;padding:.5rem;width:75%}.sm\:col-10{flex:0 0 auto;padding:.5rem;width:83.3333%}.sm\:col-11{flex:0 0 auto;padding:.5rem;width:91.6667%}.sm\:col-12{flex:0 0 auto;padding:.5rem;width:100%}}@media screen and (min-width: 768px){.md\:col{flex-grow:1;flex-basis:0;padding:.5rem}.md\:col-fixed{flex:0 0 auto;padding:.5rem}.md\:col-1{flex:0 0 auto;padding:.5rem;width:8.3333%}.md\:col-2{flex:0 0 auto;padding:.5rem;width:16.6667%}.md\:col-3{flex:0 0 auto;padding:.5rem;width:25%}.md\:col-4{flex:0 0 auto;padding:.5rem;width:33.3333%}.md\:col-5{flex:0 0 auto;padding:.5rem;width:41.6667%}.md\:col-6{flex:0 0 auto;padding:.5rem;width:50%}.md\:col-7{flex:0 0 auto;padding:.5rem;width:58.3333%}.md\:col-8{flex:0 0 auto;padding:.5rem;width:66.6667%}.md\:col-9{flex:0 0 auto;padding:.5rem;width:75%}.md\:col-10{flex:0 0 auto;padding:.5rem;width:83.3333%}.md\:col-11{flex:0 0 auto;padding:.5rem;width:91.6667%}.md\:col-12{flex:0 0 auto;padding:.5rem;width:100%}}@media screen and (min-width: 992px){.lg\:col{flex-grow:1;flex-basis:0;padding:.5rem}.lg\:col-fixed{flex:0 0 auto;padding:.5rem}.lg\:col-1{flex:0 0 auto;padding:.5rem;width:8.3333%}.lg\:col-2{flex:0 0 auto;padding:.5rem;width:16.6667%}.lg\:col-3{flex:0 0 auto;padding:.5rem;width:25%}.lg\:col-4{flex:0 0 auto;padding:.5rem;width:33.3333%}.lg\:col-5{flex:0 0 auto;padding:.5rem;width:41.6667%}.lg\:col-6{flex:0 0 auto;padding:.5rem;width:50%}.lg\:col-7{flex:0 0 auto;padding:.5rem;width:58.3333%}.lg\:col-8{flex:0 0 auto;padding:.5rem;width:66.6667%}.lg\:col-9{flex:0 0 auto;padding:.5rem;width:75%}.lg\:col-10{flex:0 0 auto;padding:.5rem;width:83.3333%}.lg\:col-11{flex:0 0 auto;padding:.5rem;width:91.6667%}.lg\:col-12{flex:0 0 auto;padding:.5rem;width:100%}}@media screen and (min-width: 1200px){.xl\:col{flex-grow:1;flex-basis:0;padding:.5rem}.xl\:col-fixed{flex:0 0 auto;padding:.5rem}.xl\:col-1{flex:0 0 auto;padding:.5rem;width:8.3333%}.xl\:col-2{flex:0 0 auto;padding:.5rem;width:16.6667%}.xl\:col-3{flex:0 0 auto;padding:.5rem;width:25%}.xl\:col-4{flex:0 0 auto;padding:.5rem;width:33.3333%}.xl\:col-5{flex:0 0 auto;padding:.5rem;width:41.6667%}.xl\:col-6{flex:0 0 auto;padding:.5rem;width:50%}.xl\:col-7{flex:0 0 auto;padding:.5rem;width:58.3333%}.xl\:col-8{flex:0 0 auto;padding:.5rem;width:66.6667%}.xl\:col-9{flex:0 0 auto;padding:.5rem;width:75%}.xl\:col-10{flex:0 0 auto;padding:.5rem;width:83.3333%}.xl\:col-11{flex:0 0 auto;padding:.5rem;width:91.6667%}.xl\:col-12{flex:0 0 auto;padding:.5rem;width:100%}}.col-offset-0{margin-left:0 !important}.col-offset-1{margin-left:8.3333% !important}.col-offset-2{margin-left:16.6667% !important}.col-offset-3{margin-left:25% !important}.col-offset-4{margin-left:33.3333% !important}.col-offset-5{margin-left:41.6667% !important}.col-offset-6{margin-left:50% !important}.col-offset-7{margin-left:58.3333% !important}.col-offset-8{margin-left:66.6667% !important}.col-offset-9{margin-left:75% !important}.col-offset-10{margin-left:83.3333% !important}.col-offset-11{margin-left:91.6667% !important}.col-offset-12{margin-left:100% !important}@media screen and (min-width: 576px){.sm\:col-offset-0{margin-left:0 !important}.sm\:col-offset-1{margin-left:8.3333% !important}.sm\:col-offset-2{margin-left:16.6667% !important}.sm\:col-offset-3{margin-left:25% !important}.sm\:col-offset-4{margin-left:33.3333% !important}.sm\:col-offset-5{margin-left:41.6667% !important}.sm\:col-offset-6{margin-left:50% !important}.sm\:col-offset-7{margin-left:58.3333% !important}.sm\:col-offset-8{margin-left:66.6667% !important}.sm\:col-offset-9{margin-left:75% !important}.sm\:col-offset-10{margin-left:83.3333% !important}.sm\:col-offset-11{margin-left:91.6667% !important}.sm\:col-offset-12{margin-left:100% !important}}@media screen and (min-width: 768px){.md\:col-offset-0{margin-left:0 !important}.md\:col-offset-1{margin-left:8.3333% !important}.md\:col-offset-2{margin-left:16.6667% !important}.md\:col-offset-3{margin-left:25% !important}.md\:col-offset-4{margin-left:33.3333% !important}.md\:col-offset-5{margin-left:41.6667% !important}.md\:col-offset-6{margin-left:50% !important}.md\:col-offset-7{margin-left:58.3333% !important}.md\:col-offset-8{margin-left:66.6667% !important}.md\:col-offset-9{margin-left:75% !important}.md\:col-offset-10{margin-left:83.3333% !important}.md\:col-offset-11{margin-left:91.6667% !important}.md\:col-offset-12{margin-left:100% !important}}@media screen and (min-width: 992px){.lg\:col-offset-0{margin-left:0 !important}.lg\:col-offset-1{margin-left:8.3333% !important}.lg\:col-offset-2{margin-left:16.6667% !important}.lg\:col-offset-3{margin-left:25% !important}.lg\:col-offset-4{margin-left:33.3333% !important}.lg\:col-offset-5{margin-left:41.6667% !important}.lg\:col-offset-6{margin-left:50% !important}.lg\:col-offset-7{margin-left:58.3333% !important}.lg\:col-offset-8{margin-left:66.6667% !important}.lg\:col-offset-9{margin-left:75% !important}.lg\:col-offset-10{margin-left:83.3333% !important}.lg\:col-offset-11{margin-left:91.6667% !important}.lg\:col-offset-12{margin-left:100% !important}}@media screen and (min-width: 1200px){.xl\:col-offset-0{margin-left:0 !important}.xl\:col-offset-1{margin-left:8.3333% !important}.xl\:col-offset-2{margin-left:16.6667% !important}.xl\:col-offset-3{margin-left:25% !important}.xl\:col-offset-4{margin-left:33.3333% !important}.xl\:col-offset-5{margin-left:41.6667% !important}.xl\:col-offset-6{margin-left:50% !important}.xl\:col-offset-7{margin-left:58.3333% !important}.xl\:col-offset-8{margin-left:66.6667% !important}.xl\:col-offset-9{margin-left:75% !important}.xl\:col-offset-10{margin-left:83.3333% !important}.xl\:col-offset-11{margin-left:91.6667% !important}.xl\:col-offset-12{margin-left:100% !important}}.text-0{color:var(--surface-0) !important}.text-50{color:var(--surface-50) !important}.text-100{color:var(--surface-100) !important}.text-200{color:var(--surface-200) !important}.text-300{color:var(--surface-300) !important}.text-400{color:var(--surface-400) !important}.text-500{color:var(--surface-500) !important}.text-600{color:var(--surface-600) !important}.text-700{color:var(--surface-700) !important}.text-800{color:var(--surface-800) !important}.text-900{color:var(--surface-900) !important}.focus\:text-0:focus{color:var(--surface-0) !important}.hover\:text-0:hover{color:var(--surface-0) !important}.active\:text-0:active{color:var(--surface-0) !important}.focus\:text-50:focus{color:var(--surface-50) !important}.hover\:text-50:hover{color:var(--surface-50) !important}.active\:text-50:active{color:var(--surface-50) !important}.focus\:text-100:focus{color:var(--surface-100) !important}.hover\:text-100:hover{color:var(--surface-100) !important}.active\:text-100:active{color:var(--surface-100) !important}.focus\:text-200:focus{color:var(--surface-200) !important}.hover\:text-200:hover{color:var(--surface-200) !important}.active\:text-200:active{color:var(--surface-200) !important}.focus\:text-300:focus{color:var(--surface-300) !important}.hover\:text-300:hover{color:var(--surface-300) !important}.active\:text-300:active{color:var(--surface-300) !important}.focus\:text-400:focus{color:var(--surface-400) !important}.hover\:text-400:hover{color:var(--surface-400) !important}.active\:text-400:active{color:var(--surface-400) !important}.focus\:text-500:focus{color:var(--surface-500) !important}.hover\:text-500:hover{color:var(--surface-500) !important}.active\:text-500:active{color:var(--surface-500) !important}.focus\:text-600:focus{color:var(--surface-600) !important}.hover\:text-600:hover{color:var(--surface-600) !important}.active\:text-600:active{color:var(--surface-600) !important}.focus\:text-700:focus{color:var(--surface-700) !important}.hover\:text-700:hover{color:var(--surface-700) !important}.active\:text-700:active{color:var(--surface-700) !important}.focus\:text-800:focus{color:var(--surface-800) !important}.hover\:text-800:hover{color:var(--surface-800) !important}.active\:text-800:active{color:var(--surface-800) !important}.focus\:text-900:focus{color:var(--surface-900) !important}.hover\:text-900:hover{color:var(--surface-900) !important}.active\:text-900:active{color:var(--surface-900) !important}.surface-0{background-color:var(--surface-0) !important}.surface-50{background-color:var(--surface-50) !important}.surface-100{background-color:var(--surface-100) !important}.surface-200{background-color:var(--surface-200) !important}.surface-300{background-color:var(--surface-300) !important}.surface-400{background-color:var(--surface-400) !important}.surface-500{background-color:var(--surface-500) !important}.surface-600{background-color:var(--surface-600) !important}.surface-700{background-color:var(--surface-700) !important}.surface-800{background-color:var(--surface-800) !important}.surface-900{background-color:var(--surface-900) !important}.focus\:surface-0:focus{background-color:var(--surface-0) !important}.hover\:surface-0:hover{background-color:var(--surface-0) !important}.active\:surface-0:active{background-color:var(--surface-0) !important}.focus\:surface-50:focus{background-color:var(--surface-50) !important}.hover\:surface-50:hover{background-color:var(--surface-50) !important}.active\:surface-50:active{background-color:var(--surface-50) !important}.focus\:surface-100:focus{background-color:var(--surface-100) !important}.hover\:surface-100:hover{background-color:var(--surface-100) !important}.active\:surface-100:active{background-color:var(--surface-100) !important}.focus\:surface-200:focus{background-color:var(--surface-200) !important}.hover\:surface-200:hover{background-color:var(--surface-200) !important}.active\:surface-200:active{background-color:var(--surface-200) !important}.focus\:surface-300:focus{background-color:var(--surface-300) !important}.hover\:surface-300:hover{background-color:var(--surface-300) !important}.active\:surface-300:active{background-color:var(--surface-300) !important}.focus\:surface-400:focus{background-color:var(--surface-400) !important}.hover\:surface-400:hover{background-color:var(--surface-400) !important}.active\:surface-400:active{background-color:var(--surface-400) !important}.focus\:surface-500:focus{background-color:var(--surface-500) !important}.hover\:surface-500:hover{background-color:var(--surface-500) !important}.active\:surface-500:active{background-color:var(--surface-500) !important}.focus\:surface-600:focus{background-color:var(--surface-600) !important}.hover\:surface-600:hover{background-color:var(--surface-600) !important}.active\:surface-600:active{background-color:var(--surface-600) !important}.focus\:surface-700:focus{background-color:var(--surface-700) !important}.hover\:surface-700:hover{background-color:var(--surface-700) !important}.active\:surface-700:active{background-color:var(--surface-700) !important}.focus\:surface-800:focus{background-color:var(--surface-800) !important}.hover\:surface-800:hover{background-color:var(--surface-800) !important}.active\:surface-800:active{background-color:var(--surface-800) !important}.focus\:surface-900:focus{background-color:var(--surface-900) !important}.hover\:surface-900:hover{background-color:var(--surface-900) !important}.active\:surface-900:active{background-color:var(--surface-900) !important}.border-0{border-color:var(--surface-0) !important}.border-50{border-color:var(--surface-50) !important}.border-100{border-color:var(--surface-100) !important}.border-200{border-color:var(--surface-200) !important}.border-300{border-color:var(--surface-300) !important}.border-400{border-color:var(--surface-400) !important}.border-500{border-color:var(--surface-500) !important}.border-600{border-color:var(--surface-600) !important}.border-700{border-color:var(--surface-700) !important}.border-800{border-color:var(--surface-800) !important}.border-900{border-color:var(--surface-900) !important}.focus\:border-0:focus{border-color:var(--surface-0) !important}.hover\:border-0:hover{border-color:var(--surface-0) !important}.active\:border-0:active{border-color:var(--surface-0) !important}.focus\:border-50:focus{border-color:var(--surface-50) !important}.hover\:border-50:hover{border-color:var(--surface-50) !important}.active\:border-50:active{border-color:var(--surface-50) !important}.focus\:border-100:focus{border-color:var(--surface-100) !important}.hover\:border-100:hover{border-color:var(--surface-100) !important}.active\:border-100:active{border-color:var(--surface-100) !important}.focus\:border-200:focus{border-color:var(--surface-200) !important}.hover\:border-200:hover{border-color:var(--surface-200) !important}.active\:border-200:active{border-color:var(--surface-200) !important}.focus\:border-300:focus{border-color:var(--surface-300) !important}.hover\:border-300:hover{border-color:var(--surface-300) !important}.active\:border-300:active{border-color:var(--surface-300) !important}.focus\:border-400:focus{border-color:var(--surface-400) !important}.hover\:border-400:hover{border-color:var(--surface-400) !important}.active\:border-400:active{border-color:var(--surface-400) !important}.focus\:border-500:focus{border-color:var(--surface-500) !important}.hover\:border-500:hover{border-color:var(--surface-500) !important}.active\:border-500:active{border-color:var(--surface-500) !important}.focus\:border-600:focus{border-color:var(--surface-600) !important}.hover\:border-600:hover{border-color:var(--surface-600) !important}.active\:border-600:active{border-color:var(--surface-600) !important}.focus\:border-700:focus{border-color:var(--surface-700) !important}.hover\:border-700:hover{border-color:var(--surface-700) !important}.active\:border-700:active{border-color:var(--surface-700) !important}.focus\:border-800:focus{border-color:var(--surface-800) !important}.hover\:border-800:hover{border-color:var(--surface-800) !important}.active\:border-800:active{border-color:var(--surface-800) !important}.focus\:border-900:focus{border-color:var(--surface-900) !important}.hover\:border-900:hover{border-color:var(--surface-900) !important}.active\:border-900:active{border-color:var(--surface-900) !important}.bg-transparent{background-color:transparent !important}@media screen and (min-width: 576px){.sm\:bg-transparent{background-color:transparent !important}}@media screen and (min-width: 768px){.md\:bg-transparent{background-color:transparent !important}}@media screen and (min-width: 992px){.lg\:bg-transparent{background-color:transparent !important}}@media screen and (min-width: 1200px){.xl\:bg-transparent{background-color:transparent !important}}.border-transparent{border-color:transparent !important}@media screen and (min-width: 576px){.sm\:border-transparent{border-color:transparent !important}}@media screen and (min-width: 768px){.md\:border-transparent{border-color:transparent !important}}@media screen and (min-width: 992px){.lg\:border-transparent{border-color:transparent !important}}@media screen and (min-width: 1200px){.xl\:border-transparent{border-color:transparent !important}}.text-blue-50{color:var(--blue-50) !important}.text-blue-100{color:var(--blue-100) !important}.text-blue-200{color:var(--blue-200) !important}.text-blue-300{color:var(--blue-300) !important}.text-blue-400{color:var(--blue-400) !important}.text-blue-500{color:var(--blue-500) !important}.text-blue-600{color:var(--blue-600) !important}.text-blue-700{color:var(--blue-700) !important}.text-blue-800{color:var(--blue-800) !important}.text-blue-900{color:var(--blue-900) !important}.focus\:text-blue-50:focus{color:var(--blue-50) !important}.focus\:text-blue-100:focus{color:var(--blue-100) !important}.focus\:text-blue-200:focus{color:var(--blue-200) !important}.focus\:text-blue-300:focus{color:var(--blue-300) !important}.focus\:text-blue-400:focus{color:var(--blue-400) !important}.focus\:text-blue-500:focus{color:var(--blue-500) !important}.focus\:text-blue-600:focus{color:var(--blue-600) !important}.focus\:text-blue-700:focus{color:var(--blue-700) !important}.focus\:text-blue-800:focus{color:var(--blue-800) !important}.focus\:text-blue-900:focus{color:var(--blue-900) !important}.hover\:text-blue-50:hover{color:var(--blue-50) !important}.hover\:text-blue-100:hover{color:var(--blue-100) !important}.hover\:text-blue-200:hover{color:var(--blue-200) !important}.hover\:text-blue-300:hover{color:var(--blue-300) !important}.hover\:text-blue-400:hover{color:var(--blue-400) !important}.hover\:text-blue-500:hover{color:var(--blue-500) !important}.hover\:text-blue-600:hover{color:var(--blue-600) !important}.hover\:text-blue-700:hover{color:var(--blue-700) !important}.hover\:text-blue-800:hover{color:var(--blue-800) !important}.hover\:text-blue-900:hover{color:var(--blue-900) !important}.active\:text-blue-50:active{color:var(--blue-50) !important}.active\:text-blue-100:active{color:var(--blue-100) !important}.active\:text-blue-200:active{color:var(--blue-200) !important}.active\:text-blue-300:active{color:var(--blue-300) !important}.active\:text-blue-400:active{color:var(--blue-400) !important}.active\:text-blue-500:active{color:var(--blue-500) !important}.active\:text-blue-600:active{color:var(--blue-600) !important}.active\:text-blue-700:active{color:var(--blue-700) !important}.active\:text-blue-800:active{color:var(--blue-800) !important}.active\:text-blue-900:active{color:var(--blue-900) !important}.text-green-50{color:var(--green-50) !important}.text-green-100{color:var(--green-100) !important}.text-green-200{color:var(--green-200) !important}.text-green-300{color:var(--green-300) !important}.text-green-400{color:var(--green-400) !important}.text-green-500{color:var(--green-500) !important}.text-green-600{color:var(--green-600) !important}.text-green-700{color:var(--green-700) !important}.text-green-800{color:var(--green-800) !important}.text-green-900{color:var(--green-900) !important}.focus\:text-green-50:focus{color:var(--green-50) !important}.focus\:text-green-100:focus{color:var(--green-100) !important}.focus\:text-green-200:focus{color:var(--green-200) !important}.focus\:text-green-300:focus{color:var(--green-300) !important}.focus\:text-green-400:focus{color:var(--green-400) !important}.focus\:text-green-500:focus{color:var(--green-500) !important}.focus\:text-green-600:focus{color:var(--green-600) !important}.focus\:text-green-700:focus{color:var(--green-700) !important}.focus\:text-green-800:focus{color:var(--green-800) !important}.focus\:text-green-900:focus{color:var(--green-900) !important}.hover\:text-green-50:hover{color:var(--green-50) !important}.hover\:text-green-100:hover{color:var(--green-100) !important}.hover\:text-green-200:hover{color:var(--green-200) !important}.hover\:text-green-300:hover{color:var(--green-300) !important}.hover\:text-green-400:hover{color:var(--green-400) !important}.hover\:text-green-500:hover{color:var(--green-500) !important}.hover\:text-green-600:hover{color:var(--green-600) !important}.hover\:text-green-700:hover{color:var(--green-700) !important}.hover\:text-green-800:hover{color:var(--green-800) !important}.hover\:text-green-900:hover{color:var(--green-900) !important}.active\:text-green-50:active{color:var(--green-50) !important}.active\:text-green-100:active{color:var(--green-100) !important}.active\:text-green-200:active{color:var(--green-200) !important}.active\:text-green-300:active{color:var(--green-300) !important}.active\:text-green-400:active{color:var(--green-400) !important}.active\:text-green-500:active{color:var(--green-500) !important}.active\:text-green-600:active{color:var(--green-600) !important}.active\:text-green-700:active{color:var(--green-700) !important}.active\:text-green-800:active{color:var(--green-800) !important}.active\:text-green-900:active{color:var(--green-900) !important}.text-yellow-50{color:var(--yellow-50) !important}.text-yellow-100{color:var(--yellow-100) !important}.text-yellow-200{color:var(--yellow-200) !important}.text-yellow-300{color:var(--yellow-300) !important}.text-yellow-400{color:var(--yellow-400) !important}.text-yellow-500{color:var(--yellow-500) !important}.text-yellow-600{color:var(--yellow-600) !important}.text-yellow-700{color:var(--yellow-700) !important}.text-yellow-800{color:var(--yellow-800) !important}.text-yellow-900{color:var(--yellow-900) !important}.focus\:text-yellow-50:focus{color:var(--yellow-50) !important}.focus\:text-yellow-100:focus{color:var(--yellow-100) !important}.focus\:text-yellow-200:focus{color:var(--yellow-200) !important}.focus\:text-yellow-300:focus{color:var(--yellow-300) !important}.focus\:text-yellow-400:focus{color:var(--yellow-400) !important}.focus\:text-yellow-500:focus{color:var(--yellow-500) !important}.focus\:text-yellow-600:focus{color:var(--yellow-600) !important}.focus\:text-yellow-700:focus{color:var(--yellow-700) !important}.focus\:text-yellow-800:focus{color:var(--yellow-800) !important}.focus\:text-yellow-900:focus{color:var(--yellow-900) !important}.hover\:text-yellow-50:hover{color:var(--yellow-50) !important}.hover\:text-yellow-100:hover{color:var(--yellow-100) !important}.hover\:text-yellow-200:hover{color:var(--yellow-200) !important}.hover\:text-yellow-300:hover{color:var(--yellow-300) !important}.hover\:text-yellow-400:hover{color:var(--yellow-400) !important}.hover\:text-yellow-500:hover{color:var(--yellow-500) !important}.hover\:text-yellow-600:hover{color:var(--yellow-600) !important}.hover\:text-yellow-700:hover{color:var(--yellow-700) !important}.hover\:text-yellow-800:hover{color:var(--yellow-800) !important}.hover\:text-yellow-900:hover{color:var(--yellow-900) !important}.active\:text-yellow-50:active{color:var(--yellow-50) !important}.active\:text-yellow-100:active{color:var(--yellow-100) !important}.active\:text-yellow-200:active{color:var(--yellow-200) !important}.active\:text-yellow-300:active{color:var(--yellow-300) !important}.active\:text-yellow-400:active{color:var(--yellow-400) !important}.active\:text-yellow-500:active{color:var(--yellow-500) !important}.active\:text-yellow-600:active{color:var(--yellow-600) !important}.active\:text-yellow-700:active{color:var(--yellow-700) !important}.active\:text-yellow-800:active{color:var(--yellow-800) !important}.active\:text-yellow-900:active{color:var(--yellow-900) !important}.text-cyan-50{color:var(--cyan-50) !important}.text-cyan-100{color:var(--cyan-100) !important}.text-cyan-200{color:var(--cyan-200) !important}.text-cyan-300{color:var(--cyan-300) !important}.text-cyan-400{color:var(--cyan-400) !important}.text-cyan-500{color:var(--cyan-500) !important}.text-cyan-600{color:var(--cyan-600) !important}.text-cyan-700{color:var(--cyan-700) !important}.text-cyan-800{color:var(--cyan-800) !important}.text-cyan-900{color:var(--cyan-900) !important}.focus\:text-cyan-50:focus{color:var(--cyan-50) !important}.focus\:text-cyan-100:focus{color:var(--cyan-100) !important}.focus\:text-cyan-200:focus{color:var(--cyan-200) !important}.focus\:text-cyan-300:focus{color:var(--cyan-300) !important}.focus\:text-cyan-400:focus{color:var(--cyan-400) !important}.focus\:text-cyan-500:focus{color:var(--cyan-500) !important}.focus\:text-cyan-600:focus{color:var(--cyan-600) !important}.focus\:text-cyan-700:focus{color:var(--cyan-700) !important}.focus\:text-cyan-800:focus{color:var(--cyan-800) !important}.focus\:text-cyan-900:focus{color:var(--cyan-900) !important}.hover\:text-cyan-50:hover{color:var(--cyan-50) !important}.hover\:text-cyan-100:hover{color:var(--cyan-100) !important}.hover\:text-cyan-200:hover{color:var(--cyan-200) !important}.hover\:text-cyan-300:hover{color:var(--cyan-300) !important}.hover\:text-cyan-400:hover{color:var(--cyan-400) !important}.hover\:text-cyan-500:hover{color:var(--cyan-500) !important}.hover\:text-cyan-600:hover{color:var(--cyan-600) !important}.hover\:text-cyan-700:hover{color:var(--cyan-700) !important}.hover\:text-cyan-800:hover{color:var(--cyan-800) !important}.hover\:text-cyan-900:hover{color:var(--cyan-900) !important}.active\:text-cyan-50:active{color:var(--cyan-50) !important}.active\:text-cyan-100:active{color:var(--cyan-100) !important}.active\:text-cyan-200:active{color:var(--cyan-200) !important}.active\:text-cyan-300:active{color:var(--cyan-300) !important}.active\:text-cyan-400:active{color:var(--cyan-400) !important}.active\:text-cyan-500:active{color:var(--cyan-500) !important}.active\:text-cyan-600:active{color:var(--cyan-600) !important}.active\:text-cyan-700:active{color:var(--cyan-700) !important}.active\:text-cyan-800:active{color:var(--cyan-800) !important}.active\:text-cyan-900:active{color:var(--cyan-900) !important}.text-pink-50{color:var(--pink-50) !important}.text-pink-100{color:var(--pink-100) !important}.text-pink-200{color:var(--pink-200) !important}.text-pink-300{color:var(--pink-300) !important}.text-pink-400{color:var(--pink-400) !important}.text-pink-500{color:var(--pink-500) !important}.text-pink-600{color:var(--pink-600) !important}.text-pink-700{color:var(--pink-700) !important}.text-pink-800{color:var(--pink-800) !important}.text-pink-900{color:var(--pink-900) !important}.focus\:text-pink-50:focus{color:var(--pink-50) !important}.focus\:text-pink-100:focus{color:var(--pink-100) !important}.focus\:text-pink-200:focus{color:var(--pink-200) !important}.focus\:text-pink-300:focus{color:var(--pink-300) !important}.focus\:text-pink-400:focus{color:var(--pink-400) !important}.focus\:text-pink-500:focus{color:var(--pink-500) !important}.focus\:text-pink-600:focus{color:var(--pink-600) !important}.focus\:text-pink-700:focus{color:var(--pink-700) !important}.focus\:text-pink-800:focus{color:var(--pink-800) !important}.focus\:text-pink-900:focus{color:var(--pink-900) !important}.hover\:text-pink-50:hover{color:var(--pink-50) !important}.hover\:text-pink-100:hover{color:var(--pink-100) !important}.hover\:text-pink-200:hover{color:var(--pink-200) !important}.hover\:text-pink-300:hover{color:var(--pink-300) !important}.hover\:text-pink-400:hover{color:var(--pink-400) !important}.hover\:text-pink-500:hover{color:var(--pink-500) !important}.hover\:text-pink-600:hover{color:var(--pink-600) !important}.hover\:text-pink-700:hover{color:var(--pink-700) !important}.hover\:text-pink-800:hover{color:var(--pink-800) !important}.hover\:text-pink-900:hover{color:var(--pink-900) !important}.active\:text-pink-50:active{color:var(--pink-50) !important}.active\:text-pink-100:active{color:var(--pink-100) !important}.active\:text-pink-200:active{color:var(--pink-200) !important}.active\:text-pink-300:active{color:var(--pink-300) !important}.active\:text-pink-400:active{color:var(--pink-400) !important}.active\:text-pink-500:active{color:var(--pink-500) !important}.active\:text-pink-600:active{color:var(--pink-600) !important}.active\:text-pink-700:active{color:var(--pink-700) !important}.active\:text-pink-800:active{color:var(--pink-800) !important}.active\:text-pink-900:active{color:var(--pink-900) !important}.text-indigo-50{color:var(--indigo-50) !important}.text-indigo-100{color:var(--indigo-100) !important}.text-indigo-200{color:var(--indigo-200) !important}.text-indigo-300{color:var(--indigo-300) !important}.text-indigo-400{color:var(--indigo-400) !important}.text-indigo-500{color:var(--indigo-500) !important}.text-indigo-600{color:var(--indigo-600) !important}.text-indigo-700{color:var(--indigo-700) !important}.text-indigo-800{color:var(--indigo-800) !important}.text-indigo-900{color:var(--indigo-900) !important}.focus\:text-indigo-50:focus{color:var(--indigo-50) !important}.focus\:text-indigo-100:focus{color:var(--indigo-100) !important}.focus\:text-indigo-200:focus{color:var(--indigo-200) !important}.focus\:text-indigo-300:focus{color:var(--indigo-300) !important}.focus\:text-indigo-400:focus{color:var(--indigo-400) !important}.focus\:text-indigo-500:focus{color:var(--indigo-500) !important}.focus\:text-indigo-600:focus{color:var(--indigo-600) !important}.focus\:text-indigo-700:focus{color:var(--indigo-700) !important}.focus\:text-indigo-800:focus{color:var(--indigo-800) !important}.focus\:text-indigo-900:focus{color:var(--indigo-900) !important}.hover\:text-indigo-50:hover{color:var(--indigo-50) !important}.hover\:text-indigo-100:hover{color:var(--indigo-100) !important}.hover\:text-indigo-200:hover{color:var(--indigo-200) !important}.hover\:text-indigo-300:hover{color:var(--indigo-300) !important}.hover\:text-indigo-400:hover{color:var(--indigo-400) !important}.hover\:text-indigo-500:hover{color:var(--indigo-500) !important}.hover\:text-indigo-600:hover{color:var(--indigo-600) !important}.hover\:text-indigo-700:hover{color:var(--indigo-700) !important}.hover\:text-indigo-800:hover{color:var(--indigo-800) !important}.hover\:text-indigo-900:hover{color:var(--indigo-900) !important}.active\:text-indigo-50:active{color:var(--indigo-50) !important}.active\:text-indigo-100:active{color:var(--indigo-100) !important}.active\:text-indigo-200:active{color:var(--indigo-200) !important}.active\:text-indigo-300:active{color:var(--indigo-300) !important}.active\:text-indigo-400:active{color:var(--indigo-400) !important}.active\:text-indigo-500:active{color:var(--indigo-500) !important}.active\:text-indigo-600:active{color:var(--indigo-600) !important}.active\:text-indigo-700:active{color:var(--indigo-700) !important}.active\:text-indigo-800:active{color:var(--indigo-800) !important}.active\:text-indigo-900:active{color:var(--indigo-900) !important}.text-teal-50{color:var(--teal-50) !important}.text-teal-100{color:var(--teal-100) !important}.text-teal-200{color:var(--teal-200) !important}.text-teal-300{color:var(--teal-300) !important}.text-teal-400{color:var(--teal-400) !important}.text-teal-500{color:var(--teal-500) !important}.text-teal-600{color:var(--teal-600) !important}.text-teal-700{color:var(--teal-700) !important}.text-teal-800{color:var(--teal-800) !important}.text-teal-900{color:var(--teal-900) !important}.focus\:text-teal-50:focus{color:var(--teal-50) !important}.focus\:text-teal-100:focus{color:var(--teal-100) !important}.focus\:text-teal-200:focus{color:var(--teal-200) !important}.focus\:text-teal-300:focus{color:var(--teal-300) !important}.focus\:text-teal-400:focus{color:var(--teal-400) !important}.focus\:text-teal-500:focus{color:var(--teal-500) !important}.focus\:text-teal-600:focus{color:var(--teal-600) !important}.focus\:text-teal-700:focus{color:var(--teal-700) !important}.focus\:text-teal-800:focus{color:var(--teal-800) !important}.focus\:text-teal-900:focus{color:var(--teal-900) !important}.hover\:text-teal-50:hover{color:var(--teal-50) !important}.hover\:text-teal-100:hover{color:var(--teal-100) !important}.hover\:text-teal-200:hover{color:var(--teal-200) !important}.hover\:text-teal-300:hover{color:var(--teal-300) !important}.hover\:text-teal-400:hover{color:var(--teal-400) !important}.hover\:text-teal-500:hover{color:var(--teal-500) !important}.hover\:text-teal-600:hover{color:var(--teal-600) !important}.hover\:text-teal-700:hover{color:var(--teal-700) !important}.hover\:text-teal-800:hover{color:var(--teal-800) !important}.hover\:text-teal-900:hover{color:var(--teal-900) !important}.active\:text-teal-50:active{color:var(--teal-50) !important}.active\:text-teal-100:active{color:var(--teal-100) !important}.active\:text-teal-200:active{color:var(--teal-200) !important}.active\:text-teal-300:active{color:var(--teal-300) !important}.active\:text-teal-400:active{color:var(--teal-400) !important}.active\:text-teal-500:active{color:var(--teal-500) !important}.active\:text-teal-600:active{color:var(--teal-600) !important}.active\:text-teal-700:active{color:var(--teal-700) !important}.active\:text-teal-800:active{color:var(--teal-800) !important}.active\:text-teal-900:active{color:var(--teal-900) !important}.text-orange-50{color:var(--orange-50) !important}.text-orange-100{color:var(--orange-100) !important}.text-orange-200{color:var(--orange-200) !important}.text-orange-300{color:var(--orange-300) !important}.text-orange-400{color:var(--orange-400) !important}.text-orange-500{color:var(--orange-500) !important}.text-orange-600{color:var(--orange-600) !important}.text-orange-700{color:var(--orange-700) !important}.text-orange-800{color:var(--orange-800) !important}.text-orange-900{color:var(--orange-900) !important}.focus\:text-orange-50:focus{color:var(--orange-50) !important}.focus\:text-orange-100:focus{color:var(--orange-100) !important}.focus\:text-orange-200:focus{color:var(--orange-200) !important}.focus\:text-orange-300:focus{color:var(--orange-300) !important}.focus\:text-orange-400:focus{color:var(--orange-400) !important}.focus\:text-orange-500:focus{color:var(--orange-500) !important}.focus\:text-orange-600:focus{color:var(--orange-600) !important}.focus\:text-orange-700:focus{color:var(--orange-700) !important}.focus\:text-orange-800:focus{color:var(--orange-800) !important}.focus\:text-orange-900:focus{color:var(--orange-900) !important}.hover\:text-orange-50:hover{color:var(--orange-50) !important}.hover\:text-orange-100:hover{color:var(--orange-100) !important}.hover\:text-orange-200:hover{color:var(--orange-200) !important}.hover\:text-orange-300:hover{color:var(--orange-300) !important}.hover\:text-orange-400:hover{color:var(--orange-400) !important}.hover\:text-orange-500:hover{color:var(--orange-500) !important}.hover\:text-orange-600:hover{color:var(--orange-600) !important}.hover\:text-orange-700:hover{color:var(--orange-700) !important}.hover\:text-orange-800:hover{color:var(--orange-800) !important}.hover\:text-orange-900:hover{color:var(--orange-900) !important}.active\:text-orange-50:active{color:var(--orange-50) !important}.active\:text-orange-100:active{color:var(--orange-100) !important}.active\:text-orange-200:active{color:var(--orange-200) !important}.active\:text-orange-300:active{color:var(--orange-300) !important}.active\:text-orange-400:active{color:var(--orange-400) !important}.active\:text-orange-500:active{color:var(--orange-500) !important}.active\:text-orange-600:active{color:var(--orange-600) !important}.active\:text-orange-700:active{color:var(--orange-700) !important}.active\:text-orange-800:active{color:var(--orange-800) !important}.active\:text-orange-900:active{color:var(--orange-900) !important}.text-bluegray-50{color:var(--bluegray-50) !important}.text-bluegray-100{color:var(--bluegray-100) !important}.text-bluegray-200{color:var(--bluegray-200) !important}.text-bluegray-300{color:var(--bluegray-300) !important}.text-bluegray-400{color:var(--bluegray-400) !important}.text-bluegray-500{color:var(--bluegray-500) !important}.text-bluegray-600{color:var(--bluegray-600) !important}.text-bluegray-700{color:var(--bluegray-700) !important}.text-bluegray-800{color:var(--bluegray-800) !important}.text-bluegray-900{color:var(--bluegray-900) !important}.focus\:text-bluegray-50:focus{color:var(--bluegray-50) !important}.focus\:text-bluegray-100:focus{color:var(--bluegray-100) !important}.focus\:text-bluegray-200:focus{color:var(--bluegray-200) !important}.focus\:text-bluegray-300:focus{color:var(--bluegray-300) !important}.focus\:text-bluegray-400:focus{color:var(--bluegray-400) !important}.focus\:text-bluegray-500:focus{color:var(--bluegray-500) !important}.focus\:text-bluegray-600:focus{color:var(--bluegray-600) !important}.focus\:text-bluegray-700:focus{color:var(--bluegray-700) !important}.focus\:text-bluegray-800:focus{color:var(--bluegray-800) !important}.focus\:text-bluegray-900:focus{color:var(--bluegray-900) !important}.hover\:text-bluegray-50:hover{color:var(--bluegray-50) !important}.hover\:text-bluegray-100:hover{color:var(--bluegray-100) !important}.hover\:text-bluegray-200:hover{color:var(--bluegray-200) !important}.hover\:text-bluegray-300:hover{color:var(--bluegray-300) !important}.hover\:text-bluegray-400:hover{color:var(--bluegray-400) !important}.hover\:text-bluegray-500:hover{color:var(--bluegray-500) !important}.hover\:text-bluegray-600:hover{color:var(--bluegray-600) !important}.hover\:text-bluegray-700:hover{color:var(--bluegray-700) !important}.hover\:text-bluegray-800:hover{color:var(--bluegray-800) !important}.hover\:text-bluegray-900:hover{color:var(--bluegray-900) !important}.active\:text-bluegray-50:active{color:var(--bluegray-50) !important}.active\:text-bluegray-100:active{color:var(--bluegray-100) !important}.active\:text-bluegray-200:active{color:var(--bluegray-200) !important}.active\:text-bluegray-300:active{color:var(--bluegray-300) !important}.active\:text-bluegray-400:active{color:var(--bluegray-400) !important}.active\:text-bluegray-500:active{color:var(--bluegray-500) !important}.active\:text-bluegray-600:active{color:var(--bluegray-600) !important}.active\:text-bluegray-700:active{color:var(--bluegray-700) !important}.active\:text-bluegray-800:active{color:var(--bluegray-800) !important}.active\:text-bluegray-900:active{color:var(--bluegray-900) !important}.text-purple-50{color:var(--purple-50) !important}.text-purple-100{color:var(--purple-100) !important}.text-purple-200{color:var(--purple-200) !important}.text-purple-300{color:var(--purple-300) !important}.text-purple-400{color:var(--purple-400) !important}.text-purple-500{color:var(--purple-500) !important}.text-purple-600{color:var(--purple-600) !important}.text-purple-700{color:var(--purple-700) !important}.text-purple-800{color:var(--purple-800) !important}.text-purple-900{color:var(--purple-900) !important}.focus\:text-purple-50:focus{color:var(--purple-50) !important}.focus\:text-purple-100:focus{color:var(--purple-100) !important}.focus\:text-purple-200:focus{color:var(--purple-200) !important}.focus\:text-purple-300:focus{color:var(--purple-300) !important}.focus\:text-purple-400:focus{color:var(--purple-400) !important}.focus\:text-purple-500:focus{color:var(--purple-500) !important}.focus\:text-purple-600:focus{color:var(--purple-600) !important}.focus\:text-purple-700:focus{color:var(--purple-700) !important}.focus\:text-purple-800:focus{color:var(--purple-800) !important}.focus\:text-purple-900:focus{color:var(--purple-900) !important}.hover\:text-purple-50:hover{color:var(--purple-50) !important}.hover\:text-purple-100:hover{color:var(--purple-100) !important}.hover\:text-purple-200:hover{color:var(--purple-200) !important}.hover\:text-purple-300:hover{color:var(--purple-300) !important}.hover\:text-purple-400:hover{color:var(--purple-400) !important}.hover\:text-purple-500:hover{color:var(--purple-500) !important}.hover\:text-purple-600:hover{color:var(--purple-600) !important}.hover\:text-purple-700:hover{color:var(--purple-700) !important}.hover\:text-purple-800:hover{color:var(--purple-800) !important}.hover\:text-purple-900:hover{color:var(--purple-900) !important}.active\:text-purple-50:active{color:var(--purple-50) !important}.active\:text-purple-100:active{color:var(--purple-100) !important}.active\:text-purple-200:active{color:var(--purple-200) !important}.active\:text-purple-300:active{color:var(--purple-300) !important}.active\:text-purple-400:active{color:var(--purple-400) !important}.active\:text-purple-500:active{color:var(--purple-500) !important}.active\:text-purple-600:active{color:var(--purple-600) !important}.active\:text-purple-700:active{color:var(--purple-700) !important}.active\:text-purple-800:active{color:var(--purple-800) !important}.active\:text-purple-900:active{color:var(--purple-900) !important}.text-gray-50{color:var(--gray-50) !important}.text-gray-100{color:var(--gray-100) !important}.text-gray-200{color:var(--gray-200) !important}.text-gray-300{color:var(--gray-300) !important}.text-gray-400{color:var(--gray-400) !important}.text-gray-500{color:var(--gray-500) !important}.text-gray-600{color:var(--gray-600) !important}.text-gray-700{color:var(--gray-700) !important}.text-gray-800{color:var(--gray-800) !important}.text-gray-900{color:var(--gray-900) !important}.focus\:text-gray-50:focus{color:var(--gray-50) !important}.focus\:text-gray-100:focus{color:var(--gray-100) !important}.focus\:text-gray-200:focus{color:var(--gray-200) !important}.focus\:text-gray-300:focus{color:var(--gray-300) !important}.focus\:text-gray-400:focus{color:var(--gray-400) !important}.focus\:text-gray-500:focus{color:var(--gray-500) !important}.focus\:text-gray-600:focus{color:var(--gray-600) !important}.focus\:text-gray-700:focus{color:var(--gray-700) !important}.focus\:text-gray-800:focus{color:var(--gray-800) !important}.focus\:text-gray-900:focus{color:var(--gray-900) !important}.hover\:text-gray-50:hover{color:var(--gray-50) !important}.hover\:text-gray-100:hover{color:var(--gray-100) !important}.hover\:text-gray-200:hover{color:var(--gray-200) !important}.hover\:text-gray-300:hover{color:var(--gray-300) !important}.hover\:text-gray-400:hover{color:var(--gray-400) !important}.hover\:text-gray-500:hover{color:var(--gray-500) !important}.hover\:text-gray-600:hover{color:var(--gray-600) !important}.hover\:text-gray-700:hover{color:var(--gray-700) !important}.hover\:text-gray-800:hover{color:var(--gray-800) !important}.hover\:text-gray-900:hover{color:var(--gray-900) !important}.active\:text-gray-50:active{color:var(--gray-50) !important}.active\:text-gray-100:active{color:var(--gray-100) !important}.active\:text-gray-200:active{color:var(--gray-200) !important}.active\:text-gray-300:active{color:var(--gray-300) !important}.active\:text-gray-400:active{color:var(--gray-400) !important}.active\:text-gray-500:active{color:var(--gray-500) !important}.active\:text-gray-600:active{color:var(--gray-600) !important}.active\:text-gray-700:active{color:var(--gray-700) !important}.active\:text-gray-800:active{color:var(--gray-800) !important}.active\:text-gray-900:active{color:var(--gray-900) !important}.text-red-50{color:var(--red-50) !important}.text-red-100{color:var(--red-100) !important}.text-red-200{color:var(--red-200) !important}.text-red-300{color:var(--red-300) !important}.text-red-400{color:var(--red-400) !important}.text-red-500{color:var(--red-500) !important}.text-red-600{color:var(--red-600) !important}.text-red-700{color:var(--red-700) !important}.text-red-800{color:var(--red-800) !important}.text-red-900{color:var(--red-900) !important}.focus\:text-red-50:focus{color:var(--red-50) !important}.focus\:text-red-100:focus{color:var(--red-100) !important}.focus\:text-red-200:focus{color:var(--red-200) !important}.focus\:text-red-300:focus{color:var(--red-300) !important}.focus\:text-red-400:focus{color:var(--red-400) !important}.focus\:text-red-500:focus{color:var(--red-500) !important}.focus\:text-red-600:focus{color:var(--red-600) !important}.focus\:text-red-700:focus{color:var(--red-700) !important}.focus\:text-red-800:focus{color:var(--red-800) !important}.focus\:text-red-900:focus{color:var(--red-900) !important}.hover\:text-red-50:hover{color:var(--red-50) !important}.hover\:text-red-100:hover{color:var(--red-100) !important}.hover\:text-red-200:hover{color:var(--red-200) !important}.hover\:text-red-300:hover{color:var(--red-300) !important}.hover\:text-red-400:hover{color:var(--red-400) !important}.hover\:text-red-500:hover{color:var(--red-500) !important}.hover\:text-red-600:hover{color:var(--red-600) !important}.hover\:text-red-700:hover{color:var(--red-700) !important}.hover\:text-red-800:hover{color:var(--red-800) !important}.hover\:text-red-900:hover{color:var(--red-900) !important}.active\:text-red-50:active{color:var(--red-50) !important}.active\:text-red-100:active{color:var(--red-100) !important}.active\:text-red-200:active{color:var(--red-200) !important}.active\:text-red-300:active{color:var(--red-300) !important}.active\:text-red-400:active{color:var(--red-400) !important}.active\:text-red-500:active{color:var(--red-500) !important}.active\:text-red-600:active{color:var(--red-600) !important}.active\:text-red-700:active{color:var(--red-700) !important}.active\:text-red-800:active{color:var(--red-800) !important}.active\:text-red-900:active{color:var(--red-900) !important}.text-primary-50{color:var(--primary-50) !important}.text-primary-100{color:var(--primary-100) !important}.text-primary-200{color:var(--primary-200) !important}.text-primary-300{color:var(--primary-300) !important}.text-primary-400{color:var(--primary-400) !important}.text-primary-500{color:var(--primary-500) !important}.text-primary-600{color:var(--primary-600) !important}.text-primary-700{color:var(--primary-700) !important}.text-primary-800{color:var(--primary-800) !important}.text-primary-900{color:var(--primary-900) !important}.focus\:text-primary-50:focus{color:var(--primary-50) !important}.focus\:text-primary-100:focus{color:var(--primary-100) !important}.focus\:text-primary-200:focus{color:var(--primary-200) !important}.focus\:text-primary-300:focus{color:var(--primary-300) !important}.focus\:text-primary-400:focus{color:var(--primary-400) !important}.focus\:text-primary-500:focus{color:var(--primary-500) !important}.focus\:text-primary-600:focus{color:var(--primary-600) !important}.focus\:text-primary-700:focus{color:var(--primary-700) !important}.focus\:text-primary-800:focus{color:var(--primary-800) !important}.focus\:text-primary-900:focus{color:var(--primary-900) !important}.hover\:text-primary-50:hover{color:var(--primary-50) !important}.hover\:text-primary-100:hover{color:var(--primary-100) !important}.hover\:text-primary-200:hover{color:var(--primary-200) !important}.hover\:text-primary-300:hover{color:var(--primary-300) !important}.hover\:text-primary-400:hover{color:var(--primary-400) !important}.hover\:text-primary-500:hover{color:var(--primary-500) !important}.hover\:text-primary-600:hover{color:var(--primary-600) !important}.hover\:text-primary-700:hover{color:var(--primary-700) !important}.hover\:text-primary-800:hover{color:var(--primary-800) !important}.hover\:text-primary-900:hover{color:var(--primary-900) !important}.active\:text-primary-50:active{color:var(--primary-50) !important}.active\:text-primary-100:active{color:var(--primary-100) !important}.active\:text-primary-200:active{color:var(--primary-200) !important}.active\:text-primary-300:active{color:var(--primary-300) !important}.active\:text-primary-400:active{color:var(--primary-400) !important}.active\:text-primary-500:active{color:var(--primary-500) !important}.active\:text-primary-600:active{color:var(--primary-600) !important}.active\:text-primary-700:active{color:var(--primary-700) !important}.active\:text-primary-800:active{color:var(--primary-800) !important}.active\:text-primary-900:active{color:var(--primary-900) !important}.bg-blue-50{background-color:var(--blue-50) !important}.bg-blue-100{background-color:var(--blue-100) !important}.bg-blue-200{background-color:var(--blue-200) !important}.bg-blue-300{background-color:var(--blue-300) !important}.bg-blue-400{background-color:var(--blue-400) !important}.bg-blue-500{background-color:var(--blue-500) !important}.bg-blue-600{background-color:var(--blue-600) !important}.bg-blue-700{background-color:var(--blue-700) !important}.bg-blue-800{background-color:var(--blue-800) !important}.bg-blue-900{background-color:var(--blue-900) !important}.focus\:bg-blue-50:focus{background-color:var(--blue-50) !important}.focus\:bg-blue-100:focus{background-color:var(--blue-100) !important}.focus\:bg-blue-200:focus{background-color:var(--blue-200) !important}.focus\:bg-blue-300:focus{background-color:var(--blue-300) !important}.focus\:bg-blue-400:focus{background-color:var(--blue-400) !important}.focus\:bg-blue-500:focus{background-color:var(--blue-500) !important}.focus\:bg-blue-600:focus{background-color:var(--blue-600) !important}.focus\:bg-blue-700:focus{background-color:var(--blue-700) !important}.focus\:bg-blue-800:focus{background-color:var(--blue-800) !important}.focus\:bg-blue-900:focus{background-color:var(--blue-900) !important}.hover\:bg-blue-50:hover{background-color:var(--blue-50) !important}.hover\:bg-blue-100:hover{background-color:var(--blue-100) !important}.hover\:bg-blue-200:hover{background-color:var(--blue-200) !important}.hover\:bg-blue-300:hover{background-color:var(--blue-300) !important}.hover\:bg-blue-400:hover{background-color:var(--blue-400) !important}.hover\:bg-blue-500:hover{background-color:var(--blue-500) !important}.hover\:bg-blue-600:hover{background-color:var(--blue-600) !important}.hover\:bg-blue-700:hover{background-color:var(--blue-700) !important}.hover\:bg-blue-800:hover{background-color:var(--blue-800) !important}.hover\:bg-blue-900:hover{background-color:var(--blue-900) !important}.active\:bg-blue-50:active{background-color:var(--blue-50) !important}.active\:bg-blue-100:active{background-color:var(--blue-100) !important}.active\:bg-blue-200:active{background-color:var(--blue-200) !important}.active\:bg-blue-300:active{background-color:var(--blue-300) !important}.active\:bg-blue-400:active{background-color:var(--blue-400) !important}.active\:bg-blue-500:active{background-color:var(--blue-500) !important}.active\:bg-blue-600:active{background-color:var(--blue-600) !important}.active\:bg-blue-700:active{background-color:var(--blue-700) !important}.active\:bg-blue-800:active{background-color:var(--blue-800) !important}.active\:bg-blue-900:active{background-color:var(--blue-900) !important}.bg-green-50{background-color:var(--green-50) !important}.bg-green-100{background-color:var(--green-100) !important}.bg-green-200{background-color:var(--green-200) !important}.bg-green-300{background-color:var(--green-300) !important}.bg-green-400{background-color:var(--green-400) !important}.bg-green-500{background-color:var(--green-500) !important}.bg-green-600{background-color:var(--green-600) !important}.bg-green-700{background-color:var(--green-700) !important}.bg-green-800{background-color:var(--green-800) !important}.bg-green-900{background-color:var(--green-900) !important}.focus\:bg-green-50:focus{background-color:var(--green-50) !important}.focus\:bg-green-100:focus{background-color:var(--green-100) !important}.focus\:bg-green-200:focus{background-color:var(--green-200) !important}.focus\:bg-green-300:focus{background-color:var(--green-300) !important}.focus\:bg-green-400:focus{background-color:var(--green-400) !important}.focus\:bg-green-500:focus{background-color:var(--green-500) !important}.focus\:bg-green-600:focus{background-color:var(--green-600) !important}.focus\:bg-green-700:focus{background-color:var(--green-700) !important}.focus\:bg-green-800:focus{background-color:var(--green-800) !important}.focus\:bg-green-900:focus{background-color:var(--green-900) !important}.hover\:bg-green-50:hover{background-color:var(--green-50) !important}.hover\:bg-green-100:hover{background-color:var(--green-100) !important}.hover\:bg-green-200:hover{background-color:var(--green-200) !important}.hover\:bg-green-300:hover{background-color:var(--green-300) !important}.hover\:bg-green-400:hover{background-color:var(--green-400) !important}.hover\:bg-green-500:hover{background-color:var(--green-500) !important}.hover\:bg-green-600:hover{background-color:var(--green-600) !important}.hover\:bg-green-700:hover{background-color:var(--green-700) !important}.hover\:bg-green-800:hover{background-color:var(--green-800) !important}.hover\:bg-green-900:hover{background-color:var(--green-900) !important}.active\:bg-green-50:active{background-color:var(--green-50) !important}.active\:bg-green-100:active{background-color:var(--green-100) !important}.active\:bg-green-200:active{background-color:var(--green-200) !important}.active\:bg-green-300:active{background-color:var(--green-300) !important}.active\:bg-green-400:active{background-color:var(--green-400) !important}.active\:bg-green-500:active{background-color:var(--green-500) !important}.active\:bg-green-600:active{background-color:var(--green-600) !important}.active\:bg-green-700:active{background-color:var(--green-700) !important}.active\:bg-green-800:active{background-color:var(--green-800) !important}.active\:bg-green-900:active{background-color:var(--green-900) !important}.bg-yellow-50{background-color:var(--yellow-50) !important}.bg-yellow-100{background-color:var(--yellow-100) !important}.bg-yellow-200{background-color:var(--yellow-200) !important}.bg-yellow-300{background-color:var(--yellow-300) !important}.bg-yellow-400{background-color:var(--yellow-400) !important}.bg-yellow-500{background-color:var(--yellow-500) !important}.bg-yellow-600{background-color:var(--yellow-600) !important}.bg-yellow-700{background-color:var(--yellow-700) !important}.bg-yellow-800{background-color:var(--yellow-800) !important}.bg-yellow-900{background-color:var(--yellow-900) !important}.focus\:bg-yellow-50:focus{background-color:var(--yellow-50) !important}.focus\:bg-yellow-100:focus{background-color:var(--yellow-100) !important}.focus\:bg-yellow-200:focus{background-color:var(--yellow-200) !important}.focus\:bg-yellow-300:focus{background-color:var(--yellow-300) !important}.focus\:bg-yellow-400:focus{background-color:var(--yellow-400) !important}.focus\:bg-yellow-500:focus{background-color:var(--yellow-500) !important}.focus\:bg-yellow-600:focus{background-color:var(--yellow-600) !important}.focus\:bg-yellow-700:focus{background-color:var(--yellow-700) !important}.focus\:bg-yellow-800:focus{background-color:var(--yellow-800) !important}.focus\:bg-yellow-900:focus{background-color:var(--yellow-900) !important}.hover\:bg-yellow-50:hover{background-color:var(--yellow-50) !important}.hover\:bg-yellow-100:hover{background-color:var(--yellow-100) !important}.hover\:bg-yellow-200:hover{background-color:var(--yellow-200) !important}.hover\:bg-yellow-300:hover{background-color:var(--yellow-300) !important}.hover\:bg-yellow-400:hover{background-color:var(--yellow-400) !important}.hover\:bg-yellow-500:hover{background-color:var(--yellow-500) !important}.hover\:bg-yellow-600:hover{background-color:var(--yellow-600) !important}.hover\:bg-yellow-700:hover{background-color:var(--yellow-700) !important}.hover\:bg-yellow-800:hover{background-color:var(--yellow-800) !important}.hover\:bg-yellow-900:hover{background-color:var(--yellow-900) !important}.active\:bg-yellow-50:active{background-color:var(--yellow-50) !important}.active\:bg-yellow-100:active{background-color:var(--yellow-100) !important}.active\:bg-yellow-200:active{background-color:var(--yellow-200) !important}.active\:bg-yellow-300:active{background-color:var(--yellow-300) !important}.active\:bg-yellow-400:active{background-color:var(--yellow-400) !important}.active\:bg-yellow-500:active{background-color:var(--yellow-500) !important}.active\:bg-yellow-600:active{background-color:var(--yellow-600) !important}.active\:bg-yellow-700:active{background-color:var(--yellow-700) !important}.active\:bg-yellow-800:active{background-color:var(--yellow-800) !important}.active\:bg-yellow-900:active{background-color:var(--yellow-900) !important}.bg-cyan-50{background-color:var(--cyan-50) !important}.bg-cyan-100{background-color:var(--cyan-100) !important}.bg-cyan-200{background-color:var(--cyan-200) !important}.bg-cyan-300{background-color:var(--cyan-300) !important}.bg-cyan-400{background-color:var(--cyan-400) !important}.bg-cyan-500{background-color:var(--cyan-500) !important}.bg-cyan-600{background-color:var(--cyan-600) !important}.bg-cyan-700{background-color:var(--cyan-700) !important}.bg-cyan-800{background-color:var(--cyan-800) !important}.bg-cyan-900{background-color:var(--cyan-900) !important}.focus\:bg-cyan-50:focus{background-color:var(--cyan-50) !important}.focus\:bg-cyan-100:focus{background-color:var(--cyan-100) !important}.focus\:bg-cyan-200:focus{background-color:var(--cyan-200) !important}.focus\:bg-cyan-300:focus{background-color:var(--cyan-300) !important}.focus\:bg-cyan-400:focus{background-color:var(--cyan-400) !important}.focus\:bg-cyan-500:focus{background-color:var(--cyan-500) !important}.focus\:bg-cyan-600:focus{background-color:var(--cyan-600) !important}.focus\:bg-cyan-700:focus{background-color:var(--cyan-700) !important}.focus\:bg-cyan-800:focus{background-color:var(--cyan-800) !important}.focus\:bg-cyan-900:focus{background-color:var(--cyan-900) !important}.hover\:bg-cyan-50:hover{background-color:var(--cyan-50) !important}.hover\:bg-cyan-100:hover{background-color:var(--cyan-100) !important}.hover\:bg-cyan-200:hover{background-color:var(--cyan-200) !important}.hover\:bg-cyan-300:hover{background-color:var(--cyan-300) !important}.hover\:bg-cyan-400:hover{background-color:var(--cyan-400) !important}.hover\:bg-cyan-500:hover{background-color:var(--cyan-500) !important}.hover\:bg-cyan-600:hover{background-color:var(--cyan-600) !important}.hover\:bg-cyan-700:hover{background-color:var(--cyan-700) !important}.hover\:bg-cyan-800:hover{background-color:var(--cyan-800) !important}.hover\:bg-cyan-900:hover{background-color:var(--cyan-900) !important}.active\:bg-cyan-50:active{background-color:var(--cyan-50) !important}.active\:bg-cyan-100:active{background-color:var(--cyan-100) !important}.active\:bg-cyan-200:active{background-color:var(--cyan-200) !important}.active\:bg-cyan-300:active{background-color:var(--cyan-300) !important}.active\:bg-cyan-400:active{background-color:var(--cyan-400) !important}.active\:bg-cyan-500:active{background-color:var(--cyan-500) !important}.active\:bg-cyan-600:active{background-color:var(--cyan-600) !important}.active\:bg-cyan-700:active{background-color:var(--cyan-700) !important}.active\:bg-cyan-800:active{background-color:var(--cyan-800) !important}.active\:bg-cyan-900:active{background-color:var(--cyan-900) !important}.bg-pink-50{background-color:var(--pink-50) !important}.bg-pink-100{background-color:var(--pink-100) !important}.bg-pink-200{background-color:var(--pink-200) !important}.bg-pink-300{background-color:var(--pink-300) !important}.bg-pink-400{background-color:var(--pink-400) !important}.bg-pink-500{background-color:var(--pink-500) !important}.bg-pink-600{background-color:var(--pink-600) !important}.bg-pink-700{background-color:var(--pink-700) !important}.bg-pink-800{background-color:var(--pink-800) !important}.bg-pink-900{background-color:var(--pink-900) !important}.focus\:bg-pink-50:focus{background-color:var(--pink-50) !important}.focus\:bg-pink-100:focus{background-color:var(--pink-100) !important}.focus\:bg-pink-200:focus{background-color:var(--pink-200) !important}.focus\:bg-pink-300:focus{background-color:var(--pink-300) !important}.focus\:bg-pink-400:focus{background-color:var(--pink-400) !important}.focus\:bg-pink-500:focus{background-color:var(--pink-500) !important}.focus\:bg-pink-600:focus{background-color:var(--pink-600) !important}.focus\:bg-pink-700:focus{background-color:var(--pink-700) !important}.focus\:bg-pink-800:focus{background-color:var(--pink-800) !important}.focus\:bg-pink-900:focus{background-color:var(--pink-900) !important}.hover\:bg-pink-50:hover{background-color:var(--pink-50) !important}.hover\:bg-pink-100:hover{background-color:var(--pink-100) !important}.hover\:bg-pink-200:hover{background-color:var(--pink-200) !important}.hover\:bg-pink-300:hover{background-color:var(--pink-300) !important}.hover\:bg-pink-400:hover{background-color:var(--pink-400) !important}.hover\:bg-pink-500:hover{background-color:var(--pink-500) !important}.hover\:bg-pink-600:hover{background-color:var(--pink-600) !important}.hover\:bg-pink-700:hover{background-color:var(--pink-700) !important}.hover\:bg-pink-800:hover{background-color:var(--pink-800) !important}.hover\:bg-pink-900:hover{background-color:var(--pink-900) !important}.active\:bg-pink-50:active{background-color:var(--pink-50) !important}.active\:bg-pink-100:active{background-color:var(--pink-100) !important}.active\:bg-pink-200:active{background-color:var(--pink-200) !important}.active\:bg-pink-300:active{background-color:var(--pink-300) !important}.active\:bg-pink-400:active{background-color:var(--pink-400) !important}.active\:bg-pink-500:active{background-color:var(--pink-500) !important}.active\:bg-pink-600:active{background-color:var(--pink-600) !important}.active\:bg-pink-700:active{background-color:var(--pink-700) !important}.active\:bg-pink-800:active{background-color:var(--pink-800) !important}.active\:bg-pink-900:active{background-color:var(--pink-900) !important}.bg-indigo-50{background-color:var(--indigo-50) !important}.bg-indigo-100{background-color:var(--indigo-100) !important}.bg-indigo-200{background-color:var(--indigo-200) !important}.bg-indigo-300{background-color:var(--indigo-300) !important}.bg-indigo-400{background-color:var(--indigo-400) !important}.bg-indigo-500{background-color:var(--indigo-500) !important}.bg-indigo-600{background-color:var(--indigo-600) !important}.bg-indigo-700{background-color:var(--indigo-700) !important}.bg-indigo-800{background-color:var(--indigo-800) !important}.bg-indigo-900{background-color:var(--indigo-900) !important}.focus\:bg-indigo-50:focus{background-color:var(--indigo-50) !important}.focus\:bg-indigo-100:focus{background-color:var(--indigo-100) !important}.focus\:bg-indigo-200:focus{background-color:var(--indigo-200) !important}.focus\:bg-indigo-300:focus{background-color:var(--indigo-300) !important}.focus\:bg-indigo-400:focus{background-color:var(--indigo-400) !important}.focus\:bg-indigo-500:focus{background-color:var(--indigo-500) !important}.focus\:bg-indigo-600:focus{background-color:var(--indigo-600) !important}.focus\:bg-indigo-700:focus{background-color:var(--indigo-700) !important}.focus\:bg-indigo-800:focus{background-color:var(--indigo-800) !important}.focus\:bg-indigo-900:focus{background-color:var(--indigo-900) !important}.hover\:bg-indigo-50:hover{background-color:var(--indigo-50) !important}.hover\:bg-indigo-100:hover{background-color:var(--indigo-100) !important}.hover\:bg-indigo-200:hover{background-color:var(--indigo-200) !important}.hover\:bg-indigo-300:hover{background-color:var(--indigo-300) !important}.hover\:bg-indigo-400:hover{background-color:var(--indigo-400) !important}.hover\:bg-indigo-500:hover{background-color:var(--indigo-500) !important}.hover\:bg-indigo-600:hover{background-color:var(--indigo-600) !important}.hover\:bg-indigo-700:hover{background-color:var(--indigo-700) !important}.hover\:bg-indigo-800:hover{background-color:var(--indigo-800) !important}.hover\:bg-indigo-900:hover{background-color:var(--indigo-900) !important}.active\:bg-indigo-50:active{background-color:var(--indigo-50) !important}.active\:bg-indigo-100:active{background-color:var(--indigo-100) !important}.active\:bg-indigo-200:active{background-color:var(--indigo-200) !important}.active\:bg-indigo-300:active{background-color:var(--indigo-300) !important}.active\:bg-indigo-400:active{background-color:var(--indigo-400) !important}.active\:bg-indigo-500:active{background-color:var(--indigo-500) !important}.active\:bg-indigo-600:active{background-color:var(--indigo-600) !important}.active\:bg-indigo-700:active{background-color:var(--indigo-700) !important}.active\:bg-indigo-800:active{background-color:var(--indigo-800) !important}.active\:bg-indigo-900:active{background-color:var(--indigo-900) !important}.bg-teal-50{background-color:var(--teal-50) !important}.bg-teal-100{background-color:var(--teal-100) !important}.bg-teal-200{background-color:var(--teal-200) !important}.bg-teal-300{background-color:var(--teal-300) !important}.bg-teal-400{background-color:var(--teal-400) !important}.bg-teal-500{background-color:var(--teal-500) !important}.bg-teal-600{background-color:var(--teal-600) !important}.bg-teal-700{background-color:var(--teal-700) !important}.bg-teal-800{background-color:var(--teal-800) !important}.bg-teal-900{background-color:var(--teal-900) !important}.focus\:bg-teal-50:focus{background-color:var(--teal-50) !important}.focus\:bg-teal-100:focus{background-color:var(--teal-100) !important}.focus\:bg-teal-200:focus{background-color:var(--teal-200) !important}.focus\:bg-teal-300:focus{background-color:var(--teal-300) !important}.focus\:bg-teal-400:focus{background-color:var(--teal-400) !important}.focus\:bg-teal-500:focus{background-color:var(--teal-500) !important}.focus\:bg-teal-600:focus{background-color:var(--teal-600) !important}.focus\:bg-teal-700:focus{background-color:var(--teal-700) !important}.focus\:bg-teal-800:focus{background-color:var(--teal-800) !important}.focus\:bg-teal-900:focus{background-color:var(--teal-900) !important}.hover\:bg-teal-50:hover{background-color:var(--teal-50) !important}.hover\:bg-teal-100:hover{background-color:var(--teal-100) !important}.hover\:bg-teal-200:hover{background-color:var(--teal-200) !important}.hover\:bg-teal-300:hover{background-color:var(--teal-300) !important}.hover\:bg-teal-400:hover{background-color:var(--teal-400) !important}.hover\:bg-teal-500:hover{background-color:var(--teal-500) !important}.hover\:bg-teal-600:hover{background-color:var(--teal-600) !important}.hover\:bg-teal-700:hover{background-color:var(--teal-700) !important}.hover\:bg-teal-800:hover{background-color:var(--teal-800) !important}.hover\:bg-teal-900:hover{background-color:var(--teal-900) !important}.active\:bg-teal-50:active{background-color:var(--teal-50) !important}.active\:bg-teal-100:active{background-color:var(--teal-100) !important}.active\:bg-teal-200:active{background-color:var(--teal-200) !important}.active\:bg-teal-300:active{background-color:var(--teal-300) !important}.active\:bg-teal-400:active{background-color:var(--teal-400) !important}.active\:bg-teal-500:active{background-color:var(--teal-500) !important}.active\:bg-teal-600:active{background-color:var(--teal-600) !important}.active\:bg-teal-700:active{background-color:var(--teal-700) !important}.active\:bg-teal-800:active{background-color:var(--teal-800) !important}.active\:bg-teal-900:active{background-color:var(--teal-900) !important}.bg-orange-50{background-color:var(--orange-50) !important}.bg-orange-100{background-color:var(--orange-100) !important}.bg-orange-200{background-color:var(--orange-200) !important}.bg-orange-300{background-color:var(--orange-300) !important}.bg-orange-400{background-color:var(--orange-400) !important}.bg-orange-500{background-color:var(--orange-500) !important}.bg-orange-600{background-color:var(--orange-600) !important}.bg-orange-700{background-color:var(--orange-700) !important}.bg-orange-800{background-color:var(--orange-800) !important}.bg-orange-900{background-color:var(--orange-900) !important}.focus\:bg-orange-50:focus{background-color:var(--orange-50) !important}.focus\:bg-orange-100:focus{background-color:var(--orange-100) !important}.focus\:bg-orange-200:focus{background-color:var(--orange-200) !important}.focus\:bg-orange-300:focus{background-color:var(--orange-300) !important}.focus\:bg-orange-400:focus{background-color:var(--orange-400) !important}.focus\:bg-orange-500:focus{background-color:var(--orange-500) !important}.focus\:bg-orange-600:focus{background-color:var(--orange-600) !important}.focus\:bg-orange-700:focus{background-color:var(--orange-700) !important}.focus\:bg-orange-800:focus{background-color:var(--orange-800) !important}.focus\:bg-orange-900:focus{background-color:var(--orange-900) !important}.hover\:bg-orange-50:hover{background-color:var(--orange-50) !important}.hover\:bg-orange-100:hover{background-color:var(--orange-100) !important}.hover\:bg-orange-200:hover{background-color:var(--orange-200) !important}.hover\:bg-orange-300:hover{background-color:var(--orange-300) !important}.hover\:bg-orange-400:hover{background-color:var(--orange-400) !important}.hover\:bg-orange-500:hover{background-color:var(--orange-500) !important}.hover\:bg-orange-600:hover{background-color:var(--orange-600) !important}.hover\:bg-orange-700:hover{background-color:var(--orange-700) !important}.hover\:bg-orange-800:hover{background-color:var(--orange-800) !important}.hover\:bg-orange-900:hover{background-color:var(--orange-900) !important}.active\:bg-orange-50:active{background-color:var(--orange-50) !important}.active\:bg-orange-100:active{background-color:var(--orange-100) !important}.active\:bg-orange-200:active{background-color:var(--orange-200) !important}.active\:bg-orange-300:active{background-color:var(--orange-300) !important}.active\:bg-orange-400:active{background-color:var(--orange-400) !important}.active\:bg-orange-500:active{background-color:var(--orange-500) !important}.active\:bg-orange-600:active{background-color:var(--orange-600) !important}.active\:bg-orange-700:active{background-color:var(--orange-700) !important}.active\:bg-orange-800:active{background-color:var(--orange-800) !important}.active\:bg-orange-900:active{background-color:var(--orange-900) !important}.bg-bluegray-50{background-color:var(--bluegray-50) !important}.bg-bluegray-100{background-color:var(--bluegray-100) !important}.bg-bluegray-200{background-color:var(--bluegray-200) !important}.bg-bluegray-300{background-color:var(--bluegray-300) !important}.bg-bluegray-400{background-color:var(--bluegray-400) !important}.bg-bluegray-500{background-color:var(--bluegray-500) !important}.bg-bluegray-600{background-color:var(--bluegray-600) !important}.bg-bluegray-700{background-color:var(--bluegray-700) !important}.bg-bluegray-800{background-color:var(--bluegray-800) !important}.bg-bluegray-900{background-color:var(--bluegray-900) !important}.focus\:bg-bluegray-50:focus{background-color:var(--bluegray-50) !important}.focus\:bg-bluegray-100:focus{background-color:var(--bluegray-100) !important}.focus\:bg-bluegray-200:focus{background-color:var(--bluegray-200) !important}.focus\:bg-bluegray-300:focus{background-color:var(--bluegray-300) !important}.focus\:bg-bluegray-400:focus{background-color:var(--bluegray-400) !important}.focus\:bg-bluegray-500:focus{background-color:var(--bluegray-500) !important}.focus\:bg-bluegray-600:focus{background-color:var(--bluegray-600) !important}.focus\:bg-bluegray-700:focus{background-color:var(--bluegray-700) !important}.focus\:bg-bluegray-800:focus{background-color:var(--bluegray-800) !important}.focus\:bg-bluegray-900:focus{background-color:var(--bluegray-900) !important}.hover\:bg-bluegray-50:hover{background-color:var(--bluegray-50) !important}.hover\:bg-bluegray-100:hover{background-color:var(--bluegray-100) !important}.hover\:bg-bluegray-200:hover{background-color:var(--bluegray-200) !important}.hover\:bg-bluegray-300:hover{background-color:var(--bluegray-300) !important}.hover\:bg-bluegray-400:hover{background-color:var(--bluegray-400) !important}.hover\:bg-bluegray-500:hover{background-color:var(--bluegray-500) !important}.hover\:bg-bluegray-600:hover{background-color:var(--bluegray-600) !important}.hover\:bg-bluegray-700:hover{background-color:var(--bluegray-700) !important}.hover\:bg-bluegray-800:hover{background-color:var(--bluegray-800) !important}.hover\:bg-bluegray-900:hover{background-color:var(--bluegray-900) !important}.active\:bg-bluegray-50:active{background-color:var(--bluegray-50) !important}.active\:bg-bluegray-100:active{background-color:var(--bluegray-100) !important}.active\:bg-bluegray-200:active{background-color:var(--bluegray-200) !important}.active\:bg-bluegray-300:active{background-color:var(--bluegray-300) !important}.active\:bg-bluegray-400:active{background-color:var(--bluegray-400) !important}.active\:bg-bluegray-500:active{background-color:var(--bluegray-500) !important}.active\:bg-bluegray-600:active{background-color:var(--bluegray-600) !important}.active\:bg-bluegray-700:active{background-color:var(--bluegray-700) !important}.active\:bg-bluegray-800:active{background-color:var(--bluegray-800) !important}.active\:bg-bluegray-900:active{background-color:var(--bluegray-900) !important}.bg-purple-50{background-color:var(--purple-50) !important}.bg-purple-100{background-color:var(--purple-100) !important}.bg-purple-200{background-color:var(--purple-200) !important}.bg-purple-300{background-color:var(--purple-300) !important}.bg-purple-400{background-color:var(--purple-400) !important}.bg-purple-500{background-color:var(--purple-500) !important}.bg-purple-600{background-color:var(--purple-600) !important}.bg-purple-700{background-color:var(--purple-700) !important}.bg-purple-800{background-color:var(--purple-800) !important}.bg-purple-900{background-color:var(--purple-900) !important}.focus\:bg-purple-50:focus{background-color:var(--purple-50) !important}.focus\:bg-purple-100:focus{background-color:var(--purple-100) !important}.focus\:bg-purple-200:focus{background-color:var(--purple-200) !important}.focus\:bg-purple-300:focus{background-color:var(--purple-300) !important}.focus\:bg-purple-400:focus{background-color:var(--purple-400) !important}.focus\:bg-purple-500:focus{background-color:var(--purple-500) !important}.focus\:bg-purple-600:focus{background-color:var(--purple-600) !important}.focus\:bg-purple-700:focus{background-color:var(--purple-700) !important}.focus\:bg-purple-800:focus{background-color:var(--purple-800) !important}.focus\:bg-purple-900:focus{background-color:var(--purple-900) !important}.hover\:bg-purple-50:hover{background-color:var(--purple-50) !important}.hover\:bg-purple-100:hover{background-color:var(--purple-100) !important}.hover\:bg-purple-200:hover{background-color:var(--purple-200) !important}.hover\:bg-purple-300:hover{background-color:var(--purple-300) !important}.hover\:bg-purple-400:hover{background-color:var(--purple-400) !important}.hover\:bg-purple-500:hover{background-color:var(--purple-500) !important}.hover\:bg-purple-600:hover{background-color:var(--purple-600) !important}.hover\:bg-purple-700:hover{background-color:var(--purple-700) !important}.hover\:bg-purple-800:hover{background-color:var(--purple-800) !important}.hover\:bg-purple-900:hover{background-color:var(--purple-900) !important}.active\:bg-purple-50:active{background-color:var(--purple-50) !important}.active\:bg-purple-100:active{background-color:var(--purple-100) !important}.active\:bg-purple-200:active{background-color:var(--purple-200) !important}.active\:bg-purple-300:active{background-color:var(--purple-300) !important}.active\:bg-purple-400:active{background-color:var(--purple-400) !important}.active\:bg-purple-500:active{background-color:var(--purple-500) !important}.active\:bg-purple-600:active{background-color:var(--purple-600) !important}.active\:bg-purple-700:active{background-color:var(--purple-700) !important}.active\:bg-purple-800:active{background-color:var(--purple-800) !important}.active\:bg-purple-900:active{background-color:var(--purple-900) !important}.bg-gray-50{background-color:var(--gray-50) !important}.bg-gray-100{background-color:var(--gray-100) !important}.bg-gray-200{background-color:var(--gray-200) !important}.bg-gray-300{background-color:var(--gray-300) !important}.bg-gray-400{background-color:var(--gray-400) !important}.bg-gray-500{background-color:var(--gray-500) !important}.bg-gray-600{background-color:var(--gray-600) !important}.bg-gray-700{background-color:var(--gray-700) !important}.bg-gray-800{background-color:var(--gray-800) !important}.bg-gray-900{background-color:var(--gray-900) !important}.focus\:bg-gray-50:focus{background-color:var(--gray-50) !important}.focus\:bg-gray-100:focus{background-color:var(--gray-100) !important}.focus\:bg-gray-200:focus{background-color:var(--gray-200) !important}.focus\:bg-gray-300:focus{background-color:var(--gray-300) !important}.focus\:bg-gray-400:focus{background-color:var(--gray-400) !important}.focus\:bg-gray-500:focus{background-color:var(--gray-500) !important}.focus\:bg-gray-600:focus{background-color:var(--gray-600) !important}.focus\:bg-gray-700:focus{background-color:var(--gray-700) !important}.focus\:bg-gray-800:focus{background-color:var(--gray-800) !important}.focus\:bg-gray-900:focus{background-color:var(--gray-900) !important}.hover\:bg-gray-50:hover{background-color:var(--gray-50) !important}.hover\:bg-gray-100:hover{background-color:var(--gray-100) !important}.hover\:bg-gray-200:hover{background-color:var(--gray-200) !important}.hover\:bg-gray-300:hover{background-color:var(--gray-300) !important}.hover\:bg-gray-400:hover{background-color:var(--gray-400) !important}.hover\:bg-gray-500:hover{background-color:var(--gray-500) !important}.hover\:bg-gray-600:hover{background-color:var(--gray-600) !important}.hover\:bg-gray-700:hover{background-color:var(--gray-700) !important}.hover\:bg-gray-800:hover{background-color:var(--gray-800) !important}.hover\:bg-gray-900:hover{background-color:var(--gray-900) !important}.active\:bg-gray-50:active{background-color:var(--gray-50) !important}.active\:bg-gray-100:active{background-color:var(--gray-100) !important}.active\:bg-gray-200:active{background-color:var(--gray-200) !important}.active\:bg-gray-300:active{background-color:var(--gray-300) !important}.active\:bg-gray-400:active{background-color:var(--gray-400) !important}.active\:bg-gray-500:active{background-color:var(--gray-500) !important}.active\:bg-gray-600:active{background-color:var(--gray-600) !important}.active\:bg-gray-700:active{background-color:var(--gray-700) !important}.active\:bg-gray-800:active{background-color:var(--gray-800) !important}.active\:bg-gray-900:active{background-color:var(--gray-900) !important}.bg-red-50{background-color:var(--red-50) !important}.bg-red-100{background-color:var(--red-100) !important}.bg-red-200{background-color:var(--red-200) !important}.bg-red-300{background-color:var(--red-300) !important}.bg-red-400{background-color:var(--red-400) !important}.bg-red-500{background-color:var(--red-500) !important}.bg-red-600{background-color:var(--red-600) !important}.bg-red-700{background-color:var(--red-700) !important}.bg-red-800{background-color:var(--red-800) !important}.bg-red-900{background-color:var(--red-900) !important}.focus\:bg-red-50:focus{background-color:var(--red-50) !important}.focus\:bg-red-100:focus{background-color:var(--red-100) !important}.focus\:bg-red-200:focus{background-color:var(--red-200) !important}.focus\:bg-red-300:focus{background-color:var(--red-300) !important}.focus\:bg-red-400:focus{background-color:var(--red-400) !important}.focus\:bg-red-500:focus{background-color:var(--red-500) !important}.focus\:bg-red-600:focus{background-color:var(--red-600) !important}.focus\:bg-red-700:focus{background-color:var(--red-700) !important}.focus\:bg-red-800:focus{background-color:var(--red-800) !important}.focus\:bg-red-900:focus{background-color:var(--red-900) !important}.hover\:bg-red-50:hover{background-color:var(--red-50) !important}.hover\:bg-red-100:hover{background-color:var(--red-100) !important}.hover\:bg-red-200:hover{background-color:var(--red-200) !important}.hover\:bg-red-300:hover{background-color:var(--red-300) !important}.hover\:bg-red-400:hover{background-color:var(--red-400) !important}.hover\:bg-red-500:hover{background-color:var(--red-500) !important}.hover\:bg-red-600:hover{background-color:var(--red-600) !important}.hover\:bg-red-700:hover{background-color:var(--red-700) !important}.hover\:bg-red-800:hover{background-color:var(--red-800) !important}.hover\:bg-red-900:hover{background-color:var(--red-900) !important}.active\:bg-red-50:active{background-color:var(--red-50) !important}.active\:bg-red-100:active{background-color:var(--red-100) !important}.active\:bg-red-200:active{background-color:var(--red-200) !important}.active\:bg-red-300:active{background-color:var(--red-300) !important}.active\:bg-red-400:active{background-color:var(--red-400) !important}.active\:bg-red-500:active{background-color:var(--red-500) !important}.active\:bg-red-600:active{background-color:var(--red-600) !important}.active\:bg-red-700:active{background-color:var(--red-700) !important}.active\:bg-red-800:active{background-color:var(--red-800) !important}.active\:bg-red-900:active{background-color:var(--red-900) !important}.bg-primary-50{background-color:var(--primary-50) !important}.bg-primary-100{background-color:var(--primary-100) !important}.bg-primary-200{background-color:var(--primary-200) !important}.bg-primary-300{background-color:var(--primary-300) !important}.bg-primary-400{background-color:var(--primary-400) !important}.bg-primary-500{background-color:var(--primary-500) !important}.bg-primary-600{background-color:var(--primary-600) !important}.bg-primary-700{background-color:var(--primary-700) !important}.bg-primary-800{background-color:var(--primary-800) !important}.bg-primary-900{background-color:var(--primary-900) !important}.focus\:bg-primary-50:focus{background-color:var(--primary-50) !important}.focus\:bg-primary-100:focus{background-color:var(--primary-100) !important}.focus\:bg-primary-200:focus{background-color:var(--primary-200) !important}.focus\:bg-primary-300:focus{background-color:var(--primary-300) !important}.focus\:bg-primary-400:focus{background-color:var(--primary-400) !important}.focus\:bg-primary-500:focus{background-color:var(--primary-500) !important}.focus\:bg-primary-600:focus{background-color:var(--primary-600) !important}.focus\:bg-primary-700:focus{background-color:var(--primary-700) !important}.focus\:bg-primary-800:focus{background-color:var(--primary-800) !important}.focus\:bg-primary-900:focus{background-color:var(--primary-900) !important}.hover\:bg-primary-50:hover{background-color:var(--primary-50) !important}.hover\:bg-primary-100:hover{background-color:var(--primary-100) !important}.hover\:bg-primary-200:hover{background-color:var(--primary-200) !important}.hover\:bg-primary-300:hover{background-color:var(--primary-300) !important}.hover\:bg-primary-400:hover{background-color:var(--primary-400) !important}.hover\:bg-primary-500:hover{background-color:var(--primary-500) !important}.hover\:bg-primary-600:hover{background-color:var(--primary-600) !important}.hover\:bg-primary-700:hover{background-color:var(--primary-700) !important}.hover\:bg-primary-800:hover{background-color:var(--primary-800) !important}.hover\:bg-primary-900:hover{background-color:var(--primary-900) !important}.active\:bg-primary-50:active{background-color:var(--primary-50) !important}.active\:bg-primary-100:active{background-color:var(--primary-100) !important}.active\:bg-primary-200:active{background-color:var(--primary-200) !important}.active\:bg-primary-300:active{background-color:var(--primary-300) !important}.active\:bg-primary-400:active{background-color:var(--primary-400) !important}.active\:bg-primary-500:active{background-color:var(--primary-500) !important}.active\:bg-primary-600:active{background-color:var(--primary-600) !important}.active\:bg-primary-700:active{background-color:var(--primary-700) !important}.active\:bg-primary-800:active{background-color:var(--primary-800) !important}.active\:bg-primary-900:active{background-color:var(--primary-900) !important}.border-blue-50{border-color:var(--blue-50) !important}.border-blue-100{border-color:var(--blue-100) !important}.border-blue-200{border-color:var(--blue-200) !important}.border-blue-300{border-color:var(--blue-300) !important}.border-blue-400{border-color:var(--blue-400) !important}.border-blue-500{border-color:var(--blue-500) !important}.border-blue-600{border-color:var(--blue-600) !important}.border-blue-700{border-color:var(--blue-700) !important}.border-blue-800{border-color:var(--blue-800) !important}.border-blue-900{border-color:var(--blue-900) !important}.focus\:border-blue-50:focus{border-color:var(--blue-50) !important}.focus\:border-blue-100:focus{border-color:var(--blue-100) !important}.focus\:border-blue-200:focus{border-color:var(--blue-200) !important}.focus\:border-blue-300:focus{border-color:var(--blue-300) !important}.focus\:border-blue-400:focus{border-color:var(--blue-400) !important}.focus\:border-blue-500:focus{border-color:var(--blue-500) !important}.focus\:border-blue-600:focus{border-color:var(--blue-600) !important}.focus\:border-blue-700:focus{border-color:var(--blue-700) !important}.focus\:border-blue-800:focus{border-color:var(--blue-800) !important}.focus\:border-blue-900:focus{border-color:var(--blue-900) !important}.hover\:border-blue-50:hover{border-color:var(--blue-50) !important}.hover\:border-blue-100:hover{border-color:var(--blue-100) !important}.hover\:border-blue-200:hover{border-color:var(--blue-200) !important}.hover\:border-blue-300:hover{border-color:var(--blue-300) !important}.hover\:border-blue-400:hover{border-color:var(--blue-400) !important}.hover\:border-blue-500:hover{border-color:var(--blue-500) !important}.hover\:border-blue-600:hover{border-color:var(--blue-600) !important}.hover\:border-blue-700:hover{border-color:var(--blue-700) !important}.hover\:border-blue-800:hover{border-color:var(--blue-800) !important}.hover\:border-blue-900:hover{border-color:var(--blue-900) !important}.active\:border-blue-50:active{border-color:var(--blue-50) !important}.active\:border-blue-100:active{border-color:var(--blue-100) !important}.active\:border-blue-200:active{border-color:var(--blue-200) !important}.active\:border-blue-300:active{border-color:var(--blue-300) !important}.active\:border-blue-400:active{border-color:var(--blue-400) !important}.active\:border-blue-500:active{border-color:var(--blue-500) !important}.active\:border-blue-600:active{border-color:var(--blue-600) !important}.active\:border-blue-700:active{border-color:var(--blue-700) !important}.active\:border-blue-800:active{border-color:var(--blue-800) !important}.active\:border-blue-900:active{border-color:var(--blue-900) !important}.border-green-50{border-color:var(--green-50) !important}.border-green-100{border-color:var(--green-100) !important}.border-green-200{border-color:var(--green-200) !important}.border-green-300{border-color:var(--green-300) !important}.border-green-400{border-color:var(--green-400) !important}.border-green-500{border-color:var(--green-500) !important}.border-green-600{border-color:var(--green-600) !important}.border-green-700{border-color:var(--green-700) !important}.border-green-800{border-color:var(--green-800) !important}.border-green-900{border-color:var(--green-900) !important}.focus\:border-green-50:focus{border-color:var(--green-50) !important}.focus\:border-green-100:focus{border-color:var(--green-100) !important}.focus\:border-green-200:focus{border-color:var(--green-200) !important}.focus\:border-green-300:focus{border-color:var(--green-300) !important}.focus\:border-green-400:focus{border-color:var(--green-400) !important}.focus\:border-green-500:focus{border-color:var(--green-500) !important}.focus\:border-green-600:focus{border-color:var(--green-600) !important}.focus\:border-green-700:focus{border-color:var(--green-700) !important}.focus\:border-green-800:focus{border-color:var(--green-800) !important}.focus\:border-green-900:focus{border-color:var(--green-900) !important}.hover\:border-green-50:hover{border-color:var(--green-50) !important}.hover\:border-green-100:hover{border-color:var(--green-100) !important}.hover\:border-green-200:hover{border-color:var(--green-200) !important}.hover\:border-green-300:hover{border-color:var(--green-300) !important}.hover\:border-green-400:hover{border-color:var(--green-400) !important}.hover\:border-green-500:hover{border-color:var(--green-500) !important}.hover\:border-green-600:hover{border-color:var(--green-600) !important}.hover\:border-green-700:hover{border-color:var(--green-700) !important}.hover\:border-green-800:hover{border-color:var(--green-800) !important}.hover\:border-green-900:hover{border-color:var(--green-900) !important}.active\:border-green-50:active{border-color:var(--green-50) !important}.active\:border-green-100:active{border-color:var(--green-100) !important}.active\:border-green-200:active{border-color:var(--green-200) !important}.active\:border-green-300:active{border-color:var(--green-300) !important}.active\:border-green-400:active{border-color:var(--green-400) !important}.active\:border-green-500:active{border-color:var(--green-500) !important}.active\:border-green-600:active{border-color:var(--green-600) !important}.active\:border-green-700:active{border-color:var(--green-700) !important}.active\:border-green-800:active{border-color:var(--green-800) !important}.active\:border-green-900:active{border-color:var(--green-900) !important}.border-yellow-50{border-color:var(--yellow-50) !important}.border-yellow-100{border-color:var(--yellow-100) !important}.border-yellow-200{border-color:var(--yellow-200) !important}.border-yellow-300{border-color:var(--yellow-300) !important}.border-yellow-400{border-color:var(--yellow-400) !important}.border-yellow-500{border-color:var(--yellow-500) !important}.border-yellow-600{border-color:var(--yellow-600) !important}.border-yellow-700{border-color:var(--yellow-700) !important}.border-yellow-800{border-color:var(--yellow-800) !important}.border-yellow-900{border-color:var(--yellow-900) !important}.focus\:border-yellow-50:focus{border-color:var(--yellow-50) !important}.focus\:border-yellow-100:focus{border-color:var(--yellow-100) !important}.focus\:border-yellow-200:focus{border-color:var(--yellow-200) !important}.focus\:border-yellow-300:focus{border-color:var(--yellow-300) !important}.focus\:border-yellow-400:focus{border-color:var(--yellow-400) !important}.focus\:border-yellow-500:focus{border-color:var(--yellow-500) !important}.focus\:border-yellow-600:focus{border-color:var(--yellow-600) !important}.focus\:border-yellow-700:focus{border-color:var(--yellow-700) !important}.focus\:border-yellow-800:focus{border-color:var(--yellow-800) !important}.focus\:border-yellow-900:focus{border-color:var(--yellow-900) !important}.hover\:border-yellow-50:hover{border-color:var(--yellow-50) !important}.hover\:border-yellow-100:hover{border-color:var(--yellow-100) !important}.hover\:border-yellow-200:hover{border-color:var(--yellow-200) !important}.hover\:border-yellow-300:hover{border-color:var(--yellow-300) !important}.hover\:border-yellow-400:hover{border-color:var(--yellow-400) !important}.hover\:border-yellow-500:hover{border-color:var(--yellow-500) !important}.hover\:border-yellow-600:hover{border-color:var(--yellow-600) !important}.hover\:border-yellow-700:hover{border-color:var(--yellow-700) !important}.hover\:border-yellow-800:hover{border-color:var(--yellow-800) !important}.hover\:border-yellow-900:hover{border-color:var(--yellow-900) !important}.active\:border-yellow-50:active{border-color:var(--yellow-50) !important}.active\:border-yellow-100:active{border-color:var(--yellow-100) !important}.active\:border-yellow-200:active{border-color:var(--yellow-200) !important}.active\:border-yellow-300:active{border-color:var(--yellow-300) !important}.active\:border-yellow-400:active{border-color:var(--yellow-400) !important}.active\:border-yellow-500:active{border-color:var(--yellow-500) !important}.active\:border-yellow-600:active{border-color:var(--yellow-600) !important}.active\:border-yellow-700:active{border-color:var(--yellow-700) !important}.active\:border-yellow-800:active{border-color:var(--yellow-800) !important}.active\:border-yellow-900:active{border-color:var(--yellow-900) !important}.border-cyan-50{border-color:var(--cyan-50) !important}.border-cyan-100{border-color:var(--cyan-100) !important}.border-cyan-200{border-color:var(--cyan-200) !important}.border-cyan-300{border-color:var(--cyan-300) !important}.border-cyan-400{border-color:var(--cyan-400) !important}.border-cyan-500{border-color:var(--cyan-500) !important}.border-cyan-600{border-color:var(--cyan-600) !important}.border-cyan-700{border-color:var(--cyan-700) !important}.border-cyan-800{border-color:var(--cyan-800) !important}.border-cyan-900{border-color:var(--cyan-900) !important}.focus\:border-cyan-50:focus{border-color:var(--cyan-50) !important}.focus\:border-cyan-100:focus{border-color:var(--cyan-100) !important}.focus\:border-cyan-200:focus{border-color:var(--cyan-200) !important}.focus\:border-cyan-300:focus{border-color:var(--cyan-300) !important}.focus\:border-cyan-400:focus{border-color:var(--cyan-400) !important}.focus\:border-cyan-500:focus{border-color:var(--cyan-500) !important}.focus\:border-cyan-600:focus{border-color:var(--cyan-600) !important}.focus\:border-cyan-700:focus{border-color:var(--cyan-700) !important}.focus\:border-cyan-800:focus{border-color:var(--cyan-800) !important}.focus\:border-cyan-900:focus{border-color:var(--cyan-900) !important}.hover\:border-cyan-50:hover{border-color:var(--cyan-50) !important}.hover\:border-cyan-100:hover{border-color:var(--cyan-100) !important}.hover\:border-cyan-200:hover{border-color:var(--cyan-200) !important}.hover\:border-cyan-300:hover{border-color:var(--cyan-300) !important}.hover\:border-cyan-400:hover{border-color:var(--cyan-400) !important}.hover\:border-cyan-500:hover{border-color:var(--cyan-500) !important}.hover\:border-cyan-600:hover{border-color:var(--cyan-600) !important}.hover\:border-cyan-700:hover{border-color:var(--cyan-700) !important}.hover\:border-cyan-800:hover{border-color:var(--cyan-800) !important}.hover\:border-cyan-900:hover{border-color:var(--cyan-900) !important}.active\:border-cyan-50:active{border-color:var(--cyan-50) !important}.active\:border-cyan-100:active{border-color:var(--cyan-100) !important}.active\:border-cyan-200:active{border-color:var(--cyan-200) !important}.active\:border-cyan-300:active{border-color:var(--cyan-300) !important}.active\:border-cyan-400:active{border-color:var(--cyan-400) !important}.active\:border-cyan-500:active{border-color:var(--cyan-500) !important}.active\:border-cyan-600:active{border-color:var(--cyan-600) !important}.active\:border-cyan-700:active{border-color:var(--cyan-700) !important}.active\:border-cyan-800:active{border-color:var(--cyan-800) !important}.active\:border-cyan-900:active{border-color:var(--cyan-900) !important}.border-pink-50{border-color:var(--pink-50) !important}.border-pink-100{border-color:var(--pink-100) !important}.border-pink-200{border-color:var(--pink-200) !important}.border-pink-300{border-color:var(--pink-300) !important}.border-pink-400{border-color:var(--pink-400) !important}.border-pink-500{border-color:var(--pink-500) !important}.border-pink-600{border-color:var(--pink-600) !important}.border-pink-700{border-color:var(--pink-700) !important}.border-pink-800{border-color:var(--pink-800) !important}.border-pink-900{border-color:var(--pink-900) !important}.focus\:border-pink-50:focus{border-color:var(--pink-50) !important}.focus\:border-pink-100:focus{border-color:var(--pink-100) !important}.focus\:border-pink-200:focus{border-color:var(--pink-200) !important}.focus\:border-pink-300:focus{border-color:var(--pink-300) !important}.focus\:border-pink-400:focus{border-color:var(--pink-400) !important}.focus\:border-pink-500:focus{border-color:var(--pink-500) !important}.focus\:border-pink-600:focus{border-color:var(--pink-600) !important}.focus\:border-pink-700:focus{border-color:var(--pink-700) !important}.focus\:border-pink-800:focus{border-color:var(--pink-800) !important}.focus\:border-pink-900:focus{border-color:var(--pink-900) !important}.hover\:border-pink-50:hover{border-color:var(--pink-50) !important}.hover\:border-pink-100:hover{border-color:var(--pink-100) !important}.hover\:border-pink-200:hover{border-color:var(--pink-200) !important}.hover\:border-pink-300:hover{border-color:var(--pink-300) !important}.hover\:border-pink-400:hover{border-color:var(--pink-400) !important}.hover\:border-pink-500:hover{border-color:var(--pink-500) !important}.hover\:border-pink-600:hover{border-color:var(--pink-600) !important}.hover\:border-pink-700:hover{border-color:var(--pink-700) !important}.hover\:border-pink-800:hover{border-color:var(--pink-800) !important}.hover\:border-pink-900:hover{border-color:var(--pink-900) !important}.active\:border-pink-50:active{border-color:var(--pink-50) !important}.active\:border-pink-100:active{border-color:var(--pink-100) !important}.active\:border-pink-200:active{border-color:var(--pink-200) !important}.active\:border-pink-300:active{border-color:var(--pink-300) !important}.active\:border-pink-400:active{border-color:var(--pink-400) !important}.active\:border-pink-500:active{border-color:var(--pink-500) !important}.active\:border-pink-600:active{border-color:var(--pink-600) !important}.active\:border-pink-700:active{border-color:var(--pink-700) !important}.active\:border-pink-800:active{border-color:var(--pink-800) !important}.active\:border-pink-900:active{border-color:var(--pink-900) !important}.border-indigo-50{border-color:var(--indigo-50) !important}.border-indigo-100{border-color:var(--indigo-100) !important}.border-indigo-200{border-color:var(--indigo-200) !important}.border-indigo-300{border-color:var(--indigo-300) !important}.border-indigo-400{border-color:var(--indigo-400) !important}.border-indigo-500{border-color:var(--indigo-500) !important}.border-indigo-600{border-color:var(--indigo-600) !important}.border-indigo-700{border-color:var(--indigo-700) !important}.border-indigo-800{border-color:var(--indigo-800) !important}.border-indigo-900{border-color:var(--indigo-900) !important}.focus\:border-indigo-50:focus{border-color:var(--indigo-50) !important}.focus\:border-indigo-100:focus{border-color:var(--indigo-100) !important}.focus\:border-indigo-200:focus{border-color:var(--indigo-200) !important}.focus\:border-indigo-300:focus{border-color:var(--indigo-300) !important}.focus\:border-indigo-400:focus{border-color:var(--indigo-400) !important}.focus\:border-indigo-500:focus{border-color:var(--indigo-500) !important}.focus\:border-indigo-600:focus{border-color:var(--indigo-600) !important}.focus\:border-indigo-700:focus{border-color:var(--indigo-700) !important}.focus\:border-indigo-800:focus{border-color:var(--indigo-800) !important}.focus\:border-indigo-900:focus{border-color:var(--indigo-900) !important}.hover\:border-indigo-50:hover{border-color:var(--indigo-50) !important}.hover\:border-indigo-100:hover{border-color:var(--indigo-100) !important}.hover\:border-indigo-200:hover{border-color:var(--indigo-200) !important}.hover\:border-indigo-300:hover{border-color:var(--indigo-300) !important}.hover\:border-indigo-400:hover{border-color:var(--indigo-400) !important}.hover\:border-indigo-500:hover{border-color:var(--indigo-500) !important}.hover\:border-indigo-600:hover{border-color:var(--indigo-600) !important}.hover\:border-indigo-700:hover{border-color:var(--indigo-700) !important}.hover\:border-indigo-800:hover{border-color:var(--indigo-800) !important}.hover\:border-indigo-900:hover{border-color:var(--indigo-900) !important}.active\:border-indigo-50:active{border-color:var(--indigo-50) !important}.active\:border-indigo-100:active{border-color:var(--indigo-100) !important}.active\:border-indigo-200:active{border-color:var(--indigo-200) !important}.active\:border-indigo-300:active{border-color:var(--indigo-300) !important}.active\:border-indigo-400:active{border-color:var(--indigo-400) !important}.active\:border-indigo-500:active{border-color:var(--indigo-500) !important}.active\:border-indigo-600:active{border-color:var(--indigo-600) !important}.active\:border-indigo-700:active{border-color:var(--indigo-700) !important}.active\:border-indigo-800:active{border-color:var(--indigo-800) !important}.active\:border-indigo-900:active{border-color:var(--indigo-900) !important}.border-teal-50{border-color:var(--teal-50) !important}.border-teal-100{border-color:var(--teal-100) !important}.border-teal-200{border-color:var(--teal-200) !important}.border-teal-300{border-color:var(--teal-300) !important}.border-teal-400{border-color:var(--teal-400) !important}.border-teal-500{border-color:var(--teal-500) !important}.border-teal-600{border-color:var(--teal-600) !important}.border-teal-700{border-color:var(--teal-700) !important}.border-teal-800{border-color:var(--teal-800) !important}.border-teal-900{border-color:var(--teal-900) !important}.focus\:border-teal-50:focus{border-color:var(--teal-50) !important}.focus\:border-teal-100:focus{border-color:var(--teal-100) !important}.focus\:border-teal-200:focus{border-color:var(--teal-200) !important}.focus\:border-teal-300:focus{border-color:var(--teal-300) !important}.focus\:border-teal-400:focus{border-color:var(--teal-400) !important}.focus\:border-teal-500:focus{border-color:var(--teal-500) !important}.focus\:border-teal-600:focus{border-color:var(--teal-600) !important}.focus\:border-teal-700:focus{border-color:var(--teal-700) !important}.focus\:border-teal-800:focus{border-color:var(--teal-800) !important}.focus\:border-teal-900:focus{border-color:var(--teal-900) !important}.hover\:border-teal-50:hover{border-color:var(--teal-50) !important}.hover\:border-teal-100:hover{border-color:var(--teal-100) !important}.hover\:border-teal-200:hover{border-color:var(--teal-200) !important}.hover\:border-teal-300:hover{border-color:var(--teal-300) !important}.hover\:border-teal-400:hover{border-color:var(--teal-400) !important}.hover\:border-teal-500:hover{border-color:var(--teal-500) !important}.hover\:border-teal-600:hover{border-color:var(--teal-600) !important}.hover\:border-teal-700:hover{border-color:var(--teal-700) !important}.hover\:border-teal-800:hover{border-color:var(--teal-800) !important}.hover\:border-teal-900:hover{border-color:var(--teal-900) !important}.active\:border-teal-50:active{border-color:var(--teal-50) !important}.active\:border-teal-100:active{border-color:var(--teal-100) !important}.active\:border-teal-200:active{border-color:var(--teal-200) !important}.active\:border-teal-300:active{border-color:var(--teal-300) !important}.active\:border-teal-400:active{border-color:var(--teal-400) !important}.active\:border-teal-500:active{border-color:var(--teal-500) !important}.active\:border-teal-600:active{border-color:var(--teal-600) !important}.active\:border-teal-700:active{border-color:var(--teal-700) !important}.active\:border-teal-800:active{border-color:var(--teal-800) !important}.active\:border-teal-900:active{border-color:var(--teal-900) !important}.border-orange-50{border-color:var(--orange-50) !important}.border-orange-100{border-color:var(--orange-100) !important}.border-orange-200{border-color:var(--orange-200) !important}.border-orange-300{border-color:var(--orange-300) !important}.border-orange-400{border-color:var(--orange-400) !important}.border-orange-500{border-color:var(--orange-500) !important}.border-orange-600{border-color:var(--orange-600) !important}.border-orange-700{border-color:var(--orange-700) !important}.border-orange-800{border-color:var(--orange-800) !important}.border-orange-900{border-color:var(--orange-900) !important}.focus\:border-orange-50:focus{border-color:var(--orange-50) !important}.focus\:border-orange-100:focus{border-color:var(--orange-100) !important}.focus\:border-orange-200:focus{border-color:var(--orange-200) !important}.focus\:border-orange-300:focus{border-color:var(--orange-300) !important}.focus\:border-orange-400:focus{border-color:var(--orange-400) !important}.focus\:border-orange-500:focus{border-color:var(--orange-500) !important}.focus\:border-orange-600:focus{border-color:var(--orange-600) !important}.focus\:border-orange-700:focus{border-color:var(--orange-700) !important}.focus\:border-orange-800:focus{border-color:var(--orange-800) !important}.focus\:border-orange-900:focus{border-color:var(--orange-900) !important}.hover\:border-orange-50:hover{border-color:var(--orange-50) !important}.hover\:border-orange-100:hover{border-color:var(--orange-100) !important}.hover\:border-orange-200:hover{border-color:var(--orange-200) !important}.hover\:border-orange-300:hover{border-color:var(--orange-300) !important}.hover\:border-orange-400:hover{border-color:var(--orange-400) !important}.hover\:border-orange-500:hover{border-color:var(--orange-500) !important}.hover\:border-orange-600:hover{border-color:var(--orange-600) !important}.hover\:border-orange-700:hover{border-color:var(--orange-700) !important}.hover\:border-orange-800:hover{border-color:var(--orange-800) !important}.hover\:border-orange-900:hover{border-color:var(--orange-900) !important}.active\:border-orange-50:active{border-color:var(--orange-50) !important}.active\:border-orange-100:active{border-color:var(--orange-100) !important}.active\:border-orange-200:active{border-color:var(--orange-200) !important}.active\:border-orange-300:active{border-color:var(--orange-300) !important}.active\:border-orange-400:active{border-color:var(--orange-400) !important}.active\:border-orange-500:active{border-color:var(--orange-500) !important}.active\:border-orange-600:active{border-color:var(--orange-600) !important}.active\:border-orange-700:active{border-color:var(--orange-700) !important}.active\:border-orange-800:active{border-color:var(--orange-800) !important}.active\:border-orange-900:active{border-color:var(--orange-900) !important}.border-bluegray-50{border-color:var(--bluegray-50) !important}.border-bluegray-100{border-color:var(--bluegray-100) !important}.border-bluegray-200{border-color:var(--bluegray-200) !important}.border-bluegray-300{border-color:var(--bluegray-300) !important}.border-bluegray-400{border-color:var(--bluegray-400) !important}.border-bluegray-500{border-color:var(--bluegray-500) !important}.border-bluegray-600{border-color:var(--bluegray-600) !important}.border-bluegray-700{border-color:var(--bluegray-700) !important}.border-bluegray-800{border-color:var(--bluegray-800) !important}.border-bluegray-900{border-color:var(--bluegray-900) !important}.focus\:border-bluegray-50:focus{border-color:var(--bluegray-50) !important}.focus\:border-bluegray-100:focus{border-color:var(--bluegray-100) !important}.focus\:border-bluegray-200:focus{border-color:var(--bluegray-200) !important}.focus\:border-bluegray-300:focus{border-color:var(--bluegray-300) !important}.focus\:border-bluegray-400:focus{border-color:var(--bluegray-400) !important}.focus\:border-bluegray-500:focus{border-color:var(--bluegray-500) !important}.focus\:border-bluegray-600:focus{border-color:var(--bluegray-600) !important}.focus\:border-bluegray-700:focus{border-color:var(--bluegray-700) !important}.focus\:border-bluegray-800:focus{border-color:var(--bluegray-800) !important}.focus\:border-bluegray-900:focus{border-color:var(--bluegray-900) !important}.hover\:border-bluegray-50:hover{border-color:var(--bluegray-50) !important}.hover\:border-bluegray-100:hover{border-color:var(--bluegray-100) !important}.hover\:border-bluegray-200:hover{border-color:var(--bluegray-200) !important}.hover\:border-bluegray-300:hover{border-color:var(--bluegray-300) !important}.hover\:border-bluegray-400:hover{border-color:var(--bluegray-400) !important}.hover\:border-bluegray-500:hover{border-color:var(--bluegray-500) !important}.hover\:border-bluegray-600:hover{border-color:var(--bluegray-600) !important}.hover\:border-bluegray-700:hover{border-color:var(--bluegray-700) !important}.hover\:border-bluegray-800:hover{border-color:var(--bluegray-800) !important}.hover\:border-bluegray-900:hover{border-color:var(--bluegray-900) !important}.active\:border-bluegray-50:active{border-color:var(--bluegray-50) !important}.active\:border-bluegray-100:active{border-color:var(--bluegray-100) !important}.active\:border-bluegray-200:active{border-color:var(--bluegray-200) !important}.active\:border-bluegray-300:active{border-color:var(--bluegray-300) !important}.active\:border-bluegray-400:active{border-color:var(--bluegray-400) !important}.active\:border-bluegray-500:active{border-color:var(--bluegray-500) !important}.active\:border-bluegray-600:active{border-color:var(--bluegray-600) !important}.active\:border-bluegray-700:active{border-color:var(--bluegray-700) !important}.active\:border-bluegray-800:active{border-color:var(--bluegray-800) !important}.active\:border-bluegray-900:active{border-color:var(--bluegray-900) !important}.border-purple-50{border-color:var(--purple-50) !important}.border-purple-100{border-color:var(--purple-100) !important}.border-purple-200{border-color:var(--purple-200) !important}.border-purple-300{border-color:var(--purple-300) !important}.border-purple-400{border-color:var(--purple-400) !important}.border-purple-500{border-color:var(--purple-500) !important}.border-purple-600{border-color:var(--purple-600) !important}.border-purple-700{border-color:var(--purple-700) !important}.border-purple-800{border-color:var(--purple-800) !important}.border-purple-900{border-color:var(--purple-900) !important}.focus\:border-purple-50:focus{border-color:var(--purple-50) !important}.focus\:border-purple-100:focus{border-color:var(--purple-100) !important}.focus\:border-purple-200:focus{border-color:var(--purple-200) !important}.focus\:border-purple-300:focus{border-color:var(--purple-300) !important}.focus\:border-purple-400:focus{border-color:var(--purple-400) !important}.focus\:border-purple-500:focus{border-color:var(--purple-500) !important}.focus\:border-purple-600:focus{border-color:var(--purple-600) !important}.focus\:border-purple-700:focus{border-color:var(--purple-700) !important}.focus\:border-purple-800:focus{border-color:var(--purple-800) !important}.focus\:border-purple-900:focus{border-color:var(--purple-900) !important}.hover\:border-purple-50:hover{border-color:var(--purple-50) !important}.hover\:border-purple-100:hover{border-color:var(--purple-100) !important}.hover\:border-purple-200:hover{border-color:var(--purple-200) !important}.hover\:border-purple-300:hover{border-color:var(--purple-300) !important}.hover\:border-purple-400:hover{border-color:var(--purple-400) !important}.hover\:border-purple-500:hover{border-color:var(--purple-500) !important}.hover\:border-purple-600:hover{border-color:var(--purple-600) !important}.hover\:border-purple-700:hover{border-color:var(--purple-700) !important}.hover\:border-purple-800:hover{border-color:var(--purple-800) !important}.hover\:border-purple-900:hover{border-color:var(--purple-900) !important}.active\:border-purple-50:active{border-color:var(--purple-50) !important}.active\:border-purple-100:active{border-color:var(--purple-100) !important}.active\:border-purple-200:active{border-color:var(--purple-200) !important}.active\:border-purple-300:active{border-color:var(--purple-300) !important}.active\:border-purple-400:active{border-color:var(--purple-400) !important}.active\:border-purple-500:active{border-color:var(--purple-500) !important}.active\:border-purple-600:active{border-color:var(--purple-600) !important}.active\:border-purple-700:active{border-color:var(--purple-700) !important}.active\:border-purple-800:active{border-color:var(--purple-800) !important}.active\:border-purple-900:active{border-color:var(--purple-900) !important}.border-gray-50{border-color:var(--gray-50) !important}.border-gray-100{border-color:var(--gray-100) !important}.border-gray-200{border-color:var(--gray-200) !important}.border-gray-300{border-color:var(--gray-300) !important}.border-gray-400{border-color:var(--gray-400) !important}.border-gray-500{border-color:var(--gray-500) !important}.border-gray-600{border-color:var(--gray-600) !important}.border-gray-700{border-color:var(--gray-700) !important}.border-gray-800{border-color:var(--gray-800) !important}.border-gray-900{border-color:var(--gray-900) !important}.focus\:border-gray-50:focus{border-color:var(--gray-50) !important}.focus\:border-gray-100:focus{border-color:var(--gray-100) !important}.focus\:border-gray-200:focus{border-color:var(--gray-200) !important}.focus\:border-gray-300:focus{border-color:var(--gray-300) !important}.focus\:border-gray-400:focus{border-color:var(--gray-400) !important}.focus\:border-gray-500:focus{border-color:var(--gray-500) !important}.focus\:border-gray-600:focus{border-color:var(--gray-600) !important}.focus\:border-gray-700:focus{border-color:var(--gray-700) !important}.focus\:border-gray-800:focus{border-color:var(--gray-800) !important}.focus\:border-gray-900:focus{border-color:var(--gray-900) !important}.hover\:border-gray-50:hover{border-color:var(--gray-50) !important}.hover\:border-gray-100:hover{border-color:var(--gray-100) !important}.hover\:border-gray-200:hover{border-color:var(--gray-200) !important}.hover\:border-gray-300:hover{border-color:var(--gray-300) !important}.hover\:border-gray-400:hover{border-color:var(--gray-400) !important}.hover\:border-gray-500:hover{border-color:var(--gray-500) !important}.hover\:border-gray-600:hover{border-color:var(--gray-600) !important}.hover\:border-gray-700:hover{border-color:var(--gray-700) !important}.hover\:border-gray-800:hover{border-color:var(--gray-800) !important}.hover\:border-gray-900:hover{border-color:var(--gray-900) !important}.active\:border-gray-50:active{border-color:var(--gray-50) !important}.active\:border-gray-100:active{border-color:var(--gray-100) !important}.active\:border-gray-200:active{border-color:var(--gray-200) !important}.active\:border-gray-300:active{border-color:var(--gray-300) !important}.active\:border-gray-400:active{border-color:var(--gray-400) !important}.active\:border-gray-500:active{border-color:var(--gray-500) !important}.active\:border-gray-600:active{border-color:var(--gray-600) !important}.active\:border-gray-700:active{border-color:var(--gray-700) !important}.active\:border-gray-800:active{border-color:var(--gray-800) !important}.active\:border-gray-900:active{border-color:var(--gray-900) !important}.border-red-50{border-color:var(--red-50) !important}.border-red-100{border-color:var(--red-100) !important}.border-red-200{border-color:var(--red-200) !important}.border-red-300{border-color:var(--red-300) !important}.border-red-400{border-color:var(--red-400) !important}.border-red-500{border-color:var(--red-500) !important}.border-red-600{border-color:var(--red-600) !important}.border-red-700{border-color:var(--red-700) !important}.border-red-800{border-color:var(--red-800) !important}.border-red-900{border-color:var(--red-900) !important}.focus\:border-red-50:focus{border-color:var(--red-50) !important}.focus\:border-red-100:focus{border-color:var(--red-100) !important}.focus\:border-red-200:focus{border-color:var(--red-200) !important}.focus\:border-red-300:focus{border-color:var(--red-300) !important}.focus\:border-red-400:focus{border-color:var(--red-400) !important}.focus\:border-red-500:focus{border-color:var(--red-500) !important}.focus\:border-red-600:focus{border-color:var(--red-600) !important}.focus\:border-red-700:focus{border-color:var(--red-700) !important}.focus\:border-red-800:focus{border-color:var(--red-800) !important}.focus\:border-red-900:focus{border-color:var(--red-900) !important}.hover\:border-red-50:hover{border-color:var(--red-50) !important}.hover\:border-red-100:hover{border-color:var(--red-100) !important}.hover\:border-red-200:hover{border-color:var(--red-200) !important}.hover\:border-red-300:hover{border-color:var(--red-300) !important}.hover\:border-red-400:hover{border-color:var(--red-400) !important}.hover\:border-red-500:hover{border-color:var(--red-500) !important}.hover\:border-red-600:hover{border-color:var(--red-600) !important}.hover\:border-red-700:hover{border-color:var(--red-700) !important}.hover\:border-red-800:hover{border-color:var(--red-800) !important}.hover\:border-red-900:hover{border-color:var(--red-900) !important}.active\:border-red-50:active{border-color:var(--red-50) !important}.active\:border-red-100:active{border-color:var(--red-100) !important}.active\:border-red-200:active{border-color:var(--red-200) !important}.active\:border-red-300:active{border-color:var(--red-300) !important}.active\:border-red-400:active{border-color:var(--red-400) !important}.active\:border-red-500:active{border-color:var(--red-500) !important}.active\:border-red-600:active{border-color:var(--red-600) !important}.active\:border-red-700:active{border-color:var(--red-700) !important}.active\:border-red-800:active{border-color:var(--red-800) !important}.active\:border-red-900:active{border-color:var(--red-900) !important}.border-primary-50{border-color:var(--primary-50) !important}.border-primary-100{border-color:var(--primary-100) !important}.border-primary-200{border-color:var(--primary-200) !important}.border-primary-300{border-color:var(--primary-300) !important}.border-primary-400{border-color:var(--primary-400) !important}.border-primary-500{border-color:var(--primary-500) !important}.border-primary-600{border-color:var(--primary-600) !important}.border-primary-700{border-color:var(--primary-700) !important}.border-primary-800{border-color:var(--primary-800) !important}.border-primary-900{border-color:var(--primary-900) !important}.focus\:border-primary-50:focus{border-color:var(--primary-50) !important}.focus\:border-primary-100:focus{border-color:var(--primary-100) !important}.focus\:border-primary-200:focus{border-color:var(--primary-200) !important}.focus\:border-primary-300:focus{border-color:var(--primary-300) !important}.focus\:border-primary-400:focus{border-color:var(--primary-400) !important}.focus\:border-primary-500:focus{border-color:var(--primary-500) !important}.focus\:border-primary-600:focus{border-color:var(--primary-600) !important}.focus\:border-primary-700:focus{border-color:var(--primary-700) !important}.focus\:border-primary-800:focus{border-color:var(--primary-800) !important}.focus\:border-primary-900:focus{border-color:var(--primary-900) !important}.hover\:border-primary-50:hover{border-color:var(--primary-50) !important}.hover\:border-primary-100:hover{border-color:var(--primary-100) !important}.hover\:border-primary-200:hover{border-color:var(--primary-200) !important}.hover\:border-primary-300:hover{border-color:var(--primary-300) !important}.hover\:border-primary-400:hover{border-color:var(--primary-400) !important}.hover\:border-primary-500:hover{border-color:var(--primary-500) !important}.hover\:border-primary-600:hover{border-color:var(--primary-600) !important}.hover\:border-primary-700:hover{border-color:var(--primary-700) !important}.hover\:border-primary-800:hover{border-color:var(--primary-800) !important}.hover\:border-primary-900:hover{border-color:var(--primary-900) !important}.active\:border-primary-50:active{border-color:var(--primary-50) !important}.active\:border-primary-100:active{border-color:var(--primary-100) !important}.active\:border-primary-200:active{border-color:var(--primary-200) !important}.active\:border-primary-300:active{border-color:var(--primary-300) !important}.active\:border-primary-400:active{border-color:var(--primary-400) !important}.active\:border-primary-500:active{border-color:var(--primary-500) !important}.active\:border-primary-600:active{border-color:var(--primary-600) !important}.active\:border-primary-700:active{border-color:var(--primary-700) !important}.active\:border-primary-800:active{border-color:var(--primary-800) !important}.active\:border-primary-900:active{border-color:var(--primary-900) !important}.bg-white-alpha-10{background-color:rgba(255,255,255,0.1) !important}.bg-white-alpha-20{background-color:rgba(255,255,255,0.2) !important}.bg-white-alpha-30{background-color:rgba(255,255,255,0.3) !important}.bg-white-alpha-40{background-color:rgba(255,255,255,0.4) !important}.bg-white-alpha-50{background-color:rgba(255,255,255,0.5) !important}.bg-white-alpha-60{background-color:rgba(255,255,255,0.6) !important}.bg-white-alpha-70{background-color:rgba(255,255,255,0.7) !important}.bg-white-alpha-80{background-color:rgba(255,255,255,0.8) !important}.bg-white-alpha-90{background-color:rgba(255,255,255,0.9) !important}.hover\:bg-white-alpha-10:hover{background-color:rgba(255,255,255,0.1) !important}.hover\:bg-white-alpha-20:hover{background-color:rgba(255,255,255,0.2) !important}.hover\:bg-white-alpha-30:hover{background-color:rgba(255,255,255,0.3) !important}.hover\:bg-white-alpha-40:hover{background-color:rgba(255,255,255,0.4) !important}.hover\:bg-white-alpha-50:hover{background-color:rgba(255,255,255,0.5) !important}.hover\:bg-white-alpha-60:hover{background-color:rgba(255,255,255,0.6) !important}.hover\:bg-white-alpha-70:hover{background-color:rgba(255,255,255,0.7) !important}.hover\:bg-white-alpha-80:hover{background-color:rgba(255,255,255,0.8) !important}.hover\:bg-white-alpha-90:hover{background-color:rgba(255,255,255,0.9) !important}.focus\:bg-white-alpha-10:focus{background-color:rgba(255,255,255,0.1) !important}.focus\:bg-white-alpha-20:focus{background-color:rgba(255,255,255,0.2) !important}.focus\:bg-white-alpha-30:focus{background-color:rgba(255,255,255,0.3) !important}.focus\:bg-white-alpha-40:focus{background-color:rgba(255,255,255,0.4) !important}.focus\:bg-white-alpha-50:focus{background-color:rgba(255,255,255,0.5) !important}.focus\:bg-white-alpha-60:focus{background-color:rgba(255,255,255,0.6) !important}.focus\:bg-white-alpha-70:focus{background-color:rgba(255,255,255,0.7) !important}.focus\:bg-white-alpha-80:focus{background-color:rgba(255,255,255,0.8) !important}.focus\:bg-white-alpha-90:focus{background-color:rgba(255,255,255,0.9) !important}.active\:bg-white-alpha-10:active{background-color:rgba(255,255,255,0.1) !important}.active\:bg-white-alpha-20:active{background-color:rgba(255,255,255,0.2) !important}.active\:bg-white-alpha-30:active{background-color:rgba(255,255,255,0.3) !important}.active\:bg-white-alpha-40:active{background-color:rgba(255,255,255,0.4) !important}.active\:bg-white-alpha-50:active{background-color:rgba(255,255,255,0.5) !important}.active\:bg-white-alpha-60:active{background-color:rgba(255,255,255,0.6) !important}.active\:bg-white-alpha-70:active{background-color:rgba(255,255,255,0.7) !important}.active\:bg-white-alpha-80:active{background-color:rgba(255,255,255,0.8) !important}.active\:bg-white-alpha-90:active{background-color:rgba(255,255,255,0.9) !important}.bg-black-alpha-10{background-color:rgba(0,0,0,0.1) !important}.bg-black-alpha-20{background-color:rgba(0,0,0,0.2) !important}.bg-black-alpha-30{background-color:rgba(0,0,0,0.3) !important}.bg-black-alpha-40{background-color:rgba(0,0,0,0.4) !important}.bg-black-alpha-50{background-color:rgba(0,0,0,0.5) !important}.bg-black-alpha-60{background-color:rgba(0,0,0,0.6) !important}.bg-black-alpha-70{background-color:rgba(0,0,0,0.7) !important}.bg-black-alpha-80{background-color:rgba(0,0,0,0.8) !important}.bg-black-alpha-90{background-color:rgba(0,0,0,0.9) !important}.hover\:bg-black-alpha-10:hover{background-color:rgba(0,0,0,0.1) !important}.hover\:bg-black-alpha-20:hover{background-color:rgba(0,0,0,0.2) !important}.hover\:bg-black-alpha-30:hover{background-color:rgba(0,0,0,0.3) !important}.hover\:bg-black-alpha-40:hover{background-color:rgba(0,0,0,0.4) !important}.hover\:bg-black-alpha-50:hover{background-color:rgba(0,0,0,0.5) !important}.hover\:bg-black-alpha-60:hover{background-color:rgba(0,0,0,0.6) !important}.hover\:bg-black-alpha-70:hover{background-color:rgba(0,0,0,0.7) !important}.hover\:bg-black-alpha-80:hover{background-color:rgba(0,0,0,0.8) !important}.hover\:bg-black-alpha-90:hover{background-color:rgba(0,0,0,0.9) !important}.focus\:bg-black-alpha-10:focus{background-color:rgba(0,0,0,0.1) !important}.focus\:bg-black-alpha-20:focus{background-color:rgba(0,0,0,0.2) !important}.focus\:bg-black-alpha-30:focus{background-color:rgba(0,0,0,0.3) !important}.focus\:bg-black-alpha-40:focus{background-color:rgba(0,0,0,0.4) !important}.focus\:bg-black-alpha-50:focus{background-color:rgba(0,0,0,0.5) !important}.focus\:bg-black-alpha-60:focus{background-color:rgba(0,0,0,0.6) !important}.focus\:bg-black-alpha-70:focus{background-color:rgba(0,0,0,0.7) !important}.focus\:bg-black-alpha-80:focus{background-color:rgba(0,0,0,0.8) !important}.focus\:bg-black-alpha-90:focus{background-color:rgba(0,0,0,0.9) !important}.active\:bg-black-alpha-10:active{background-color:rgba(0,0,0,0.1) !important}.active\:bg-black-alpha-20:active{background-color:rgba(0,0,0,0.2) !important}.active\:bg-black-alpha-30:active{background-color:rgba(0,0,0,0.3) !important}.active\:bg-black-alpha-40:active{background-color:rgba(0,0,0,0.4) !important}.active\:bg-black-alpha-50:active{background-color:rgba(0,0,0,0.5) !important}.active\:bg-black-alpha-60:active{background-color:rgba(0,0,0,0.6) !important}.active\:bg-black-alpha-70:active{background-color:rgba(0,0,0,0.7) !important}.active\:bg-black-alpha-80:active{background-color:rgba(0,0,0,0.8) !important}.active\:bg-black-alpha-90:active{background-color:rgba(0,0,0,0.9) !important}.border-white-alpha-10{border-color:rgba(255,255,255,0.1) !important}.border-white-alpha-20{border-color:rgba(255,255,255,0.2) !important}.border-white-alpha-30{border-color:rgba(255,255,255,0.3) !important}.border-white-alpha-40{border-color:rgba(255,255,255,0.4) !important}.border-white-alpha-50{border-color:rgba(255,255,255,0.5) !important}.border-white-alpha-60{border-color:rgba(255,255,255,0.6) !important}.border-white-alpha-70{border-color:rgba(255,255,255,0.7) !important}.border-white-alpha-80{border-color:rgba(255,255,255,0.8) !important}.border-white-alpha-90{border-color:rgba(255,255,255,0.9) !important}.hover\:border-white-alpha-10:hover{border-color:rgba(255,255,255,0.1) !important}.hover\:border-white-alpha-20:hover{border-color:rgba(255,255,255,0.2) !important}.hover\:border-white-alpha-30:hover{border-color:rgba(255,255,255,0.3) !important}.hover\:border-white-alpha-40:hover{border-color:rgba(255,255,255,0.4) !important}.hover\:border-white-alpha-50:hover{border-color:rgba(255,255,255,0.5) !important}.hover\:border-white-alpha-60:hover{border-color:rgba(255,255,255,0.6) !important}.hover\:border-white-alpha-70:hover{border-color:rgba(255,255,255,0.7) !important}.hover\:border-white-alpha-80:hover{border-color:rgba(255,255,255,0.8) !important}.hover\:border-white-alpha-90:hover{border-color:rgba(255,255,255,0.9) !important}.focus\:border-white-alpha-10:focus{border-color:rgba(255,255,255,0.1) !important}.focus\:border-white-alpha-20:focus{border-color:rgba(255,255,255,0.2) !important}.focus\:border-white-alpha-30:focus{border-color:rgba(255,255,255,0.3) !important}.focus\:border-white-alpha-40:focus{border-color:rgba(255,255,255,0.4) !important}.focus\:border-white-alpha-50:focus{border-color:rgba(255,255,255,0.5) !important}.focus\:border-white-alpha-60:focus{border-color:rgba(255,255,255,0.6) !important}.focus\:border-white-alpha-70:focus{border-color:rgba(255,255,255,0.7) !important}.focus\:border-white-alpha-80:focus{border-color:rgba(255,255,255,0.8) !important}.focus\:border-white-alpha-90:focus{border-color:rgba(255,255,255,0.9) !important}.active\:border-white-alpha-10:active{border-color:rgba(255,255,255,0.1) !important}.active\:border-white-alpha-20:active{border-color:rgba(255,255,255,0.2) !important}.active\:border-white-alpha-30:active{border-color:rgba(255,255,255,0.3) !important}.active\:border-white-alpha-40:active{border-color:rgba(255,255,255,0.4) !important}.active\:border-white-alpha-50:active{border-color:rgba(255,255,255,0.5) !important}.active\:border-white-alpha-60:active{border-color:rgba(255,255,255,0.6) !important}.active\:border-white-alpha-70:active{border-color:rgba(255,255,255,0.7) !important}.active\:border-white-alpha-80:active{border-color:rgba(255,255,255,0.8) !important}.active\:border-white-alpha-90:active{border-color:rgba(255,255,255,0.9) !important}.border-black-alpha-10{border-color:rgba(0,0,0,0.1) !important}.border-black-alpha-20{border-color:rgba(0,0,0,0.2) !important}.border-black-alpha-30{border-color:rgba(0,0,0,0.3) !important}.border-black-alpha-40{border-color:rgba(0,0,0,0.4) !important}.border-black-alpha-50{border-color:rgba(0,0,0,0.5) !important}.border-black-alpha-60{border-color:rgba(0,0,0,0.6) !important}.border-black-alpha-70{border-color:rgba(0,0,0,0.7) !important}.border-black-alpha-80{border-color:rgba(0,0,0,0.8) !important}.border-black-alpha-90{border-color:rgba(0,0,0,0.9) !important}.hover\:border-black-alpha-10:hover{border-color:rgba(0,0,0,0.1) !important}.hover\:border-black-alpha-20:hover{border-color:rgba(0,0,0,0.2) !important}.hover\:border-black-alpha-30:hover{border-color:rgba(0,0,0,0.3) !important}.hover\:border-black-alpha-40:hover{border-color:rgba(0,0,0,0.4) !important}.hover\:border-black-alpha-50:hover{border-color:rgba(0,0,0,0.5) !important}.hover\:border-black-alpha-60:hover{border-color:rgba(0,0,0,0.6) !important}.hover\:border-black-alpha-70:hover{border-color:rgba(0,0,0,0.7) !important}.hover\:border-black-alpha-80:hover{border-color:rgba(0,0,0,0.8) !important}.hover\:border-black-alpha-90:hover{border-color:rgba(0,0,0,0.9) !important}.focus\:border-black-alpha-10:focus{border-color:rgba(0,0,0,0.1) !important}.focus\:border-black-alpha-20:focus{border-color:rgba(0,0,0,0.2) !important}.focus\:border-black-alpha-30:focus{border-color:rgba(0,0,0,0.3) !important}.focus\:border-black-alpha-40:focus{border-color:rgba(0,0,0,0.4) !important}.focus\:border-black-alpha-50:focus{border-color:rgba(0,0,0,0.5) !important}.focus\:border-black-alpha-60:focus{border-color:rgba(0,0,0,0.6) !important}.focus\:border-black-alpha-70:focus{border-color:rgba(0,0,0,0.7) !important}.focus\:border-black-alpha-80:focus{border-color:rgba(0,0,0,0.8) !important}.focus\:border-black-alpha-90:focus{border-color:rgba(0,0,0,0.9) !important}.active\:border-black-alpha-10:active{border-color:rgba(0,0,0,0.1) !important}.active\:border-black-alpha-20:active{border-color:rgba(0,0,0,0.2) !important}.active\:border-black-alpha-30:active{border-color:rgba(0,0,0,0.3) !important}.active\:border-black-alpha-40:active{border-color:rgba(0,0,0,0.4) !important}.active\:border-black-alpha-50:active{border-color:rgba(0,0,0,0.5) !important}.active\:border-black-alpha-60:active{border-color:rgba(0,0,0,0.6) !important}.active\:border-black-alpha-70:active{border-color:rgba(0,0,0,0.7) !important}.active\:border-black-alpha-80:active{border-color:rgba(0,0,0,0.8) !important}.active\:border-black-alpha-90:active{border-color:rgba(0,0,0,0.9) !important}.text-white-alpha-10{color:rgba(255,255,255,0.1) !important}.text-white-alpha-20{color:rgba(255,255,255,0.2) !important}.text-white-alpha-30{color:rgba(255,255,255,0.3) !important}.text-white-alpha-40{color:rgba(255,255,255,0.4) !important}.text-white-alpha-50{color:rgba(255,255,255,0.5) !important}.text-white-alpha-60{color:rgba(255,255,255,0.6) !important}.text-white-alpha-70{color:rgba(255,255,255,0.7) !important}.text-white-alpha-80{color:rgba(255,255,255,0.8) !important}.text-white-alpha-90{color:rgba(255,255,255,0.9) !important}.hover\:text-white-alpha-10:hover{color:rgba(255,255,255,0.1) !important}.hover\:text-white-alpha-20:hover{color:rgba(255,255,255,0.2) !important}.hover\:text-white-alpha-30:hover{color:rgba(255,255,255,0.3) !important}.hover\:text-white-alpha-40:hover{color:rgba(255,255,255,0.4) !important}.hover\:text-white-alpha-50:hover{color:rgba(255,255,255,0.5) !important}.hover\:text-white-alpha-60:hover{color:rgba(255,255,255,0.6) !important}.hover\:text-white-alpha-70:hover{color:rgba(255,255,255,0.7) !important}.hover\:text-white-alpha-80:hover{color:rgba(255,255,255,0.8) !important}.hover\:text-white-alpha-90:hover{color:rgba(255,255,255,0.9) !important}.focus\:text-white-alpha-10:focus{color:rgba(255,255,255,0.1) !important}.focus\:text-white-alpha-20:focus{color:rgba(255,255,255,0.2) !important}.focus\:text-white-alpha-30:focus{color:rgba(255,255,255,0.3) !important}.focus\:text-white-alpha-40:focus{color:rgba(255,255,255,0.4) !important}.focus\:text-white-alpha-50:focus{color:rgba(255,255,255,0.5) !important}.focus\:text-white-alpha-60:focus{color:rgba(255,255,255,0.6) !important}.focus\:text-white-alpha-70:focus{color:rgba(255,255,255,0.7) !important}.focus\:text-white-alpha-80:focus{color:rgba(255,255,255,0.8) !important}.focus\:text-white-alpha-90:focus{color:rgba(255,255,255,0.9) !important}.active\:text-white-alpha-10:active{color:rgba(255,255,255,0.1) !important}.active\:text-white-alpha-20:active{color:rgba(255,255,255,0.2) !important}.active\:text-white-alpha-30:active{color:rgba(255,255,255,0.3) !important}.active\:text-white-alpha-40:active{color:rgba(255,255,255,0.4) !important}.active\:text-white-alpha-50:active{color:rgba(255,255,255,0.5) !important}.active\:text-white-alpha-60:active{color:rgba(255,255,255,0.6) !important}.active\:text-white-alpha-70:active{color:rgba(255,255,255,0.7) !important}.active\:text-white-alpha-80:active{color:rgba(255,255,255,0.8) !important}.active\:text-white-alpha-90:active{color:rgba(255,255,255,0.9) !important}.text-black-alpha-10{color:rgba(0,0,0,0.1) !important}.text-black-alpha-20{color:rgba(0,0,0,0.2) !important}.text-black-alpha-30{color:rgba(0,0,0,0.3) !important}.text-black-alpha-40{color:rgba(0,0,0,0.4) !important}.text-black-alpha-50{color:rgba(0,0,0,0.5) !important}.text-black-alpha-60{color:rgba(0,0,0,0.6) !important}.text-black-alpha-70{color:rgba(0,0,0,0.7) !important}.text-black-alpha-80{color:rgba(0,0,0,0.8) !important}.text-black-alpha-90{color:rgba(0,0,0,0.9) !important}.hover\:text-black-alpha-10:hover{color:rgba(0,0,0,0.1) !important}.hover\:text-black-alpha-20:hover{color:rgba(0,0,0,0.2) !important}.hover\:text-black-alpha-30:hover{color:rgba(0,0,0,0.3) !important}.hover\:text-black-alpha-40:hover{color:rgba(0,0,0,0.4) !important}.hover\:text-black-alpha-50:hover{color:rgba(0,0,0,0.5) !important}.hover\:text-black-alpha-60:hover{color:rgba(0,0,0,0.6) !important}.hover\:text-black-alpha-70:hover{color:rgba(0,0,0,0.7) !important}.hover\:text-black-alpha-80:hover{color:rgba(0,0,0,0.8) !important}.hover\:text-black-alpha-90:hover{color:rgba(0,0,0,0.9) !important}.focus\:text-black-alpha-10:focus{color:rgba(0,0,0,0.1) !important}.focus\:text-black-alpha-20:focus{color:rgba(0,0,0,0.2) !important}.focus\:text-black-alpha-30:focus{color:rgba(0,0,0,0.3) !important}.focus\:text-black-alpha-40:focus{color:rgba(0,0,0,0.4) !important}.focus\:text-black-alpha-50:focus{color:rgba(0,0,0,0.5) !important}.focus\:text-black-alpha-60:focus{color:rgba(0,0,0,0.6) !important}.focus\:text-black-alpha-70:focus{color:rgba(0,0,0,0.7) !important}.focus\:text-black-alpha-80:focus{color:rgba(0,0,0,0.8) !important}.focus\:text-black-alpha-90:focus{color:rgba(0,0,0,0.9) !important}.active\:text-black-alpha-10:active{color:rgba(0,0,0,0.1) !important}.active\:text-black-alpha-20:active{color:rgba(0,0,0,0.2) !important}.active\:text-black-alpha-30:active{color:rgba(0,0,0,0.3) !important}.active\:text-black-alpha-40:active{color:rgba(0,0,0,0.4) !important}.active\:text-black-alpha-50:active{color:rgba(0,0,0,0.5) !important}.active\:text-black-alpha-60:active{color:rgba(0,0,0,0.6) !important}.active\:text-black-alpha-70:active{color:rgba(0,0,0,0.7) !important}.active\:text-black-alpha-80:active{color:rgba(0,0,0,0.8) !important}.active\:text-black-alpha-90:active{color:rgba(0,0,0,0.9) !important}.text-primary{color:var(--primary-color) !important}.bg-primary{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.bg-primary-reverse{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.bg-white{background-color:#ffffff !important}.border-primary{border-color:var(--primary-color) !important}.text-white{color:#ffffff !important}.border-white{border-color:#ffffff !important}.text-color{color:var(--text-color) !important}.text-color-secondary{color:var(--text-color-secondary) !important}.surface-ground{background-color:var(--surface-ground) !important}.surface-section{background-color:var(--surface-section) !important}.surface-card{background-color:var(--surface-card) !important}.surface-overlay{background-color:var(--surface-overlay) !important}.surface-hover{background-color:var(--surface-hover) !important}.surface-border{border-color:var(--surface-border) !important}.focus\:text-primary:focus{color:var(--primary-color) !important}.hover\:text-primary:hover{color:var(--primary-color) !important}.active\:text-primary:active{color:var(--primary-color) !important}.focus\:bg-primary:focus{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.hover\:bg-primary:hover{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.active\:bg-primary:active{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.focus\:bg-primary-reverse:focus{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.hover\:bg-primary-reverse:hover{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.active\:bg-primary-reverse:active{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.focus\:bg-white:focus{background-color:#ffffff !important}.hover\:bg-white:hover{background-color:#ffffff !important}.active\:bg-white:active{background-color:#ffffff !important}.focus\:border-primary:focus{border-color:var(--primary-color) !important}.hover\:border-primary:hover{border-color:var(--primary-color) !important}.active\:border-primary:active{border-color:var(--primary-color) !important}.focus\:text-white:focus{color:#ffffff !important}.hover\:text-white:hover{color:#ffffff !important}.active\:text-white:active{color:#ffffff !important}.focus\:border-white:focus{border-color:#ffffff !important}.hover\:border-white:hover{border-color:#ffffff !important}.active\:border-white:active{border-color:#ffffff !important}.focus\:text-color:focus{color:var(--text-color) !important}.hover\:text-color:hover{color:var(--text-color) !important}.active\:text-color:active{color:var(--text-color) !important}.focus\:text-color-secondary:focus{color:var(--text-color-secondary) !important}.hover\:text-color-secondary:hover{color:var(--text-color-secondary) !important}.active\:text-color-secondary:active{color:var(--text-color-secondary) !important}.focus\:surface-ground:focus{background-color:var(--surface-ground) !important}.hover\:surface-ground:hover{background-color:var(--surface-ground) !important}.active\:surface-ground:active{background-color:var(--surface-ground) !important}.focus\:surface-section:focus{background-color:var(--surface-section) !important}.hover\:surface-section:hover{background-color:var(--surface-section) !important}.active\:surface-section:active{background-color:var(--surface-section) !important}.focus\:surface-card:focus{background-color:var(--surface-card) !important}.hover\:surface-card:hover{background-color:var(--surface-card) !important}.active\:surface-card:active{background-color:var(--surface-card) !important}.focus\:surface-overlay:focus{background-color:var(--surface-overlay) !important}.hover\:surface-overlay:hover{background-color:var(--surface-overlay) !important}.active\:surface-overlay:active{background-color:var(--surface-overlay) !important}.focus\:surface-hover:focus{background-color:var(--surface-hover) !important}.hover\:surface-hover:hover{background-color:var(--surface-hover) !important}.active\:surface-hover:active{background-color:var(--surface-hover) !important}.focus\:surface-border:focus{border-color:var(--surface-border) !important}.hover\:surface-border:hover{border-color:var(--surface-border) !important}.active\:surface-border:active{border-color:var(--surface-border) !important}@media screen and (min-width: 576px){.sm\:text-primary{color:var(--primary-color) !important}.sm\:bg-primary{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.sm\:bg-primary-reverse{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.sm\:bg-white{background-color:#ffffff !important}.sm\:border-primary{border-color:var(--primary-color) !important}.sm\:text-white{color:#ffffff !important}.sm\:border-white{border-color:#ffffff !important}.sm\:text-color{color:var(--text-color) !important}.sm\:text-color-secondary{color:var(--text-color-secondary) !important}.sm\:surface-ground{background-color:var(--surface-ground) !important}.sm\:surface-section{background-color:var(--surface-section) !important}.sm\:surface-card{background-color:var(--surface-card) !important}.sm\:surface-overlay{background-color:var(--surface-overlay) !important}.sm\:surface-hover{background-color:var(--surface-hover) !important}.sm\:surface-border{border-color:var(--surface-border) !important}.sm\:focus\:text-primary:focus{color:var(--primary-color) !important}.sm\:hover\:text-primary:hover{color:var(--primary-color) !important}.sm\:active\:text-primary:active{color:var(--primary-color) !important}.sm\:focus\:bg-primary:focus{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.sm\:hover\:bg-primary:hover{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.sm\:active\:bg-primary:active{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.sm\:focus\:bg-primary-reverse:focus{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.sm\:hover\:bg-primary-reverse:hover{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.sm\:active\:bg-primary-reverse:active{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.sm\:focus\:bg-white:focus{background-color:#ffffff !important}.sm\:hover\:bg-white:hover{background-color:#ffffff !important}.sm\:active\:bg-white:active{background-color:#ffffff !important}.sm\:focus\:border-primary:focus{border-color:var(--primary-color) !important}.sm\:hover\:border-primary:hover{border-color:var(--primary-color) !important}.sm\:active\:border-primary:active{border-color:var(--primary-color) !important}.sm\:focus\:text-white:focus{color:#ffffff !important}.sm\:hover\:text-white:hover{color:#ffffff !important}.sm\:active\:text-white:active{color:#ffffff !important}.sm\:focus\:border-white:focus{border-color:#ffffff !important}.sm\:hover\:border-white:hover{border-color:#ffffff !important}.sm\:active\:border-white:active{border-color:#ffffff !important}.sm\:focus\:text-color:focus{color:var(--text-color) !important}.sm\:hover\:text-color:hover{color:var(--text-color) !important}.sm\:active\:text-color:active{color:var(--text-color) !important}.sm\:focus\:text-color-secondary:focus{color:var(--text-color-secondary) !important}.sm\:hover\:text-color-secondary:hover{color:var(--text-color-secondary) !important}.sm\:active\:text-color-secondary:active{color:var(--text-color-secondary) !important}.sm\:focus\:surface-ground:focus{background-color:var(--surface-ground) !important}.sm\:hover\:surface-ground:hover{background-color:var(--surface-ground) !important}.sm\:active\:surface-ground:active{background-color:var(--surface-ground) !important}.sm\:focus\:surface-section:focus{background-color:var(--surface-section) !important}.sm\:hover\:surface-section:hover{background-color:var(--surface-section) !important}.sm\:active\:surface-section:active{background-color:var(--surface-section) !important}.sm\:focus\:surface-card:focus{background-color:var(--surface-card) !important}.sm\:hover\:surface-card:hover{background-color:var(--surface-card) !important}.sm\:active\:surface-card:active{background-color:var(--surface-card) !important}.sm\:focus\:surface-overlay:focus{background-color:var(--surface-overlay) !important}.sm\:hover\:surface-overlay:hover{background-color:var(--surface-overlay) !important}.sm\:active\:surface-overlay:active{background-color:var(--surface-overlay) !important}.sm\:focus\:surface-hover:focus{background-color:var(--surface-hover) !important}.sm\:hover\:surface-hover:hover{background-color:var(--surface-hover) !important}.sm\:active\:surface-hover:active{background-color:var(--surface-hover) !important}.sm\:focus\:surface-border:focus{border-color:var(--surface-border) !important}.sm\:hover\:surface-border:hover{border-color:var(--surface-border) !important}.sm\:active\:surface-border:active{border-color:var(--surface-border) !important}}@media screen and (min-width: 768px){.md\:text-primary{color:var(--primary-color) !important}.md\:bg-primary{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.md\:bg-primary-reverse{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.md\:bg-white{background-color:#ffffff !important}.md\:border-primary{border-color:var(--primary-color) !important}.md\:text-white{color:#ffffff !important}.md\:border-white{border-color:#ffffff !important}.md\:text-color{color:var(--text-color) !important}.md\:text-color-secondary{color:var(--text-color-secondary) !important}.md\:surface-ground{background-color:var(--surface-ground) !important}.md\:surface-section{background-color:var(--surface-section) !important}.md\:surface-card{background-color:var(--surface-card) !important}.md\:surface-overlay{background-color:var(--surface-overlay) !important}.md\:surface-hover{background-color:var(--surface-hover) !important}.md\:surface-border{border-color:var(--surface-border) !important}.md\:focus\:text-primary:focus{color:var(--primary-color) !important}.md\:hover\:text-primary:hover{color:var(--primary-color) !important}.md\:active\:text-primary:active{color:var(--primary-color) !important}.md\:focus\:bg-primary:focus{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.md\:hover\:bg-primary:hover{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.md\:active\:bg-primary:active{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.md\:focus\:bg-primary-reverse:focus{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.md\:hover\:bg-primary-reverse:hover{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.md\:active\:bg-primary-reverse:active{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.md\:focus\:bg-white:focus{background-color:#ffffff !important}.md\:hover\:bg-white:hover{background-color:#ffffff !important}.md\:active\:bg-white:active{background-color:#ffffff !important}.md\:focus\:border-primary:focus{border-color:var(--primary-color) !important}.md\:hover\:border-primary:hover{border-color:var(--primary-color) !important}.md\:active\:border-primary:active{border-color:var(--primary-color) !important}.md\:focus\:text-white:focus{color:#ffffff !important}.md\:hover\:text-white:hover{color:#ffffff !important}.md\:active\:text-white:active{color:#ffffff !important}.md\:focus\:border-white:focus{border-color:#ffffff !important}.md\:hover\:border-white:hover{border-color:#ffffff !important}.md\:active\:border-white:active{border-color:#ffffff !important}.md\:focus\:text-color:focus{color:var(--text-color) !important}.md\:hover\:text-color:hover{color:var(--text-color) !important}.md\:active\:text-color:active{color:var(--text-color) !important}.md\:focus\:text-color-secondary:focus{color:var(--text-color-secondary) !important}.md\:hover\:text-color-secondary:hover{color:var(--text-color-secondary) !important}.md\:active\:text-color-secondary:active{color:var(--text-color-secondary) !important}.md\:focus\:surface-ground:focus{background-color:var(--surface-ground) !important}.md\:hover\:surface-ground:hover{background-color:var(--surface-ground) !important}.md\:active\:surface-ground:active{background-color:var(--surface-ground) !important}.md\:focus\:surface-section:focus{background-color:var(--surface-section) !important}.md\:hover\:surface-section:hover{background-color:var(--surface-section) !important}.md\:active\:surface-section:active{background-color:var(--surface-section) !important}.md\:focus\:surface-card:focus{background-color:var(--surface-card) !important}.md\:hover\:surface-card:hover{background-color:var(--surface-card) !important}.md\:active\:surface-card:active{background-color:var(--surface-card) !important}.md\:focus\:surface-overlay:focus{background-color:var(--surface-overlay) !important}.md\:hover\:surface-overlay:hover{background-color:var(--surface-overlay) !important}.md\:active\:surface-overlay:active{background-color:var(--surface-overlay) !important}.md\:focus\:surface-hover:focus{background-color:var(--surface-hover) !important}.md\:hover\:surface-hover:hover{background-color:var(--surface-hover) !important}.md\:active\:surface-hover:active{background-color:var(--surface-hover) !important}.md\:focus\:surface-border:focus{border-color:var(--surface-border) !important}.md\:hover\:surface-border:hover{border-color:var(--surface-border) !important}.md\:active\:surface-border:active{border-color:var(--surface-border) !important}}@media screen and (min-width: 992px){.lg\:text-primary{color:var(--primary-color) !important}.lg\:bg-primary{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.lg\:bg-primary-reverse{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.lg\:bg-white{background-color:#ffffff !important}.lg\:border-primary{border-color:var(--primary-color) !important}.lg\:text-white{color:#ffffff !important}.lg\:border-white{border-color:#ffffff !important}.lg\:text-color{color:var(--text-color) !important}.lg\:text-color-secondary{color:var(--text-color-secondary) !important}.lg\:surface-ground{background-color:var(--surface-ground) !important}.lg\:surface-section{background-color:var(--surface-section) !important}.lg\:surface-card{background-color:var(--surface-card) !important}.lg\:surface-overlay{background-color:var(--surface-overlay) !important}.lg\:surface-hover{background-color:var(--surface-hover) !important}.lg\:surface-border{border-color:var(--surface-border) !important}.lg\:focus\:text-primary:focus{color:var(--primary-color) !important}.lg\:hover\:text-primary:hover{color:var(--primary-color) !important}.lg\:active\:text-primary:active{color:var(--primary-color) !important}.lg\:focus\:bg-primary:focus{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.lg\:hover\:bg-primary:hover{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.lg\:active\:bg-primary:active{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.lg\:focus\:bg-primary-reverse:focus{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.lg\:hover\:bg-primary-reverse:hover{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.lg\:active\:bg-primary-reverse:active{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.lg\:focus\:bg-white:focus{background-color:#ffffff !important}.lg\:hover\:bg-white:hover{background-color:#ffffff !important}.lg\:active\:bg-white:active{background-color:#ffffff !important}.lg\:focus\:border-primary:focus{border-color:var(--primary-color) !important}.lg\:hover\:border-primary:hover{border-color:var(--primary-color) !important}.lg\:active\:border-primary:active{border-color:var(--primary-color) !important}.lg\:focus\:text-white:focus{color:#ffffff !important}.lg\:hover\:text-white:hover{color:#ffffff !important}.lg\:active\:text-white:active{color:#ffffff !important}.lg\:focus\:border-white:focus{border-color:#ffffff !important}.lg\:hover\:border-white:hover{border-color:#ffffff !important}.lg\:active\:border-white:active{border-color:#ffffff !important}.lg\:focus\:text-color:focus{color:var(--text-color) !important}.lg\:hover\:text-color:hover{color:var(--text-color) !important}.lg\:active\:text-color:active{color:var(--text-color) !important}.lg\:focus\:text-color-secondary:focus{color:var(--text-color-secondary) !important}.lg\:hover\:text-color-secondary:hover{color:var(--text-color-secondary) !important}.lg\:active\:text-color-secondary:active{color:var(--text-color-secondary) !important}.lg\:focus\:surface-ground:focus{background-color:var(--surface-ground) !important}.lg\:hover\:surface-ground:hover{background-color:var(--surface-ground) !important}.lg\:active\:surface-ground:active{background-color:var(--surface-ground) !important}.lg\:focus\:surface-section:focus{background-color:var(--surface-section) !important}.lg\:hover\:surface-section:hover{background-color:var(--surface-section) !important}.lg\:active\:surface-section:active{background-color:var(--surface-section) !important}.lg\:focus\:surface-card:focus{background-color:var(--surface-card) !important}.lg\:hover\:surface-card:hover{background-color:var(--surface-card) !important}.lg\:active\:surface-card:active{background-color:var(--surface-card) !important}.lg\:focus\:surface-overlay:focus{background-color:var(--surface-overlay) !important}.lg\:hover\:surface-overlay:hover{background-color:var(--surface-overlay) !important}.lg\:active\:surface-overlay:active{background-color:var(--surface-overlay) !important}.lg\:focus\:surface-hover:focus{background-color:var(--surface-hover) !important}.lg\:hover\:surface-hover:hover{background-color:var(--surface-hover) !important}.lg\:active\:surface-hover:active{background-color:var(--surface-hover) !important}.lg\:focus\:surface-border:focus{border-color:var(--surface-border) !important}.lg\:hover\:surface-border:hover{border-color:var(--surface-border) !important}.lg\:active\:surface-border:active{border-color:var(--surface-border) !important}}@media screen and (min-width: 1200px){.xl\:text-primary{color:var(--primary-color) !important}.xl\:bg-primary{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.xl\:bg-primary-reverse{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.xl\:bg-white{background-color:#ffffff !important}.xl\:border-primary{border-color:var(--primary-color) !important}.xl\:text-white{color:#ffffff !important}.xl\:border-white{border-color:#ffffff !important}.xl\:text-color{color:var(--text-color) !important}.xl\:text-color-secondary{color:var(--text-color-secondary) !important}.xl\:surface-ground{background-color:var(--surface-ground) !important}.xl\:surface-section{background-color:var(--surface-section) !important}.xl\:surface-card{background-color:var(--surface-card) !important}.xl\:surface-overlay{background-color:var(--surface-overlay) !important}.xl\:surface-hover{background-color:var(--surface-hover) !important}.xl\:surface-border{border-color:var(--surface-border) !important}.xl\:focus\:text-primary:focus{color:var(--primary-color) !important}.xl\:hover\:text-primary:hover{color:var(--primary-color) !important}.xl\:active\:text-primary:active{color:var(--primary-color) !important}.xl\:focus\:bg-primary:focus{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.xl\:hover\:bg-primary:hover{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.xl\:active\:bg-primary:active{color:var(--primary-color-text) !important;background-color:var(--primary-color) !important}.xl\:focus\:bg-primary-reverse:focus{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.xl\:hover\:bg-primary-reverse:hover{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.xl\:active\:bg-primary-reverse:active{color:var(--primary-color) !important;background-color:var(--primary-color-text) !important}.xl\:focus\:bg-white:focus{background-color:#ffffff !important}.xl\:hover\:bg-white:hover{background-color:#ffffff !important}.xl\:active\:bg-white:active{background-color:#ffffff !important}.xl\:focus\:border-primary:focus{border-color:var(--primary-color) !important}.xl\:hover\:border-primary:hover{border-color:var(--primary-color) !important}.xl\:active\:border-primary:active{border-color:var(--primary-color) !important}.xl\:focus\:text-white:focus{color:#ffffff !important}.xl\:hover\:text-white:hover{color:#ffffff !important}.xl\:active\:text-white:active{color:#ffffff !important}.xl\:focus\:border-white:focus{border-color:#ffffff !important}.xl\:hover\:border-white:hover{border-color:#ffffff !important}.xl\:active\:border-white:active{border-color:#ffffff !important}.xl\:focus\:text-color:focus{color:var(--text-color) !important}.xl\:hover\:text-color:hover{color:var(--text-color) !important}.xl\:active\:text-color:active{color:var(--text-color) !important}.xl\:focus\:text-color-secondary:focus{color:var(--text-color-secondary) !important}.xl\:hover\:text-color-secondary:hover{color:var(--text-color-secondary) !important}.xl\:active\:text-color-secondary:active{color:var(--text-color-secondary) !important}.xl\:focus\:surface-ground:focus{background-color:var(--surface-ground) !important}.xl\:hover\:surface-ground:hover{background-color:var(--surface-ground) !important}.xl\:active\:surface-ground:active{background-color:var(--surface-ground) !important}.xl\:focus\:surface-section:focus{background-color:var(--surface-section) !important}.xl\:hover\:surface-section:hover{background-color:var(--surface-section) !important}.xl\:active\:surface-section:active{background-color:var(--surface-section) !important}.xl\:focus\:surface-card:focus{background-color:var(--surface-card) !important}.xl\:hover\:surface-card:hover{background-color:var(--surface-card) !important}.xl\:active\:surface-card:active{background-color:var(--surface-card) !important}.xl\:focus\:surface-overlay:focus{background-color:var(--surface-overlay) !important}.xl\:hover\:surface-overlay:hover{background-color:var(--surface-overlay) !important}.xl\:active\:surface-overlay:active{background-color:var(--surface-overlay) !important}.xl\:focus\:surface-hover:focus{background-color:var(--surface-hover) !important}.xl\:hover\:surface-hover:hover{background-color:var(--surface-hover) !important}.xl\:active\:surface-hover:active{background-color:var(--surface-hover) !important}.xl\:focus\:surface-border:focus{border-color:var(--surface-border) !important}.xl\:hover\:surface-border:hover{border-color:var(--surface-border) !important}.xl\:active\:surface-border:active{border-color:var(--surface-border) !important}}.field{margin-bottom:1rem}.field>label{display:inline-block;margin-bottom:.5rem}.field.grid>label{display:flex;align-items:center}.field>small{margin-top:.25rem}.field.grid,.formgrid.grid{margin-top:0}.field.grid .col-fixed,.formgrid.grid .col-fixed,.field.grid .col,.formgrid.grid .col,.field.grid .col-1,.formgrid.grid .col-1,.field.grid .col-2,.formgrid.grid .col-2,.field.grid .col-3,.formgrid.grid .col-3,.field.grid .col-4,.formgrid.grid .col-4,.field.grid .col-5,.formgrid.grid .col-5,.field.grid .col-6,.formgrid.grid .col-6,.field.grid .col-7,.formgrid.grid .col-7,.field.grid .col-8,.formgrid.grid .col-8,.field.grid .col-9,.formgrid.grid .col-9,.field.grid .col-10,.formgrid.grid .col-10,.field.grid .col-11,.formgrid.grid .col-11,.field.grid .col-12,.formgrid.grid .col-12{padding-top:0;padding-bottom:0}.formgroup-inline{display:flex;flex-wrap:wrap;align-items:flex-start}.formgroup-inline .field,.formgroup-inline .field-checkbox,.formgroup-inline .field-radiobutton{margin-right:1rem}.formgroup-inline .field>label,.formgroup-inline .field-checkbox>label,.formgroup-inline .field-radiobutton>label{margin-right:.5rem;margin-bottom:0}.field-checkbox,.field-radiobutton{margin-bottom:1rem;display:flex;align-items:center}.field-checkbox>label,.field-radiobutton>label{margin-left:.5rem;line-height:1}.hidden{display:none !important}.block{display:block !important}.inline{display:inline !important}.inline-block{display:inline-block !important}.flex{display:flex !important}.inline-flex{display:inline-flex !important}@media screen and (min-width: 576px){.sm\:hidden{display:none !important}.sm\:block{display:block !important}.sm\:inline{display:inline !important}.sm\:inline-block{display:inline-block !important}.sm\:flex{display:flex !important}.sm\:inline-flex{display:inline-flex !important}}@media screen and (min-width: 768px){.md\:hidden{display:none !important}.md\:block{display:block !important}.md\:inline{display:inline !important}.md\:inline-block{display:inline-block !important}.md\:flex{display:flex !important}.md\:inline-flex{display:inline-flex !important}}@media screen and (min-width: 992px){.lg\:hidden{display:none !important}.lg\:block{display:block !important}.lg\:inline{display:inline !important}.lg\:inline-block{display:inline-block !important}.lg\:flex{display:flex !important}.lg\:inline-flex{display:inline-flex !important}}@media screen and (min-width: 1200px){.xl\:hidden{display:none !important}.xl\:block{display:block !important}.xl\:inline{display:inline !important}.xl\:inline-block{display:inline-block !important}.xl\:flex{display:flex !important}.xl\:inline-flex{display:inline-flex !important}}.text-center{text-align:center !important}.text-justify{text-align:justify !important}.text-left{text-align:left !important}.text-right{text-align:right !important}@media screen and (min-width: 576px){.sm\:text-center{text-align:center !important}.sm\:text-justify{text-align:justify !important}.sm\:text-left{text-align:left !important}.sm\:text-right{text-align:right !important}}@media screen and (min-width: 768px){.md\:text-center{text-align:center !important}.md\:text-justify{text-align:justify !important}.md\:text-left{text-align:left !important}.md\:text-right{text-align:right !important}}@media screen and (min-width: 992px){.lg\:text-center{text-align:center !important}.lg\:text-justify{text-align:justify !important}.lg\:text-left{text-align:left !important}.lg\:text-right{text-align:right !important}}@media screen and (min-width: 1200px){.xl\:text-center{text-align:center !important}.xl\:text-justify{text-align:justify !important}.xl\:text-left{text-align:left !important}.xl\:text-right{text-align:right !important}}.underline{text-decoration:underline !important}.line-through{text-decoration:line-through !important}.no-underline{text-decoration:none !important}.focus\:underline:focus{text-decoration:underline !important}.hover\:underline:hover{text-decoration:underline !important}.active\:underline:active{text-decoration:underline !important}.focus\:line-through:focus{text-decoration:line-through !important}.hover\:line-through:hover{text-decoration:line-through !important}.active\:line-through:active{text-decoration:line-through !important}.focus\:no-underline:focus{text-decoration:none !important}.hover\:no-underline:hover{text-decoration:none !important}.active\:no-underline:active{text-decoration:none !important}.lowercase{text-transform:lowercase !important}.uppercase{text-transform:uppercase !important}.capitalize{text-transform:capitalize !important}.text-overflow-clip{text-overflow:clip !important}.text-overflow-ellipsis{text-overflow:ellipsis !important}@media screen and (min-width: 576px){.sm\:text-overflow-clip{text-overflow:clip !important}.sm\:text-overflow-ellipsis{text-overflow:ellipsis !important}}@media screen and (min-width: 768px){.md\:text-overflow-clip{text-overflow:clip !important}.md\:text-overflow-ellipsis{text-overflow:ellipsis !important}}@media screen and (min-width: 992px){.lg\:text-overflow-clip{text-overflow:clip !important}.lg\:text-overflow-ellipsis{text-overflow:ellipsis !important}}@media screen and (min-width: 1200px){.xl\:text-overflow-clip{text-overflow:clip !important}.xl\:text-overflow-ellipsis{text-overflow:ellipsis !important}}.font-light{font-weight:300 !important}.font-normal{font-weight:400 !important}.font-medium{font-weight:500 !important}.font-semibold{font-weight:600 !important}.font-bold{font-weight:700 !important}@media screen and (min-width: 576px){.sm\:font-light{font-weight:300 !important}.sm\:font-normal{font-weight:400 !important}.sm\:font-medium{font-weight:500 !important}.sm\:font-semibold{font-weight:600 !important}.sm\:font-bold{font-weight:700 !important}}@media screen and (min-width: 768px){.md\:font-light{font-weight:300 !important}.md\:font-normal{font-weight:400 !important}.md\:font-medium{font-weight:500 !important}.md\:font-semibold{font-weight:600 !important}.md\:font-bold{font-weight:700 !important}}@media screen and (min-width: 992px){.lg\:font-light{font-weight:300 !important}.lg\:font-normal{font-weight:400 !important}.lg\:font-medium{font-weight:500 !important}.lg\:font-semibold{font-weight:600 !important}.lg\:font-bold{font-weight:700 !important}}@media screen and (min-width: 1200px){.xl\:font-light{font-weight:300 !important}.xl\:font-normal{font-weight:400 !important}.xl\:font-medium{font-weight:500 !important}.xl\:font-semibold{font-weight:600 !important}.xl\:font-bold{font-weight:700 !important}}.font-italic{font-style:italic !important}.text-xs{font-size:0.75rem !important}.text-sm{font-size:0.875rem !important}.text-base{font-size:1rem !important}.text-lg{font-size:1.125rem !important}.text-xl{font-size:1.25rem !important}.text-2xl{font-size:1.5rem !important}.text-3xl{font-size:1.75rem !important}.text-4xl{font-size:2rem !important}.text-5xl{font-size:2.5rem !important}.text-6xl{font-size:3rem !important}.text-7xl{font-size:4rem !important}.text-8xl{font-size:6rem !important}@media screen and (min-width: 576px){.sm\:text-xs{font-size:0.75rem !important}.sm\:text-sm{font-size:0.875rem !important}.sm\:text-base{font-size:1rem !important}.sm\:text-lg{font-size:1.125rem !important}.sm\:text-xl{font-size:1.25rem !important}.sm\:text-2xl{font-size:1.5rem !important}.sm\:text-3xl{font-size:1.75rem !important}.sm\:text-4xl{font-size:2rem !important}.sm\:text-5xl{font-size:2.5rem !important}.sm\:text-6xl{font-size:3rem !important}.sm\:text-7xl{font-size:4rem !important}.sm\:text-8xl{font-size:6rem !important}}@media screen and (min-width: 768px){.md\:text-xs{font-size:0.75rem !important}.md\:text-sm{font-size:0.875rem !important}.md\:text-base{font-size:1rem !important}.md\:text-lg{font-size:1.125rem !important}.md\:text-xl{font-size:1.25rem !important}.md\:text-2xl{font-size:1.5rem !important}.md\:text-3xl{font-size:1.75rem !important}.md\:text-4xl{font-size:2rem !important}.md\:text-5xl{font-size:2.5rem !important}.md\:text-6xl{font-size:3rem !important}.md\:text-7xl{font-size:4rem !important}.md\:text-8xl{font-size:6rem !important}}@media screen and (min-width: 992px){.lg\:text-xs{font-size:0.75rem !important}.lg\:text-sm{font-size:0.875rem !important}.lg\:text-base{font-size:1rem !important}.lg\:text-lg{font-size:1.125rem !important}.lg\:text-xl{font-size:1.25rem !important}.lg\:text-2xl{font-size:1.5rem !important}.lg\:text-3xl{font-size:1.75rem !important}.lg\:text-4xl{font-size:2rem !important}.lg\:text-5xl{font-size:2.5rem !important}.lg\:text-6xl{font-size:3rem !important}.lg\:text-7xl{font-size:4rem !important}.lg\:text-8xl{font-size:6rem !important}}@media screen and (min-width: 1200px){.xl\:text-xs{font-size:0.75rem !important}.xl\:text-sm{font-size:0.875rem !important}.xl\:text-base{font-size:1rem !important}.xl\:text-lg{font-size:1.125rem !important}.xl\:text-xl{font-size:1.25rem !important}.xl\:text-2xl{font-size:1.5rem !important}.xl\:text-3xl{font-size:1.75rem !important}.xl\:text-4xl{font-size:2rem !important}.xl\:text-5xl{font-size:2.5rem !important}.xl\:text-6xl{font-size:3rem !important}.xl\:text-7xl{font-size:4rem !important}.xl\:text-8xl{font-size:6rem !important}}.line-height-1{line-height:1 !important}.line-height-2{line-height:1.25 !important}.line-height-3{line-height:1.5 !important}.line-height-4{line-height:2 !important}.white-space-normal{white-space:normal !important}.white-space-nowrap{white-space:nowrap !important}.vertical-align-baseline{vertical-align:baseline !important}.vertical-align-top{vertical-align:top !important}.vertical-align-middle{vertical-align:middle !important}.vertical-align-bottom{vertical-align:bottom !important}.vertical-align-text-top{vertical-align:text-top !important}.vertical-align-text-bottom{vertical-align:text-bottom !important}.vertical-align-sub{vertical-align:sub !important}.vertical-align-super{vertical-align:super !important}@media screen and (min-width: 576px){.sm\:vertical-align-baseline{vertical-align:baseline !important}.sm\:vertical-align-top{vertical-align:top !important}.sm\:vertical-align-middle{vertical-align:middle !important}.sm\:vertical-align-bottom{vertical-align:bottom !important}.sm\:vertical-align-text-top{vertical-align:text-top !important}.sm\:vertical-align-text-bottom{vertical-align:text-bottom !important}.sm\:vertical-align-sub{vertical-align:sub !important}.sm\:vertical-align-super{vertical-align:super !important}}@media screen and (min-width: 768px){.md\:vertical-align-baseline{vertical-align:baseline !important}.md\:vertical-align-top{vertical-align:top !important}.md\:vertical-align-middle{vertical-align:middle !important}.md\:vertical-align-bottom{vertical-align:bottom !important}.md\:vertical-align-text-top{vertical-align:text-top !important}.md\:vertical-align-text-bottom{vertical-align:text-bottom !important}.md\:vertical-align-sub{vertical-align:sub !important}.md\:vertical-align-super{vertical-align:super !important}}@media screen and (min-width: 992px){.lg\:vertical-align-baseline{vertical-align:baseline !important}.lg\:vertical-align-top{vertical-align:top !important}.lg\:vertical-align-middle{vertical-align:middle !important}.lg\:vertical-align-bottom{vertical-align:bottom !important}.lg\:vertical-align-text-top{vertical-align:text-top !important}.lg\:vertical-align-text-bottom{vertical-align:text-bottom !important}.lg\:vertical-align-sub{vertical-align:sub !important}.lg\:vertical-align-super{vertical-align:super !important}}@media screen and (min-width: 1200px){.xl\:vertical-align-baseline{vertical-align:baseline !important}.xl\:vertical-align-top{vertical-align:top !important}.xl\:vertical-align-middle{vertical-align:middle !important}.xl\:vertical-align-bottom{vertical-align:bottom !important}.xl\:vertical-align-text-top{vertical-align:text-top !important}.xl\:vertical-align-text-bottom{vertical-align:text-bottom !important}.xl\:vertical-align-sub{vertical-align:sub !important}.xl\:vertical-align-super{vertical-align:super !important}}.flex-row{flex-direction:row !important}.flex-row-reverse{flex-direction:row-reverse !important}.flex-column{flex-direction:column !important}.flex-column-reverse{flex-direction:column-reverse !important}@media screen and (min-width: 576px){.sm\:flex-row{flex-direction:row !important}.sm\:flex-row-reverse{flex-direction:row-reverse !important}.sm\:flex-column{flex-direction:column !important}.sm\:flex-column-reverse{flex-direction:column-reverse !important}}@media screen and (min-width: 768px){.md\:flex-row{flex-direction:row !important}.md\:flex-row-reverse{flex-direction:row-reverse !important}.md\:flex-column{flex-direction:column !important}.md\:flex-column-reverse{flex-direction:column-reverse !important}}@media screen and (min-width: 992px){.lg\:flex-row{flex-direction:row !important}.lg\:flex-row-reverse{flex-direction:row-reverse !important}.lg\:flex-column{flex-direction:column !important}.lg\:flex-column-reverse{flex-direction:column-reverse !important}}@media screen and (min-width: 1200px){.xl\:flex-row{flex-direction:row !important}.xl\:flex-row-reverse{flex-direction:row-reverse !important}.xl\:flex-column{flex-direction:column !important}.xl\:flex-column-reverse{flex-direction:column-reverse !important}}.flex-wrap{flex-wrap:wrap !important}.flex-wrap-reverse{flex-wrap:wrap-reverse !important}.flex-nowrap{flex-wrap:nowrap !important}@media screen and (min-width: 576px){.sm\:flex-wrap{flex-wrap:wrap !important}.sm\:flex-wrap-reverse{flex-wrap:wrap-reverse !important}.sm\:flex-nowrap{flex-wrap:nowrap !important}}@media screen and (min-width: 768px){.md\:flex-wrap{flex-wrap:wrap !important}.md\:flex-wrap-reverse{flex-wrap:wrap-reverse !important}.md\:flex-nowrap{flex-wrap:nowrap !important}}@media screen and (min-width: 992px){.lg\:flex-wrap{flex-wrap:wrap !important}.lg\:flex-wrap-reverse{flex-wrap:wrap-reverse !important}.lg\:flex-nowrap{flex-wrap:nowrap !important}}@media screen and (min-width: 1200px){.xl\:flex-wrap{flex-wrap:wrap !important}.xl\:flex-wrap-reverse{flex-wrap:wrap-reverse !important}.xl\:flex-nowrap{flex-wrap:nowrap !important}}.justify-content-start{justify-content:flex-start !important}.justify-content-end{justify-content:flex-end !important}.justify-content-center{justify-content:center !important}.justify-content-between{justify-content:space-between !important}.justify-content-around{justify-content:space-around !important}.justify-content-evenly{justify-content:space-evenly !important}@media screen and (min-width: 576px){.sm\:justify-content-start{justify-content:flex-start !important}.sm\:justify-content-end{justify-content:flex-end !important}.sm\:justify-content-center{justify-content:center !important}.sm\:justify-content-between{justify-content:space-between !important}.sm\:justify-content-around{justify-content:space-around !important}.sm\:justify-content-evenly{justify-content:space-evenly !important}}@media screen and (min-width: 768px){.md\:justify-content-start{justify-content:flex-start !important}.md\:justify-content-end{justify-content:flex-end !important}.md\:justify-content-center{justify-content:center !important}.md\:justify-content-between{justify-content:space-between !important}.md\:justify-content-around{justify-content:space-around !important}.md\:justify-content-evenly{justify-content:space-evenly !important}}@media screen and (min-width: 992px){.lg\:justify-content-start{justify-content:flex-start !important}.lg\:justify-content-end{justify-content:flex-end !important}.lg\:justify-content-center{justify-content:center !important}.lg\:justify-content-between{justify-content:space-between !important}.lg\:justify-content-around{justify-content:space-around !important}.lg\:justify-content-evenly{justify-content:space-evenly !important}}@media screen and (min-width: 1200px){.xl\:justify-content-start{justify-content:flex-start !important}.xl\:justify-content-end{justify-content:flex-end !important}.xl\:justify-content-center{justify-content:center !important}.xl\:justify-content-between{justify-content:space-between !important}.xl\:justify-content-around{justify-content:space-around !important}.xl\:justify-content-evenly{justify-content:space-evenly !important}}.align-content-start{align-content:flex-start !important}.align-content-end{align-content:flex-end !important}.align-content-center{align-content:center !important}.align-content-between{align-content:space-between !important}.align-content-around{align-content:space-around !important}.align-content-evenly{align-content:space-evenly !important}@media screen and (min-width: 576px){.sm\:align-content-start{align-content:flex-start !important}.sm\:align-content-end{align-content:flex-end !important}.sm\:align-content-center{align-content:center !important}.sm\:align-content-between{align-content:space-between !important}.sm\:align-content-around{align-content:space-around !important}.sm\:align-content-evenly{align-content:space-evenly !important}}@media screen and (min-width: 768px){.md\:align-content-start{align-content:flex-start !important}.md\:align-content-end{align-content:flex-end !important}.md\:align-content-center{align-content:center !important}.md\:align-content-between{align-content:space-between !important}.md\:align-content-around{align-content:space-around !important}.md\:align-content-evenly{align-content:space-evenly !important}}@media screen and (min-width: 992px){.lg\:align-content-start{align-content:flex-start !important}.lg\:align-content-end{align-content:flex-end !important}.lg\:align-content-center{align-content:center !important}.lg\:align-content-between{align-content:space-between !important}.lg\:align-content-around{align-content:space-around !important}.lg\:align-content-evenly{align-content:space-evenly !important}}@media screen and (min-width: 1200px){.xl\:align-content-start{align-content:flex-start !important}.xl\:align-content-end{align-content:flex-end !important}.xl\:align-content-center{align-content:center !important}.xl\:align-content-between{align-content:space-between !important}.xl\:align-content-around{align-content:space-around !important}.xl\:align-content-evenly{align-content:space-evenly !important}}.align-items-stretch{align-items:stretch !important}.align-items-start{align-items:flex-start !important}.align-items-center{align-items:center !important}.align-items-end{align-items:flex-end !important}.align-items-baseline{align-items:baseline !important}@media screen and (min-width: 576px){.sm\:align-items-stretch{align-items:stretch !important}.sm\:align-items-start{align-items:flex-start !important}.sm\:align-items-center{align-items:center !important}.sm\:align-items-end{align-items:flex-end !important}.sm\:align-items-baseline{align-items:baseline !important}}@media screen and (min-width: 768px){.md\:align-items-stretch{align-items:stretch !important}.md\:align-items-start{align-items:flex-start !important}.md\:align-items-center{align-items:center !important}.md\:align-items-end{align-items:flex-end !important}.md\:align-items-baseline{align-items:baseline !important}}@media screen and (min-width: 992px){.lg\:align-items-stretch{align-items:stretch !important}.lg\:align-items-start{align-items:flex-start !important}.lg\:align-items-center{align-items:center !important}.lg\:align-items-end{align-items:flex-end !important}.lg\:align-items-baseline{align-items:baseline !important}}@media screen and (min-width: 1200px){.xl\:align-items-stretch{align-items:stretch !important}.xl\:align-items-start{align-items:flex-start !important}.xl\:align-items-center{align-items:center !important}.xl\:align-items-end{align-items:flex-end !important}.xl\:align-items-baseline{align-items:baseline !important}}.align-self-auto{align-self:auto !important}.align-self-start{align-self:flex-start !important}.align-self-end{align-self:flex-end !important}.align-self-center{align-self:center !important}.align-self-stretch{align-self:stretch !important}.align-self-baseline{align-self:baseline !important}@media screen and (min-width: 576px){.sm\:align-self-auto{align-self:auto !important}.sm\:align-self-start{align-self:flex-start !important}.sm\:align-self-end{align-self:flex-end !important}.sm\:align-self-center{align-self:center !important}.sm\:align-self-stretch{align-self:stretch !important}.sm\:align-self-baseline{align-self:baseline !important}}@media screen and (min-width: 768px){.md\:align-self-auto{align-self:auto !important}.md\:align-self-start{align-self:flex-start !important}.md\:align-self-end{align-self:flex-end !important}.md\:align-self-center{align-self:center !important}.md\:align-self-stretch{align-self:stretch !important}.md\:align-self-baseline{align-self:baseline !important}}@media screen and (min-width: 992px){.lg\:align-self-auto{align-self:auto !important}.lg\:align-self-start{align-self:flex-start !important}.lg\:align-self-end{align-self:flex-end !important}.lg\:align-self-center{align-self:center !important}.lg\:align-self-stretch{align-self:stretch !important}.lg\:align-self-baseline{align-self:baseline !important}}@media screen and (min-width: 1200px){.xl\:align-self-auto{align-self:auto !important}.xl\:align-self-start{align-self:flex-start !important}.xl\:align-self-end{align-self:flex-end !important}.xl\:align-self-center{align-self:center !important}.xl\:align-self-stretch{align-self:stretch !important}.xl\:align-self-baseline{align-self:baseline !important}}.flex-order-0{order:0 !important}.flex-order-1{order:1 !important}.flex-order-2{order:2 !important}.flex-order-3{order:3 !important}.flex-order-4{order:4 !important}.flex-order-5{order:5 !important}.flex-order-6{order:6 !important}@media screen and (min-width: 576px){.sm\:flex-order-0{order:0 !important}.sm\:flex-order-1{order:1 !important}.sm\:flex-order-2{order:2 !important}.sm\:flex-order-3{order:3 !important}.sm\:flex-order-4{order:4 !important}.sm\:flex-order-5{order:5 !important}.sm\:flex-order-6{order:6 !important}}@media screen and (min-width: 768px){.md\:flex-order-0{order:0 !important}.md\:flex-order-1{order:1 !important}.md\:flex-order-2{order:2 !important}.md\:flex-order-3{order:3 !important}.md\:flex-order-4{order:4 !important}.md\:flex-order-5{order:5 !important}.md\:flex-order-6{order:6 !important}}@media screen and (min-width: 992px){.lg\:flex-order-0{order:0 !important}.lg\:flex-order-1{order:1 !important}.lg\:flex-order-2{order:2 !important}.lg\:flex-order-3{order:3 !important}.lg\:flex-order-4{order:4 !important}.lg\:flex-order-5{order:5 !important}.lg\:flex-order-6{order:6 !important}}@media screen and (min-width: 1200px){.xl\:flex-order-0{order:0 !important}.xl\:flex-order-1{order:1 !important}.xl\:flex-order-2{order:2 !important}.xl\:flex-order-3{order:3 !important}.xl\:flex-order-4{order:4 !important}.xl\:flex-order-5{order:5 !important}.xl\:flex-order-6{order:6 !important}}.flex-1{flex:1 1 0% !important}.flex-auto{flex:1 1 auto !important}.flex-initial{flex:0 1 auto !important}.flex-none{flex:none !important}@media screen and (min-width: 576px){.sm\:flex-1{flex:1 1 0% !important}.sm\:flex-auto{flex:1 1 auto !important}.sm\:flex-initial{flex:0 1 auto !important}.sm\:flex-none{flex:none !important}}@media screen and (min-width: 768px){.md\:flex-1{flex:1 1 0% !important}.md\:flex-auto{flex:1 1 auto !important}.md\:flex-initial{flex:0 1 auto !important}.md\:flex-none{flex:none !important}}@media screen and (min-width: 992px){.lg\:flex-1{flex:1 1 0% !important}.lg\:flex-auto{flex:1 1 auto !important}.lg\:flex-initial{flex:0 1 auto !important}.lg\:flex-none{flex:none !important}}@media screen and (min-width: 1200px){.xl\:flex-1{flex:1 1 0% !important}.xl\:flex-auto{flex:1 1 auto !important}.xl\:flex-initial{flex:0 1 auto !important}.xl\:flex-none{flex:none !important}}.flex-grow-0{flex-grow:0 !important}.flex-grow-1{flex-grow:1 !important}@media screen and (min-width: 576px){.sm\:flex-grow-0{flex-grow:0 !important}.sm\:flex-grow-1{flex-grow:1 !important}}@media screen and (min-width: 768px){.md\:flex-grow-0{flex-grow:0 !important}.md\:flex-grow-1{flex-grow:1 !important}}@media screen and (min-width: 992px){.lg\:flex-grow-0{flex-grow:0 !important}.lg\:flex-grow-1{flex-grow:1 !important}}@media screen and (min-width: 1200px){.xl\:flex-grow-0{flex-grow:0 !important}.xl\:flex-grow-1{flex-grow:1 !important}}.flex-shrink-0{flex-shrink:0 !important}.flex-shrink-1{flex-shrink:1 !important}@media screen and (min-width: 576px){.sm\:flex-shrink-0{flex-shrink:0 !important}.sm\:flex-shrink-1{flex-shrink:1 !important}}@media screen and (min-width: 768px){.md\:flex-shrink-0{flex-shrink:0 !important}.md\:flex-shrink-1{flex-shrink:1 !important}}@media screen and (min-width: 992px){.lg\:flex-shrink-0{flex-shrink:0 !important}.lg\:flex-shrink-1{flex-shrink:1 !important}}@media screen and (min-width: 1200px){.xl\:flex-shrink-0{flex-shrink:0 !important}.xl\:flex-shrink-1{flex-shrink:1 !important}}.gap-0{gap:0rem !important}.gap-1{gap:.25rem !important}.gap-2{gap:.5rem !important}.gap-3{gap:1rem !important}.gap-4{gap:1.5rem !important}.gap-5{gap:2rem !important}.gap-6{gap:3rem !important}.gap-7{gap:4rem !important}.gap-8{gap:5rem !important}.row-gap-0{row-gap:0rem !important}.row-gap-1{row-gap:.25rem !important}.row-gap-2{row-gap:.5rem !important}.row-gap-3{row-gap:1rem !important}.row-gap-4{row-gap:1.5rem !important}.row-gap-5{row-gap:2rem !important}.row-gap-6{row-gap:3rem !important}.row-gap-7{row-gap:4rem !important}.row-gap-8{row-gap:5rem !important}.column-gap-0{column-gap:0rem !important}.column-gap-1{column-gap:.25rem !important}.column-gap-2{column-gap:.5rem !important}.column-gap-3{column-gap:1rem !important}.column-gap-4{column-gap:1.5rem !important}.column-gap-5{column-gap:2rem !important}.column-gap-6{column-gap:3rem !important}.column-gap-7{column-gap:4rem !important}.column-gap-8{column-gap:5rem !important}@media screen and (min-width: 576px){.sm\:gap-0{gap:0rem !important}.sm\:gap-1{gap:.25rem !important}.sm\:gap-2{gap:.5rem !important}.sm\:gap-3{gap:1rem !important}.sm\:gap-4{gap:1.5rem !important}.sm\:gap-5{gap:2rem !important}.sm\:gap-6{gap:3rem !important}.sm\:gap-7{gap:4rem !important}.sm\:gap-8{gap:5rem !important}.sm\:row-gap-0{row-gap:0rem !important}.sm\:row-gap-1{row-gap:.25rem !important}.sm\:row-gap-2{row-gap:.5rem !important}.sm\:row-gap-3{row-gap:1rem !important}.sm\:row-gap-4{row-gap:1.5rem !important}.sm\:row-gap-5{row-gap:2rem !important}.sm\:row-gap-6{row-gap:3rem !important}.sm\:row-gap-7{row-gap:4rem !important}.sm\:row-gap-8{row-gap:5rem !important}.sm\:column-gap-0{column-gap:0rem !important}.sm\:column-gap-1{column-gap:.25rem !important}.sm\:column-gap-2{column-gap:.5rem !important}.sm\:column-gap-3{column-gap:1rem !important}.sm\:column-gap-4{column-gap:1.5rem !important}.sm\:column-gap-5{column-gap:2rem !important}.sm\:column-gap-6{column-gap:3rem !important}.sm\:column-gap-7{column-gap:4rem !important}.sm\:column-gap-8{column-gap:5rem !important}}@media screen and (min-width: 768px){.md\:gap-0{gap:0rem !important}.md\:gap-1{gap:.25rem !important}.md\:gap-2{gap:.5rem !important}.md\:gap-3{gap:1rem !important}.md\:gap-4{gap:1.5rem !important}.md\:gap-5{gap:2rem !important}.md\:gap-6{gap:3rem !important}.md\:gap-7{gap:4rem !important}.md\:gap-8{gap:5rem !important}.md\:row-gap-0{row-gap:0rem !important}.md\:row-gap-1{row-gap:.25rem !important}.md\:row-gap-2{row-gap:.5rem !important}.md\:row-gap-3{row-gap:1rem !important}.md\:row-gap-4{row-gap:1.5rem !important}.md\:row-gap-5{row-gap:2rem !important}.md\:row-gap-6{row-gap:3rem !important}.md\:row-gap-7{row-gap:4rem !important}.md\:row-gap-8{row-gap:5rem !important}.md\:column-gap-0{column-gap:0rem !important}.md\:column-gap-1{column-gap:.25rem !important}.md\:column-gap-2{column-gap:.5rem !important}.md\:column-gap-3{column-gap:1rem !important}.md\:column-gap-4{column-gap:1.5rem !important}.md\:column-gap-5{column-gap:2rem !important}.md\:column-gap-6{column-gap:3rem !important}.md\:column-gap-7{column-gap:4rem !important}.md\:column-gap-8{column-gap:5rem !important}}@media screen and (min-width: 992px){.lg\:gap-0{gap:0rem !important}.lg\:gap-1{gap:.25rem !important}.lg\:gap-2{gap:.5rem !important}.lg\:gap-3{gap:1rem !important}.lg\:gap-4{gap:1.5rem !important}.lg\:gap-5{gap:2rem !important}.lg\:gap-6{gap:3rem !important}.lg\:gap-7{gap:4rem !important}.lg\:gap-8{gap:5rem !important}.lg\:row-gap-0{row-gap:0rem !important}.lg\:row-gap-1{row-gap:.25rem !important}.lg\:row-gap-2{row-gap:.5rem !important}.lg\:row-gap-3{row-gap:1rem !important}.lg\:row-gap-4{row-gap:1.5rem !important}.lg\:row-gap-5{row-gap:2rem !important}.lg\:row-gap-6{row-gap:3rem !important}.lg\:row-gap-7{row-gap:4rem !important}.lg\:row-gap-8{row-gap:5rem !important}.lg\:column-gap-0{column-gap:0rem !important}.lg\:column-gap-1{column-gap:.25rem !important}.lg\:column-gap-2{column-gap:.5rem !important}.lg\:column-gap-3{column-gap:1rem !important}.lg\:column-gap-4{column-gap:1.5rem !important}.lg\:column-gap-5{column-gap:2rem !important}.lg\:column-gap-6{column-gap:3rem !important}.lg\:column-gap-7{column-gap:4rem !important}.lg\:column-gap-8{column-gap:5rem !important}}@media screen and (min-width: 1200px){.xl\:gap-0{gap:0rem !important}.xl\:gap-1{gap:.25rem !important}.xl\:gap-2{gap:.5rem !important}.xl\:gap-3{gap:1rem !important}.xl\:gap-4{gap:1.5rem !important}.xl\:gap-5{gap:2rem !important}.xl\:gap-6{gap:3rem !important}.xl\:gap-7{gap:4rem !important}.xl\:gap-8{gap:5rem !important}.xl\:row-gap-0{row-gap:0rem !important}.xl\:row-gap-1{row-gap:.25rem !important}.xl\:row-gap-2{row-gap:.5rem !important}.xl\:row-gap-3{row-gap:1rem !important}.xl\:row-gap-4{row-gap:1.5rem !important}.xl\:row-gap-5{row-gap:2rem !important}.xl\:row-gap-6{row-gap:3rem !important}.xl\:row-gap-7{row-gap:4rem !important}.xl\:row-gap-8{row-gap:5rem !important}.xl\:column-gap-0{column-gap:0rem !important}.xl\:column-gap-1{column-gap:.25rem !important}.xl\:column-gap-2{column-gap:.5rem !important}.xl\:column-gap-3{column-gap:1rem !important}.xl\:column-gap-4{column-gap:1.5rem !important}.xl\:column-gap-5{column-gap:2rem !important}.xl\:column-gap-6{column-gap:3rem !important}.xl\:column-gap-7{column-gap:4rem !important}.xl\:column-gap-8{column-gap:5rem !important}}.p-0{padding:0rem !important}.p-1{padding:.25rem !important}.p-2{padding:.5rem !important}.p-3{padding:1rem !important}.p-4{padding:1.5rem !important}.p-5{padding:2rem !important}.p-6{padding:3rem !important}.p-7{padding:4rem !important}.p-8{padding:5rem !important}.pt-0{padding-top:0rem !important}.pt-1{padding-top:.25rem !important}.pt-2{padding-top:.5rem !important}.pt-3{padding-top:1rem !important}.pt-4{padding-top:1.5rem !important}.pt-5{padding-top:2rem !important}.pt-6{padding-top:3rem !important}.pt-7{padding-top:4rem !important}.pt-8{padding-top:5rem !important}.pr-0{padding-right:0rem !important}.pr-1{padding-right:.25rem !important}.pr-2{padding-right:.5rem !important}.pr-3{padding-right:1rem !important}.pr-4{padding-right:1.5rem !important}.pr-5{padding-right:2rem !important}.pr-6{padding-right:3rem !important}.pr-7{padding-right:4rem !important}.pr-8{padding-right:5rem !important}.pl-0{padding-left:0rem !important}.pl-1{padding-left:.25rem !important}.pl-2{padding-left:.5rem !important}.pl-3{padding-left:1rem !important}.pl-4{padding-left:1.5rem !important}.pl-5{padding-left:2rem !important}.pl-6{padding-left:3rem !important}.pl-7{padding-left:4rem !important}.pl-8{padding-left:5rem !important}.pb-0{padding-bottom:0rem !important}.pb-1{padding-bottom:.25rem !important}.pb-2{padding-bottom:.5rem !important}.pb-3{padding-bottom:1rem !important}.pb-4{padding-bottom:1.5rem !important}.pb-5{padding-bottom:2rem !important}.pb-6{padding-bottom:3rem !important}.pb-7{padding-bottom:4rem !important}.pb-8{padding-bottom:5rem !important}.px-0{padding-left:0rem !important;padding-right:0rem !important}.px-1{padding-left:.25rem !important;padding-right:.25rem !important}.px-2{padding-left:.5rem !important;padding-right:.5rem !important}.px-3{padding-left:1rem !important;padding-right:1rem !important}.px-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.px-5{padding-left:2rem !important;padding-right:2rem !important}.px-6{padding-left:3rem !important;padding-right:3rem !important}.px-7{padding-left:4rem !important;padding-right:4rem !important}.px-8{padding-left:5rem !important;padding-right:5rem !important}.py-0{padding-top:0rem !important;padding-bottom:0rem !important}.py-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.py-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.py-3{padding-top:1rem !important;padding-bottom:1rem !important}.py-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.py-5{padding-top:2rem !important;padding-bottom:2rem !important}.py-6{padding-top:3rem !important;padding-bottom:3rem !important}.py-7{padding-top:4rem !important;padding-bottom:4rem !important}.py-8{padding-top:5rem !important;padding-bottom:5rem !important}@media screen and (min-width: 576px){.sm\:p-0{padding:0rem !important}.sm\:p-1{padding:.25rem !important}.sm\:p-2{padding:.5rem !important}.sm\:p-3{padding:1rem !important}.sm\:p-4{padding:1.5rem !important}.sm\:p-5{padding:2rem !important}.sm\:p-6{padding:3rem !important}.sm\:p-7{padding:4rem !important}.sm\:p-8{padding:5rem !important}.sm\:pt-0{padding-top:0rem !important}.sm\:pt-1{padding-top:.25rem !important}.sm\:pt-2{padding-top:.5rem !important}.sm\:pt-3{padding-top:1rem !important}.sm\:pt-4{padding-top:1.5rem !important}.sm\:pt-5{padding-top:2rem !important}.sm\:pt-6{padding-top:3rem !important}.sm\:pt-7{padding-top:4rem !important}.sm\:pt-8{padding-top:5rem !important}.sm\:pr-0{padding-right:0rem !important}.sm\:pr-1{padding-right:.25rem !important}.sm\:pr-2{padding-right:.5rem !important}.sm\:pr-3{padding-right:1rem !important}.sm\:pr-4{padding-right:1.5rem !important}.sm\:pr-5{padding-right:2rem !important}.sm\:pr-6{padding-right:3rem !important}.sm\:pr-7{padding-right:4rem !important}.sm\:pr-8{padding-right:5rem !important}.sm\:pl-0{padding-left:0rem !important}.sm\:pl-1{padding-left:.25rem !important}.sm\:pl-2{padding-left:.5rem !important}.sm\:pl-3{padding-left:1rem !important}.sm\:pl-4{padding-left:1.5rem !important}.sm\:pl-5{padding-left:2rem !important}.sm\:pl-6{padding-left:3rem !important}.sm\:pl-7{padding-left:4rem !important}.sm\:pl-8{padding-left:5rem !important}.sm\:pb-0{padding-bottom:0rem !important}.sm\:pb-1{padding-bottom:.25rem !important}.sm\:pb-2{padding-bottom:.5rem !important}.sm\:pb-3{padding-bottom:1rem !important}.sm\:pb-4{padding-bottom:1.5rem !important}.sm\:pb-5{padding-bottom:2rem !important}.sm\:pb-6{padding-bottom:3rem !important}.sm\:pb-7{padding-bottom:4rem !important}.sm\:pb-8{padding-bottom:5rem !important}.sm\:px-0{padding-left:0rem !important;padding-right:0rem !important}.sm\:px-1{padding-left:.25rem !important;padding-right:.25rem !important}.sm\:px-2{padding-left:.5rem !important;padding-right:.5rem !important}.sm\:px-3{padding-left:1rem !important;padding-right:1rem !important}.sm\:px-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.sm\:px-5{padding-left:2rem !important;padding-right:2rem !important}.sm\:px-6{padding-left:3rem !important;padding-right:3rem !important}.sm\:px-7{padding-left:4rem !important;padding-right:4rem !important}.sm\:px-8{padding-left:5rem !important;padding-right:5rem !important}.sm\:py-0{padding-top:0rem !important;padding-bottom:0rem !important}.sm\:py-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.sm\:py-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.sm\:py-3{padding-top:1rem !important;padding-bottom:1rem !important}.sm\:py-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.sm\:py-5{padding-top:2rem !important;padding-bottom:2rem !important}.sm\:py-6{padding-top:3rem !important;padding-bottom:3rem !important}.sm\:py-7{padding-top:4rem !important;padding-bottom:4rem !important}.sm\:py-8{padding-top:5rem !important;padding-bottom:5rem !important}}@media screen and (min-width: 768px){.md\:p-0{padding:0rem !important}.md\:p-1{padding:.25rem !important}.md\:p-2{padding:.5rem !important}.md\:p-3{padding:1rem !important}.md\:p-4{padding:1.5rem !important}.md\:p-5{padding:2rem !important}.md\:p-6{padding:3rem !important}.md\:p-7{padding:4rem !important}.md\:p-8{padding:5rem !important}.md\:pt-0{padding-top:0rem !important}.md\:pt-1{padding-top:.25rem !important}.md\:pt-2{padding-top:.5rem !important}.md\:pt-3{padding-top:1rem !important}.md\:pt-4{padding-top:1.5rem !important}.md\:pt-5{padding-top:2rem !important}.md\:pt-6{padding-top:3rem !important}.md\:pt-7{padding-top:4rem !important}.md\:pt-8{padding-top:5rem !important}.md\:pr-0{padding-right:0rem !important}.md\:pr-1{padding-right:.25rem !important}.md\:pr-2{padding-right:.5rem !important}.md\:pr-3{padding-right:1rem !important}.md\:pr-4{padding-right:1.5rem !important}.md\:pr-5{padding-right:2rem !important}.md\:pr-6{padding-right:3rem !important}.md\:pr-7{padding-right:4rem !important}.md\:pr-8{padding-right:5rem !important}.md\:pl-0{padding-left:0rem !important}.md\:pl-1{padding-left:.25rem !important}.md\:pl-2{padding-left:.5rem !important}.md\:pl-3{padding-left:1rem !important}.md\:pl-4{padding-left:1.5rem !important}.md\:pl-5{padding-left:2rem !important}.md\:pl-6{padding-left:3rem !important}.md\:pl-7{padding-left:4rem !important}.md\:pl-8{padding-left:5rem !important}.md\:pb-0{padding-bottom:0rem !important}.md\:pb-1{padding-bottom:.25rem !important}.md\:pb-2{padding-bottom:.5rem !important}.md\:pb-3{padding-bottom:1rem !important}.md\:pb-4{padding-bottom:1.5rem !important}.md\:pb-5{padding-bottom:2rem !important}.md\:pb-6{padding-bottom:3rem !important}.md\:pb-7{padding-bottom:4rem !important}.md\:pb-8{padding-bottom:5rem !important}.md\:px-0{padding-left:0rem !important;padding-right:0rem !important}.md\:px-1{padding-left:.25rem !important;padding-right:.25rem !important}.md\:px-2{padding-left:.5rem !important;padding-right:.5rem !important}.md\:px-3{padding-left:1rem !important;padding-right:1rem !important}.md\:px-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.md\:px-5{padding-left:2rem !important;padding-right:2rem !important}.md\:px-6{padding-left:3rem !important;padding-right:3rem !important}.md\:px-7{padding-left:4rem !important;padding-right:4rem !important}.md\:px-8{padding-left:5rem !important;padding-right:5rem !important}.md\:py-0{padding-top:0rem !important;padding-bottom:0rem !important}.md\:py-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.md\:py-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.md\:py-3{padding-top:1rem !important;padding-bottom:1rem !important}.md\:py-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.md\:py-5{padding-top:2rem !important;padding-bottom:2rem !important}.md\:py-6{padding-top:3rem !important;padding-bottom:3rem !important}.md\:py-7{padding-top:4rem !important;padding-bottom:4rem !important}.md\:py-8{padding-top:5rem !important;padding-bottom:5rem !important}}@media screen and (min-width: 992px){.lg\:p-0{padding:0rem !important}.lg\:p-1{padding:.25rem !important}.lg\:p-2{padding:.5rem !important}.lg\:p-3{padding:1rem !important}.lg\:p-4{padding:1.5rem !important}.lg\:p-5{padding:2rem !important}.lg\:p-6{padding:3rem !important}.lg\:p-7{padding:4rem !important}.lg\:p-8{padding:5rem !important}.lg\:pt-0{padding-top:0rem !important}.lg\:pt-1{padding-top:.25rem !important}.lg\:pt-2{padding-top:.5rem !important}.lg\:pt-3{padding-top:1rem !important}.lg\:pt-4{padding-top:1.5rem !important}.lg\:pt-5{padding-top:2rem !important}.lg\:pt-6{padding-top:3rem !important}.lg\:pt-7{padding-top:4rem !important}.lg\:pt-8{padding-top:5rem !important}.lg\:pr-0{padding-right:0rem !important}.lg\:pr-1{padding-right:.25rem !important}.lg\:pr-2{padding-right:.5rem !important}.lg\:pr-3{padding-right:1rem !important}.lg\:pr-4{padding-right:1.5rem !important}.lg\:pr-5{padding-right:2rem !important}.lg\:pr-6{padding-right:3rem !important}.lg\:pr-7{padding-right:4rem !important}.lg\:pr-8{padding-right:5rem !important}.lg\:pl-0{padding-left:0rem !important}.lg\:pl-1{padding-left:.25rem !important}.lg\:pl-2{padding-left:.5rem !important}.lg\:pl-3{padding-left:1rem !important}.lg\:pl-4{padding-left:1.5rem !important}.lg\:pl-5{padding-left:2rem !important}.lg\:pl-6{padding-left:3rem !important}.lg\:pl-7{padding-left:4rem !important}.lg\:pl-8{padding-left:5rem !important}.lg\:pb-0{padding-bottom:0rem !important}.lg\:pb-1{padding-bottom:.25rem !important}.lg\:pb-2{padding-bottom:.5rem !important}.lg\:pb-3{padding-bottom:1rem !important}.lg\:pb-4{padding-bottom:1.5rem !important}.lg\:pb-5{padding-bottom:2rem !important}.lg\:pb-6{padding-bottom:3rem !important}.lg\:pb-7{padding-bottom:4rem !important}.lg\:pb-8{padding-bottom:5rem !important}.lg\:px-0{padding-left:0rem !important;padding-right:0rem !important}.lg\:px-1{padding-left:.25rem !important;padding-right:.25rem !important}.lg\:px-2{padding-left:.5rem !important;padding-right:.5rem !important}.lg\:px-3{padding-left:1rem !important;padding-right:1rem !important}.lg\:px-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.lg\:px-5{padding-left:2rem !important;padding-right:2rem !important}.lg\:px-6{padding-left:3rem !important;padding-right:3rem !important}.lg\:px-7{padding-left:4rem !important;padding-right:4rem !important}.lg\:px-8{padding-left:5rem !important;padding-right:5rem !important}.lg\:py-0{padding-top:0rem !important;padding-bottom:0rem !important}.lg\:py-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.lg\:py-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.lg\:py-3{padding-top:1rem !important;padding-bottom:1rem !important}.lg\:py-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.lg\:py-5{padding-top:2rem !important;padding-bottom:2rem !important}.lg\:py-6{padding-top:3rem !important;padding-bottom:3rem !important}.lg\:py-7{padding-top:4rem !important;padding-bottom:4rem !important}.lg\:py-8{padding-top:5rem !important;padding-bottom:5rem !important}}@media screen and (min-width: 1200px){.xl\:p-0{padding:0rem !important}.xl\:p-1{padding:.25rem !important}.xl\:p-2{padding:.5rem !important}.xl\:p-3{padding:1rem !important}.xl\:p-4{padding:1.5rem !important}.xl\:p-5{padding:2rem !important}.xl\:p-6{padding:3rem !important}.xl\:p-7{padding:4rem !important}.xl\:p-8{padding:5rem !important}.xl\:pt-0{padding-top:0rem !important}.xl\:pt-1{padding-top:.25rem !important}.xl\:pt-2{padding-top:.5rem !important}.xl\:pt-3{padding-top:1rem !important}.xl\:pt-4{padding-top:1.5rem !important}.xl\:pt-5{padding-top:2rem !important}.xl\:pt-6{padding-top:3rem !important}.xl\:pt-7{padding-top:4rem !important}.xl\:pt-8{padding-top:5rem !important}.xl\:pr-0{padding-right:0rem !important}.xl\:pr-1{padding-right:.25rem !important}.xl\:pr-2{padding-right:.5rem !important}.xl\:pr-3{padding-right:1rem !important}.xl\:pr-4{padding-right:1.5rem !important}.xl\:pr-5{padding-right:2rem !important}.xl\:pr-6{padding-right:3rem !important}.xl\:pr-7{padding-right:4rem !important}.xl\:pr-8{padding-right:5rem !important}.xl\:pl-0{padding-left:0rem !important}.xl\:pl-1{padding-left:.25rem !important}.xl\:pl-2{padding-left:.5rem !important}.xl\:pl-3{padding-left:1rem !important}.xl\:pl-4{padding-left:1.5rem !important}.xl\:pl-5{padding-left:2rem !important}.xl\:pl-6{padding-left:3rem !important}.xl\:pl-7{padding-left:4rem !important}.xl\:pl-8{padding-left:5rem !important}.xl\:pb-0{padding-bottom:0rem !important}.xl\:pb-1{padding-bottom:.25rem !important}.xl\:pb-2{padding-bottom:.5rem !important}.xl\:pb-3{padding-bottom:1rem !important}.xl\:pb-4{padding-bottom:1.5rem !important}.xl\:pb-5{padding-bottom:2rem !important}.xl\:pb-6{padding-bottom:3rem !important}.xl\:pb-7{padding-bottom:4rem !important}.xl\:pb-8{padding-bottom:5rem !important}.xl\:px-0{padding-left:0rem !important;padding-right:0rem !important}.xl\:px-1{padding-left:.25rem !important;padding-right:.25rem !important}.xl\:px-2{padding-left:.5rem !important;padding-right:.5rem !important}.xl\:px-3{padding-left:1rem !important;padding-right:1rem !important}.xl\:px-4{padding-left:1.5rem !important;padding-right:1.5rem !important}.xl\:px-5{padding-left:2rem !important;padding-right:2rem !important}.xl\:px-6{padding-left:3rem !important;padding-right:3rem !important}.xl\:px-7{padding-left:4rem !important;padding-right:4rem !important}.xl\:px-8{padding-left:5rem !important;padding-right:5rem !important}.xl\:py-0{padding-top:0rem !important;padding-bottom:0rem !important}.xl\:py-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.xl\:py-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.xl\:py-3{padding-top:1rem !important;padding-bottom:1rem !important}.xl\:py-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.xl\:py-5{padding-top:2rem !important;padding-bottom:2rem !important}.xl\:py-6{padding-top:3rem !important;padding-bottom:3rem !important}.xl\:py-7{padding-top:4rem !important;padding-bottom:4rem !important}.xl\:py-8{padding-top:5rem !important;padding-bottom:5rem !important}}.m-0{margin:0rem !important}.m-1{margin:.25rem !important}.m-2{margin:.5rem !important}.m-3{margin:1rem !important}.m-4{margin:1.5rem !important}.m-5{margin:2rem !important}.m-6{margin:3rem !important}.m-7{margin:4rem !important}.m-8{margin:5rem !important}.-m-1{margin:-0.25rem !important}.-m-2{margin:-0.5rem !important}.-m-3{margin:-1rem !important}.-m-4{margin:-1.5rem !important}.-m-5{margin:-2rem !important}.-m-6{margin:-3rem !important}.-m-7{margin:-4rem !important}.-m-8{margin:-5rem !important}.m-auto{margin:auto !important}.mt-0{margin-top:0rem !important}.mt-1{margin-top:.25rem !important}.mt-2{margin-top:.5rem !important}.mt-3{margin-top:1rem !important}.mt-4{margin-top:1.5rem !important}.mt-5{margin-top:2rem !important}.mt-6{margin-top:3rem !important}.mt-7{margin-top:4rem !important}.mt-8{margin-top:5rem !important}.-mt-1{margin-top:-0.25rem !important}.-mt-2{margin-top:-0.5rem !important}.-mt-3{margin-top:-1rem !important}.-mt-4{margin-top:-1.5rem !important}.-mt-5{margin-top:-2rem !important}.-mt-6{margin-top:-3rem !important}.-mt-7{margin-top:-4rem !important}.-mt-8{margin-top:-5rem !important}.mt-auto{margin-top:auto !important}.mr-0{margin-right:0rem !important}.mr-1{margin-right:.25rem !important}.mr-2{margin-right:.5rem !important}.mr-3{margin-right:1rem !important}.mr-4{margin-right:1.5rem !important}.mr-5{margin-right:2rem !important}.mr-6{margin-right:3rem !important}.mr-7{margin-right:4rem !important}.mr-8{margin-right:5rem !important}.-mr-1{margin-right:-0.25rem !important}.-mr-2{margin-right:-0.5rem !important}.-mr-3{margin-right:-1rem !important}.-mr-4{margin-right:-1.5rem !important}.-mr-5{margin-right:-2rem !important}.-mr-6{margin-right:-3rem !important}.-mr-7{margin-right:-4rem !important}.-mr-8{margin-right:-5rem !important}.mr-auto{margin-right:auto !important}.ml-0{margin-left:0rem !important}.ml-1{margin-left:.25rem !important}.ml-2{margin-left:.5rem !important}.ml-3{margin-left:1rem !important}.ml-4{margin-left:1.5rem !important}.ml-5{margin-left:2rem !important}.ml-6{margin-left:3rem !important}.ml-7{margin-left:4rem !important}.ml-8{margin-left:5rem !important}.-ml-1{margin-left:-0.25rem !important}.-ml-2{margin-left:-0.5rem !important}.-ml-3{margin-left:-1rem !important}.-ml-4{margin-left:-1.5rem !important}.-ml-5{margin-left:-2rem !important}.-ml-6{margin-left:-3rem !important}.-ml-7{margin-left:-4rem !important}.-ml-8{margin-left:-5rem !important}.ml-auto{margin-left:auto !important}.mb-0{margin-bottom:0rem !important}.mb-1{margin-bottom:.25rem !important}.mb-2{margin-bottom:.5rem !important}.mb-3{margin-bottom:1rem !important}.mb-4{margin-bottom:1.5rem !important}.mb-5{margin-bottom:2rem !important}.mb-6{margin-bottom:3rem !important}.mb-7{margin-bottom:4rem !important}.mb-8{margin-bottom:5rem !important}.-mb-1{margin-bottom:-0.25rem !important}.-mb-2{margin-bottom:-0.5rem !important}.-mb-3{margin-bottom:-1rem !important}.-mb-4{margin-bottom:-1.5rem !important}.-mb-5{margin-bottom:-2rem !important}.-mb-6{margin-bottom:-3rem !important}.-mb-7{margin-bottom:-4rem !important}.-mb-8{margin-bottom:-5rem !important}.mb-auto{margin-bottom:auto !important}.mx-0{margin-left:0rem !important;margin-right:0rem !important}.mx-1{margin-left:.25rem !important;margin-right:.25rem !important}.mx-2{margin-left:.5rem !important;margin-right:.5rem !important}.mx-3{margin-left:1rem !important;margin-right:1rem !important}.mx-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.mx-5{margin-left:2rem !important;margin-right:2rem !important}.mx-6{margin-left:3rem !important;margin-right:3rem !important}.mx-7{margin-left:4rem !important;margin-right:4rem !important}.mx-8{margin-left:5rem !important;margin-right:5rem !important}.-mx-1{margin-left:-0.25rem !important;margin-right:-0.25rem !important}.-mx-2{margin-left:-0.5rem !important;margin-right:-0.5rem !important}.-mx-3{margin-left:-1rem !important;margin-right:-1rem !important}.-mx-4{margin-left:-1.5rem !important;margin-right:-1.5rem !important}.-mx-5{margin-left:-2rem !important;margin-right:-2rem !important}.-mx-6{margin-left:-3rem !important;margin-right:-3rem !important}.-mx-7{margin-left:-4rem !important;margin-right:-4rem !important}.-mx-8{margin-left:-5rem !important;margin-right:-5rem !important}.mx-auto{margin-left:auto !important;margin-right:auto !important}.my-0{margin-top:0rem !important;margin-bottom:0rem !important}.my-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.my-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.my-3{margin-top:1rem !important;margin-bottom:1rem !important}.my-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.my-5{margin-top:2rem !important;margin-bottom:2rem !important}.my-6{margin-top:3rem !important;margin-bottom:3rem !important}.my-7{margin-top:4rem !important;margin-bottom:4rem !important}.my-8{margin-top:5rem !important;margin-bottom:5rem !important}.-my-1{margin-top:-0.25rem !important;margin-bottom:-0.25rem !important}.-my-2{margin-top:-0.5rem !important;margin-bottom:-0.5rem !important}.-my-3{margin-top:-1rem !important;margin-bottom:-1rem !important}.-my-4{margin-top:-1.5rem !important;margin-bottom:-1.5rem !important}.-my-5{margin-top:-2rem !important;margin-bottom:-2rem !important}.-my-6{margin-top:-3rem !important;margin-bottom:-3rem !important}.-my-7{margin-top:-4rem !important;margin-bottom:-4rem !important}.-my-8{margin-top:-5rem !important;margin-bottom:-5rem !important}.my-auto{margin-top:auto !important;margin-bottom:auto !important}@media screen and (min-width: 576px){.sm\:m-0{margin:0rem !important}.sm\:m-1{margin:.25rem !important}.sm\:m-2{margin:.5rem !important}.sm\:m-3{margin:1rem !important}.sm\:m-4{margin:1.5rem !important}.sm\:m-5{margin:2rem !important}.sm\:m-6{margin:3rem !important}.sm\:m-7{margin:4rem !important}.sm\:m-8{margin:5rem !important}.sm\:-m-1{margin:-0.25rem !important}.sm\:-m-2{margin:-0.5rem !important}.sm\:-m-3{margin:-1rem !important}.sm\:-m-4{margin:-1.5rem !important}.sm\:-m-5{margin:-2rem !important}.sm\:-m-6{margin:-3rem !important}.sm\:-m-7{margin:-4rem !important}.sm\:-m-8{margin:-5rem !important}.sm\:m-auto{margin:auto !important}.sm\:mt-0{margin-top:0rem !important}.sm\:mt-1{margin-top:.25rem !important}.sm\:mt-2{margin-top:.5rem !important}.sm\:mt-3{margin-top:1rem !important}.sm\:mt-4{margin-top:1.5rem !important}.sm\:mt-5{margin-top:2rem !important}.sm\:mt-6{margin-top:3rem !important}.sm\:mt-7{margin-top:4rem !important}.sm\:mt-8{margin-top:5rem !important}.sm\:-mt-1{margin-top:-0.25rem !important}.sm\:-mt-2{margin-top:-0.5rem !important}.sm\:-mt-3{margin-top:-1rem !important}.sm\:-mt-4{margin-top:-1.5rem !important}.sm\:-mt-5{margin-top:-2rem !important}.sm\:-mt-6{margin-top:-3rem !important}.sm\:-mt-7{margin-top:-4rem !important}.sm\:-mt-8{margin-top:-5rem !important}.sm\:mt-auto{margin-top:auto !important}.sm\:mr-0{margin-right:0rem !important}.sm\:mr-1{margin-right:.25rem !important}.sm\:mr-2{margin-right:.5rem !important}.sm\:mr-3{margin-right:1rem !important}.sm\:mr-4{margin-right:1.5rem !important}.sm\:mr-5{margin-right:2rem !important}.sm\:mr-6{margin-right:3rem !important}.sm\:mr-7{margin-right:4rem !important}.sm\:mr-8{margin-right:5rem !important}.sm\:-mr-1{margin-right:-0.25rem !important}.sm\:-mr-2{margin-right:-0.5rem !important}.sm\:-mr-3{margin-right:-1rem !important}.sm\:-mr-4{margin-right:-1.5rem !important}.sm\:-mr-5{margin-right:-2rem !important}.sm\:-mr-6{margin-right:-3rem !important}.sm\:-mr-7{margin-right:-4rem !important}.sm\:-mr-8{margin-right:-5rem !important}.sm\:mr-auto{margin-right:auto !important}.sm\:ml-0{margin-left:0rem !important}.sm\:ml-1{margin-left:.25rem !important}.sm\:ml-2{margin-left:.5rem !important}.sm\:ml-3{margin-left:1rem !important}.sm\:ml-4{margin-left:1.5rem !important}.sm\:ml-5{margin-left:2rem !important}.sm\:ml-6{margin-left:3rem !important}.sm\:ml-7{margin-left:4rem !important}.sm\:ml-8{margin-left:5rem !important}.sm\:-ml-1{margin-left:-0.25rem !important}.sm\:-ml-2{margin-left:-0.5rem !important}.sm\:-ml-3{margin-left:-1rem !important}.sm\:-ml-4{margin-left:-1.5rem !important}.sm\:-ml-5{margin-left:-2rem !important}.sm\:-ml-6{margin-left:-3rem !important}.sm\:-ml-7{margin-left:-4rem !important}.sm\:-ml-8{margin-left:-5rem !important}.sm\:ml-auto{margin-left:auto !important}.sm\:mb-0{margin-bottom:0rem !important}.sm\:mb-1{margin-bottom:.25rem !important}.sm\:mb-2{margin-bottom:.5rem !important}.sm\:mb-3{margin-bottom:1rem !important}.sm\:mb-4{margin-bottom:1.5rem !important}.sm\:mb-5{margin-bottom:2rem !important}.sm\:mb-6{margin-bottom:3rem !important}.sm\:mb-7{margin-bottom:4rem !important}.sm\:mb-8{margin-bottom:5rem !important}.sm\:-mb-1{margin-bottom:-0.25rem !important}.sm\:-mb-2{margin-bottom:-0.5rem !important}.sm\:-mb-3{margin-bottom:-1rem !important}.sm\:-mb-4{margin-bottom:-1.5rem !important}.sm\:-mb-5{margin-bottom:-2rem !important}.sm\:-mb-6{margin-bottom:-3rem !important}.sm\:-mb-7{margin-bottom:-4rem !important}.sm\:-mb-8{margin-bottom:-5rem !important}.sm\:mb-auto{margin-bottom:auto !important}.sm\:mx-0{margin-left:0rem !important;margin-right:0rem !important}.sm\:mx-1{margin-left:.25rem !important;margin-right:.25rem !important}.sm\:mx-2{margin-left:.5rem !important;margin-right:.5rem !important}.sm\:mx-3{margin-left:1rem !important;margin-right:1rem !important}.sm\:mx-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.sm\:mx-5{margin-left:2rem !important;margin-right:2rem !important}.sm\:mx-6{margin-left:3rem !important;margin-right:3rem !important}.sm\:mx-7{margin-left:4rem !important;margin-right:4rem !important}.sm\:mx-8{margin-left:5rem !important;margin-right:5rem !important}.sm\:-mx-1{margin-left:-0.25rem !important;margin-right:-0.25rem !important}.sm\:-mx-2{margin-left:-0.5rem !important;margin-right:-0.5rem !important}.sm\:-mx-3{margin-left:-1rem !important;margin-right:-1rem !important}.sm\:-mx-4{margin-left:-1.5rem !important;margin-right:-1.5rem !important}.sm\:-mx-5{margin-left:-2rem !important;margin-right:-2rem !important}.sm\:-mx-6{margin-left:-3rem !important;margin-right:-3rem !important}.sm\:-mx-7{margin-left:-4rem !important;margin-right:-4rem !important}.sm\:-mx-8{margin-left:-5rem !important;margin-right:-5rem !important}.sm\:mx-auto{margin-left:auto !important;margin-right:auto !important}.sm\:my-0{margin-top:0rem !important;margin-bottom:0rem !important}.sm\:my-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.sm\:my-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.sm\:my-3{margin-top:1rem !important;margin-bottom:1rem !important}.sm\:my-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.sm\:my-5{margin-top:2rem !important;margin-bottom:2rem !important}.sm\:my-6{margin-top:3rem !important;margin-bottom:3rem !important}.sm\:my-7{margin-top:4rem !important;margin-bottom:4rem !important}.sm\:my-8{margin-top:5rem !important;margin-bottom:5rem !important}.sm\:-my-1{margin-top:-0.25rem !important;margin-bottom:-0.25rem !important}.sm\:-my-2{margin-top:-0.5rem !important;margin-bottom:-0.5rem !important}.sm\:-my-3{margin-top:-1rem !important;margin-bottom:-1rem !important}.sm\:-my-4{margin-top:-1.5rem !important;margin-bottom:-1.5rem !important}.sm\:-my-5{margin-top:-2rem !important;margin-bottom:-2rem !important}.sm\:-my-6{margin-top:-3rem !important;margin-bottom:-3rem !important}.sm\:-my-7{margin-top:-4rem !important;margin-bottom:-4rem !important}.sm\:-my-8{margin-top:-5rem !important;margin-bottom:-5rem !important}.sm\:my-auto{margin-top:auto !important;margin-bottom:auto !important}}@media screen and (min-width: 768px){.md\:m-0{margin:0rem !important}.md\:m-1{margin:.25rem !important}.md\:m-2{margin:.5rem !important}.md\:m-3{margin:1rem !important}.md\:m-4{margin:1.5rem !important}.md\:m-5{margin:2rem !important}.md\:m-6{margin:3rem !important}.md\:m-7{margin:4rem !important}.md\:m-8{margin:5rem !important}.md\:-m-1{margin:-0.25rem !important}.md\:-m-2{margin:-0.5rem !important}.md\:-m-3{margin:-1rem !important}.md\:-m-4{margin:-1.5rem !important}.md\:-m-5{margin:-2rem !important}.md\:-m-6{margin:-3rem !important}.md\:-m-7{margin:-4rem !important}.md\:-m-8{margin:-5rem !important}.md\:m-auto{margin:auto !important}.md\:mt-0{margin-top:0rem !important}.md\:mt-1{margin-top:.25rem !important}.md\:mt-2{margin-top:.5rem !important}.md\:mt-3{margin-top:1rem !important}.md\:mt-4{margin-top:1.5rem !important}.md\:mt-5{margin-top:2rem !important}.md\:mt-6{margin-top:3rem !important}.md\:mt-7{margin-top:4rem !important}.md\:mt-8{margin-top:5rem !important}.md\:-mt-1{margin-top:-0.25rem !important}.md\:-mt-2{margin-top:-0.5rem !important}.md\:-mt-3{margin-top:-1rem !important}.md\:-mt-4{margin-top:-1.5rem !important}.md\:-mt-5{margin-top:-2rem !important}.md\:-mt-6{margin-top:-3rem !important}.md\:-mt-7{margin-top:-4rem !important}.md\:-mt-8{margin-top:-5rem !important}.md\:mt-auto{margin-top:auto !important}.md\:mr-0{margin-right:0rem !important}.md\:mr-1{margin-right:.25rem !important}.md\:mr-2{margin-right:.5rem !important}.md\:mr-3{margin-right:1rem !important}.md\:mr-4{margin-right:1.5rem !important}.md\:mr-5{margin-right:2rem !important}.md\:mr-6{margin-right:3rem !important}.md\:mr-7{margin-right:4rem !important}.md\:mr-8{margin-right:5rem !important}.md\:-mr-1{margin-right:-0.25rem !important}.md\:-mr-2{margin-right:-0.5rem !important}.md\:-mr-3{margin-right:-1rem !important}.md\:-mr-4{margin-right:-1.5rem !important}.md\:-mr-5{margin-right:-2rem !important}.md\:-mr-6{margin-right:-3rem !important}.md\:-mr-7{margin-right:-4rem !important}.md\:-mr-8{margin-right:-5rem !important}.md\:mr-auto{margin-right:auto !important}.md\:ml-0{margin-left:0rem !important}.md\:ml-1{margin-left:.25rem !important}.md\:ml-2{margin-left:.5rem !important}.md\:ml-3{margin-left:1rem !important}.md\:ml-4{margin-left:1.5rem !important}.md\:ml-5{margin-left:2rem !important}.md\:ml-6{margin-left:3rem !important}.md\:ml-7{margin-left:4rem !important}.md\:ml-8{margin-left:5rem !important}.md\:-ml-1{margin-left:-0.25rem !important}.md\:-ml-2{margin-left:-0.5rem !important}.md\:-ml-3{margin-left:-1rem !important}.md\:-ml-4{margin-left:-1.5rem !important}.md\:-ml-5{margin-left:-2rem !important}.md\:-ml-6{margin-left:-3rem !important}.md\:-ml-7{margin-left:-4rem !important}.md\:-ml-8{margin-left:-5rem !important}.md\:ml-auto{margin-left:auto !important}.md\:mb-0{margin-bottom:0rem !important}.md\:mb-1{margin-bottom:.25rem !important}.md\:mb-2{margin-bottom:.5rem !important}.md\:mb-3{margin-bottom:1rem !important}.md\:mb-4{margin-bottom:1.5rem !important}.md\:mb-5{margin-bottom:2rem !important}.md\:mb-6{margin-bottom:3rem !important}.md\:mb-7{margin-bottom:4rem !important}.md\:mb-8{margin-bottom:5rem !important}.md\:-mb-1{margin-bottom:-0.25rem !important}.md\:-mb-2{margin-bottom:-0.5rem !important}.md\:-mb-3{margin-bottom:-1rem !important}.md\:-mb-4{margin-bottom:-1.5rem !important}.md\:-mb-5{margin-bottom:-2rem !important}.md\:-mb-6{margin-bottom:-3rem !important}.md\:-mb-7{margin-bottom:-4rem !important}.md\:-mb-8{margin-bottom:-5rem !important}.md\:mb-auto{margin-bottom:auto !important}.md\:mx-0{margin-left:0rem !important;margin-right:0rem !important}.md\:mx-1{margin-left:.25rem !important;margin-right:.25rem !important}.md\:mx-2{margin-left:.5rem !important;margin-right:.5rem !important}.md\:mx-3{margin-left:1rem !important;margin-right:1rem !important}.md\:mx-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.md\:mx-5{margin-left:2rem !important;margin-right:2rem !important}.md\:mx-6{margin-left:3rem !important;margin-right:3rem !important}.md\:mx-7{margin-left:4rem !important;margin-right:4rem !important}.md\:mx-8{margin-left:5rem !important;margin-right:5rem !important}.md\:-mx-1{margin-left:-0.25rem !important;margin-right:-0.25rem !important}.md\:-mx-2{margin-left:-0.5rem !important;margin-right:-0.5rem !important}.md\:-mx-3{margin-left:-1rem !important;margin-right:-1rem !important}.md\:-mx-4{margin-left:-1.5rem !important;margin-right:-1.5rem !important}.md\:-mx-5{margin-left:-2rem !important;margin-right:-2rem !important}.md\:-mx-6{margin-left:-3rem !important;margin-right:-3rem !important}.md\:-mx-7{margin-left:-4rem !important;margin-right:-4rem !important}.md\:-mx-8{margin-left:-5rem !important;margin-right:-5rem !important}.md\:mx-auto{margin-left:auto !important;margin-right:auto !important}.md\:my-0{margin-top:0rem !important;margin-bottom:0rem !important}.md\:my-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.md\:my-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.md\:my-3{margin-top:1rem !important;margin-bottom:1rem !important}.md\:my-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.md\:my-5{margin-top:2rem !important;margin-bottom:2rem !important}.md\:my-6{margin-top:3rem !important;margin-bottom:3rem !important}.md\:my-7{margin-top:4rem !important;margin-bottom:4rem !important}.md\:my-8{margin-top:5rem !important;margin-bottom:5rem !important}.md\:-my-1{margin-top:-0.25rem !important;margin-bottom:-0.25rem !important}.md\:-my-2{margin-top:-0.5rem !important;margin-bottom:-0.5rem !important}.md\:-my-3{margin-top:-1rem !important;margin-bottom:-1rem !important}.md\:-my-4{margin-top:-1.5rem !important;margin-bottom:-1.5rem !important}.md\:-my-5{margin-top:-2rem !important;margin-bottom:-2rem !important}.md\:-my-6{margin-top:-3rem !important;margin-bottom:-3rem !important}.md\:-my-7{margin-top:-4rem !important;margin-bottom:-4rem !important}.md\:-my-8{margin-top:-5rem !important;margin-bottom:-5rem !important}.md\:my-auto{margin-top:auto !important;margin-bottom:auto !important}}@media screen and (min-width: 992px){.lg\:m-0{margin:0rem !important}.lg\:m-1{margin:.25rem !important}.lg\:m-2{margin:.5rem !important}.lg\:m-3{margin:1rem !important}.lg\:m-4{margin:1.5rem !important}.lg\:m-5{margin:2rem !important}.lg\:m-6{margin:3rem !important}.lg\:m-7{margin:4rem !important}.lg\:m-8{margin:5rem !important}.lg\:-m-1{margin:-0.25rem !important}.lg\:-m-2{margin:-0.5rem !important}.lg\:-m-3{margin:-1rem !important}.lg\:-m-4{margin:-1.5rem !important}.lg\:-m-5{margin:-2rem !important}.lg\:-m-6{margin:-3rem !important}.lg\:-m-7{margin:-4rem !important}.lg\:-m-8{margin:-5rem !important}.lg\:m-auto{margin:auto !important}.lg\:mt-0{margin-top:0rem !important}.lg\:mt-1{margin-top:.25rem !important}.lg\:mt-2{margin-top:.5rem !important}.lg\:mt-3{margin-top:1rem !important}.lg\:mt-4{margin-top:1.5rem !important}.lg\:mt-5{margin-top:2rem !important}.lg\:mt-6{margin-top:3rem !important}.lg\:mt-7{margin-top:4rem !important}.lg\:mt-8{margin-top:5rem !important}.lg\:-mt-1{margin-top:-0.25rem !important}.lg\:-mt-2{margin-top:-0.5rem !important}.lg\:-mt-3{margin-top:-1rem !important}.lg\:-mt-4{margin-top:-1.5rem !important}.lg\:-mt-5{margin-top:-2rem !important}.lg\:-mt-6{margin-top:-3rem !important}.lg\:-mt-7{margin-top:-4rem !important}.lg\:-mt-8{margin-top:-5rem !important}.lg\:mt-auto{margin-top:auto !important}.lg\:mr-0{margin-right:0rem !important}.lg\:mr-1{margin-right:.25rem !important}.lg\:mr-2{margin-right:.5rem !important}.lg\:mr-3{margin-right:1rem !important}.lg\:mr-4{margin-right:1.5rem !important}.lg\:mr-5{margin-right:2rem !important}.lg\:mr-6{margin-right:3rem !important}.lg\:mr-7{margin-right:4rem !important}.lg\:mr-8{margin-right:5rem !important}.lg\:-mr-1{margin-right:-0.25rem !important}.lg\:-mr-2{margin-right:-0.5rem !important}.lg\:-mr-3{margin-right:-1rem !important}.lg\:-mr-4{margin-right:-1.5rem !important}.lg\:-mr-5{margin-right:-2rem !important}.lg\:-mr-6{margin-right:-3rem !important}.lg\:-mr-7{margin-right:-4rem !important}.lg\:-mr-8{margin-right:-5rem !important}.lg\:mr-auto{margin-right:auto !important}.lg\:ml-0{margin-left:0rem !important}.lg\:ml-1{margin-left:.25rem !important}.lg\:ml-2{margin-left:.5rem !important}.lg\:ml-3{margin-left:1rem !important}.lg\:ml-4{margin-left:1.5rem !important}.lg\:ml-5{margin-left:2rem !important}.lg\:ml-6{margin-left:3rem !important}.lg\:ml-7{margin-left:4rem !important}.lg\:ml-8{margin-left:5rem !important}.lg\:-ml-1{margin-left:-0.25rem !important}.lg\:-ml-2{margin-left:-0.5rem !important}.lg\:-ml-3{margin-left:-1rem !important}.lg\:-ml-4{margin-left:-1.5rem !important}.lg\:-ml-5{margin-left:-2rem !important}.lg\:-ml-6{margin-left:-3rem !important}.lg\:-ml-7{margin-left:-4rem !important}.lg\:-ml-8{margin-left:-5rem !important}.lg\:ml-auto{margin-left:auto !important}.lg\:mb-0{margin-bottom:0rem !important}.lg\:mb-1{margin-bottom:.25rem !important}.lg\:mb-2{margin-bottom:.5rem !important}.lg\:mb-3{margin-bottom:1rem !important}.lg\:mb-4{margin-bottom:1.5rem !important}.lg\:mb-5{margin-bottom:2rem !important}.lg\:mb-6{margin-bottom:3rem !important}.lg\:mb-7{margin-bottom:4rem !important}.lg\:mb-8{margin-bottom:5rem !important}.lg\:-mb-1{margin-bottom:-0.25rem !important}.lg\:-mb-2{margin-bottom:-0.5rem !important}.lg\:-mb-3{margin-bottom:-1rem !important}.lg\:-mb-4{margin-bottom:-1.5rem !important}.lg\:-mb-5{margin-bottom:-2rem !important}.lg\:-mb-6{margin-bottom:-3rem !important}.lg\:-mb-7{margin-bottom:-4rem !important}.lg\:-mb-8{margin-bottom:-5rem !important}.lg\:mb-auto{margin-bottom:auto !important}.lg\:mx-0{margin-left:0rem !important;margin-right:0rem !important}.lg\:mx-1{margin-left:.25rem !important;margin-right:.25rem !important}.lg\:mx-2{margin-left:.5rem !important;margin-right:.5rem !important}.lg\:mx-3{margin-left:1rem !important;margin-right:1rem !important}.lg\:mx-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.lg\:mx-5{margin-left:2rem !important;margin-right:2rem !important}.lg\:mx-6{margin-left:3rem !important;margin-right:3rem !important}.lg\:mx-7{margin-left:4rem !important;margin-right:4rem !important}.lg\:mx-8{margin-left:5rem !important;margin-right:5rem !important}.lg\:-mx-1{margin-left:-0.25rem !important;margin-right:-0.25rem !important}.lg\:-mx-2{margin-left:-0.5rem !important;margin-right:-0.5rem !important}.lg\:-mx-3{margin-left:-1rem !important;margin-right:-1rem !important}.lg\:-mx-4{margin-left:-1.5rem !important;margin-right:-1.5rem !important}.lg\:-mx-5{margin-left:-2rem !important;margin-right:-2rem !important}.lg\:-mx-6{margin-left:-3rem !important;margin-right:-3rem !important}.lg\:-mx-7{margin-left:-4rem !important;margin-right:-4rem !important}.lg\:-mx-8{margin-left:-5rem !important;margin-right:-5rem !important}.lg\:mx-auto{margin-left:auto !important;margin-right:auto !important}.lg\:my-0{margin-top:0rem !important;margin-bottom:0rem !important}.lg\:my-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.lg\:my-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.lg\:my-3{margin-top:1rem !important;margin-bottom:1rem !important}.lg\:my-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.lg\:my-5{margin-top:2rem !important;margin-bottom:2rem !important}.lg\:my-6{margin-top:3rem !important;margin-bottom:3rem !important}.lg\:my-7{margin-top:4rem !important;margin-bottom:4rem !important}.lg\:my-8{margin-top:5rem !important;margin-bottom:5rem !important}.lg\:-my-1{margin-top:-0.25rem !important;margin-bottom:-0.25rem !important}.lg\:-my-2{margin-top:-0.5rem !important;margin-bottom:-0.5rem !important}.lg\:-my-3{margin-top:-1rem !important;margin-bottom:-1rem !important}.lg\:-my-4{margin-top:-1.5rem !important;margin-bottom:-1.5rem !important}.lg\:-my-5{margin-top:-2rem !important;margin-bottom:-2rem !important}.lg\:-my-6{margin-top:-3rem !important;margin-bottom:-3rem !important}.lg\:-my-7{margin-top:-4rem !important;margin-bottom:-4rem !important}.lg\:-my-8{margin-top:-5rem !important;margin-bottom:-5rem !important}.lg\:my-auto{margin-top:auto !important;margin-bottom:auto !important}}@media screen and (min-width: 1200px){.xl\:m-0{margin:0rem !important}.xl\:m-1{margin:.25rem !important}.xl\:m-2{margin:.5rem !important}.xl\:m-3{margin:1rem !important}.xl\:m-4{margin:1.5rem !important}.xl\:m-5{margin:2rem !important}.xl\:m-6{margin:3rem !important}.xl\:m-7{margin:4rem !important}.xl\:m-8{margin:5rem !important}.xl\:-m-1{margin:-0.25rem !important}.xl\:-m-2{margin:-0.5rem !important}.xl\:-m-3{margin:-1rem !important}.xl\:-m-4{margin:-1.5rem !important}.xl\:-m-5{margin:-2rem !important}.xl\:-m-6{margin:-3rem !important}.xl\:-m-7{margin:-4rem !important}.xl\:-m-8{margin:-5rem !important}.xl\:m-auto{margin:auto !important}.xl\:mt-0{margin-top:0rem !important}.xl\:mt-1{margin-top:.25rem !important}.xl\:mt-2{margin-top:.5rem !important}.xl\:mt-3{margin-top:1rem !important}.xl\:mt-4{margin-top:1.5rem !important}.xl\:mt-5{margin-top:2rem !important}.xl\:mt-6{margin-top:3rem !important}.xl\:mt-7{margin-top:4rem !important}.xl\:mt-8{margin-top:5rem !important}.xl\:-mt-1{margin-top:-0.25rem !important}.xl\:-mt-2{margin-top:-0.5rem !important}.xl\:-mt-3{margin-top:-1rem !important}.xl\:-mt-4{margin-top:-1.5rem !important}.xl\:-mt-5{margin-top:-2rem !important}.xl\:-mt-6{margin-top:-3rem !important}.xl\:-mt-7{margin-top:-4rem !important}.xl\:-mt-8{margin-top:-5rem !important}.xl\:mt-auto{margin-top:auto !important}.xl\:mr-0{margin-right:0rem !important}.xl\:mr-1{margin-right:.25rem !important}.xl\:mr-2{margin-right:.5rem !important}.xl\:mr-3{margin-right:1rem !important}.xl\:mr-4{margin-right:1.5rem !important}.xl\:mr-5{margin-right:2rem !important}.xl\:mr-6{margin-right:3rem !important}.xl\:mr-7{margin-right:4rem !important}.xl\:mr-8{margin-right:5rem !important}.xl\:-mr-1{margin-right:-0.25rem !important}.xl\:-mr-2{margin-right:-0.5rem !important}.xl\:-mr-3{margin-right:-1rem !important}.xl\:-mr-4{margin-right:-1.5rem !important}.xl\:-mr-5{margin-right:-2rem !important}.xl\:-mr-6{margin-right:-3rem !important}.xl\:-mr-7{margin-right:-4rem !important}.xl\:-mr-8{margin-right:-5rem !important}.xl\:mr-auto{margin-right:auto !important}.xl\:ml-0{margin-left:0rem !important}.xl\:ml-1{margin-left:.25rem !important}.xl\:ml-2{margin-left:.5rem !important}.xl\:ml-3{margin-left:1rem !important}.xl\:ml-4{margin-left:1.5rem !important}.xl\:ml-5{margin-left:2rem !important}.xl\:ml-6{margin-left:3rem !important}.xl\:ml-7{margin-left:4rem !important}.xl\:ml-8{margin-left:5rem !important}.xl\:-ml-1{margin-left:-0.25rem !important}.xl\:-ml-2{margin-left:-0.5rem !important}.xl\:-ml-3{margin-left:-1rem !important}.xl\:-ml-4{margin-left:-1.5rem !important}.xl\:-ml-5{margin-left:-2rem !important}.xl\:-ml-6{margin-left:-3rem !important}.xl\:-ml-7{margin-left:-4rem !important}.xl\:-ml-8{margin-left:-5rem !important}.xl\:ml-auto{margin-left:auto !important}.xl\:mb-0{margin-bottom:0rem !important}.xl\:mb-1{margin-bottom:.25rem !important}.xl\:mb-2{margin-bottom:.5rem !important}.xl\:mb-3{margin-bottom:1rem !important}.xl\:mb-4{margin-bottom:1.5rem !important}.xl\:mb-5{margin-bottom:2rem !important}.xl\:mb-6{margin-bottom:3rem !important}.xl\:mb-7{margin-bottom:4rem !important}.xl\:mb-8{margin-bottom:5rem !important}.xl\:-mb-1{margin-bottom:-0.25rem !important}.xl\:-mb-2{margin-bottom:-0.5rem !important}.xl\:-mb-3{margin-bottom:-1rem !important}.xl\:-mb-4{margin-bottom:-1.5rem !important}.xl\:-mb-5{margin-bottom:-2rem !important}.xl\:-mb-6{margin-bottom:-3rem !important}.xl\:-mb-7{margin-bottom:-4rem !important}.xl\:-mb-8{margin-bottom:-5rem !important}.xl\:mb-auto{margin-bottom:auto !important}.xl\:mx-0{margin-left:0rem !important;margin-right:0rem !important}.xl\:mx-1{margin-left:.25rem !important;margin-right:.25rem !important}.xl\:mx-2{margin-left:.5rem !important;margin-right:.5rem !important}.xl\:mx-3{margin-left:1rem !important;margin-right:1rem !important}.xl\:mx-4{margin-left:1.5rem !important;margin-right:1.5rem !important}.xl\:mx-5{margin-left:2rem !important;margin-right:2rem !important}.xl\:mx-6{margin-left:3rem !important;margin-right:3rem !important}.xl\:mx-7{margin-left:4rem !important;margin-right:4rem !important}.xl\:mx-8{margin-left:5rem !important;margin-right:5rem !important}.xl\:-mx-1{margin-left:-0.25rem !important;margin-right:-0.25rem !important}.xl\:-mx-2{margin-left:-0.5rem !important;margin-right:-0.5rem !important}.xl\:-mx-3{margin-left:-1rem !important;margin-right:-1rem !important}.xl\:-mx-4{margin-left:-1.5rem !important;margin-right:-1.5rem !important}.xl\:-mx-5{margin-left:-2rem !important;margin-right:-2rem !important}.xl\:-mx-6{margin-left:-3rem !important;margin-right:-3rem !important}.xl\:-mx-7{margin-left:-4rem !important;margin-right:-4rem !important}.xl\:-mx-8{margin-left:-5rem !important;margin-right:-5rem !important}.xl\:mx-auto{margin-left:auto !important;margin-right:auto !important}.xl\:my-0{margin-top:0rem !important;margin-bottom:0rem !important}.xl\:my-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.xl\:my-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.xl\:my-3{margin-top:1rem !important;margin-bottom:1rem !important}.xl\:my-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.xl\:my-5{margin-top:2rem !important;margin-bottom:2rem !important}.xl\:my-6{margin-top:3rem !important;margin-bottom:3rem !important}.xl\:my-7{margin-top:4rem !important;margin-bottom:4rem !important}.xl\:my-8{margin-top:5rem !important;margin-bottom:5rem !important}.xl\:-my-1{margin-top:-0.25rem !important;margin-bottom:-0.25rem !important}.xl\:-my-2{margin-top:-0.5rem !important;margin-bottom:-0.5rem !important}.xl\:-my-3{margin-top:-1rem !important;margin-bottom:-1rem !important}.xl\:-my-4{margin-top:-1.5rem !important;margin-bottom:-1.5rem !important}.xl\:-my-5{margin-top:-2rem !important;margin-bottom:-2rem !important}.xl\:-my-6{margin-top:-3rem !important;margin-bottom:-3rem !important}.xl\:-my-7{margin-top:-4rem !important;margin-bottom:-4rem !important}.xl\:-my-8{margin-top:-5rem !important;margin-bottom:-5rem !important}.xl\:my-auto{margin-top:auto !important;margin-bottom:auto !important}}.shadow-none{box-shadow:none !important}.shadow-1{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.shadow-2{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.shadow-3{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.shadow-4{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.shadow-5{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.shadow-6{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.shadow-7{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.shadow-8{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.focus\:shadow-none:focus{box-shadow:none !important}.hover\:shadow-none:hover{box-shadow:none !important}.active\:shadow-none:active{box-shadow:none !important}.focus\:shadow-1:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.hover\:shadow-1:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.active\:shadow-1:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.focus\:shadow-2:focus{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.hover\:shadow-2:hover{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.active\:shadow-2:active{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.focus\:shadow-3:focus{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.hover\:shadow-3:hover{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.active\:shadow-3:active{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.focus\:shadow-4:focus{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.hover\:shadow-4:hover{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.active\:shadow-4:active{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.focus\:shadow-5:focus{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.hover\:shadow-5:hover{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.active\:shadow-5:active{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.focus\:shadow-6:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.hover\:shadow-6:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.active\:shadow-6:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.focus\:shadow-7:focus{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.hover\:shadow-7:hover{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.active\:shadow-7:active{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.focus\:shadow-8:focus{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.hover\:shadow-8:hover{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.active\:shadow-8:active{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}@media screen and (min-width: 576px){.sm\:shadow-none{box-shadow:none !important}.sm\:shadow-1{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.sm\:shadow-2{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.sm\:shadow-3{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.sm\:shadow-4{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.sm\:shadow-5{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.sm\:shadow-6{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.sm\:shadow-7{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.sm\:shadow-8{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.sm\:focus\:shadow-none:focus{box-shadow:none !important}.sm\:hover\:shadow-none:hover{box-shadow:none !important}.sm\:active\:shadow-none:active{box-shadow:none !important}.sm\:focus\:shadow-1:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.sm\:hover\:shadow-1:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.sm\:active\:shadow-1:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.sm\:focus\:shadow-2:focus{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.sm\:hover\:shadow-2:hover{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.sm\:active\:shadow-2:active{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.sm\:focus\:shadow-3:focus{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.sm\:hover\:shadow-3:hover{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.sm\:active\:shadow-3:active{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.sm\:focus\:shadow-4:focus{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.sm\:hover\:shadow-4:hover{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.sm\:active\:shadow-4:active{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.sm\:focus\:shadow-5:focus{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.sm\:hover\:shadow-5:hover{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.sm\:active\:shadow-5:active{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.sm\:focus\:shadow-6:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.sm\:hover\:shadow-6:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.sm\:active\:shadow-6:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.sm\:focus\:shadow-7:focus{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.sm\:hover\:shadow-7:hover{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.sm\:active\:shadow-7:active{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.sm\:focus\:shadow-8:focus{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.sm\:hover\:shadow-8:hover{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.sm\:active\:shadow-8:active{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}}@media screen and (min-width: 768px){.md\:shadow-none{box-shadow:none !important}.md\:shadow-1{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.md\:shadow-2{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.md\:shadow-3{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.md\:shadow-4{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.md\:shadow-5{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.md\:shadow-6{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.md\:shadow-7{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.md\:shadow-8{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.md\:focus\:shadow-none:focus{box-shadow:none !important}.md\:hover\:shadow-none:hover{box-shadow:none !important}.md\:active\:shadow-none:active{box-shadow:none !important}.md\:focus\:shadow-1:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.md\:hover\:shadow-1:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.md\:active\:shadow-1:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.md\:focus\:shadow-2:focus{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.md\:hover\:shadow-2:hover{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.md\:active\:shadow-2:active{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.md\:focus\:shadow-3:focus{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.md\:hover\:shadow-3:hover{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.md\:active\:shadow-3:active{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.md\:focus\:shadow-4:focus{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.md\:hover\:shadow-4:hover{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.md\:active\:shadow-4:active{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.md\:focus\:shadow-5:focus{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.md\:hover\:shadow-5:hover{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.md\:active\:shadow-5:active{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.md\:focus\:shadow-6:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.md\:hover\:shadow-6:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.md\:active\:shadow-6:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.md\:focus\:shadow-7:focus{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.md\:hover\:shadow-7:hover{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.md\:active\:shadow-7:active{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.md\:focus\:shadow-8:focus{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.md\:hover\:shadow-8:hover{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.md\:active\:shadow-8:active{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}}@media screen and (min-width: 992px){.lg\:shadow-none{box-shadow:none !important}.lg\:shadow-1{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.lg\:shadow-2{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.lg\:shadow-3{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.lg\:shadow-4{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.lg\:shadow-5{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.lg\:shadow-6{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.lg\:shadow-7{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.lg\:shadow-8{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.lg\:focus\:shadow-none:focus{box-shadow:none !important}.lg\:hover\:shadow-none:hover{box-shadow:none !important}.lg\:active\:shadow-none:active{box-shadow:none !important}.lg\:focus\:shadow-1:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.lg\:hover\:shadow-1:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.lg\:active\:shadow-1:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.lg\:focus\:shadow-2:focus{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.lg\:hover\:shadow-2:hover{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.lg\:active\:shadow-2:active{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.lg\:focus\:shadow-3:focus{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.lg\:hover\:shadow-3:hover{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.lg\:active\:shadow-3:active{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.lg\:focus\:shadow-4:focus{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.lg\:hover\:shadow-4:hover{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.lg\:active\:shadow-4:active{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.lg\:focus\:shadow-5:focus{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.lg\:hover\:shadow-5:hover{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.lg\:active\:shadow-5:active{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.lg\:focus\:shadow-6:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.lg\:hover\:shadow-6:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.lg\:active\:shadow-6:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.lg\:focus\:shadow-7:focus{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.lg\:hover\:shadow-7:hover{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.lg\:active\:shadow-7:active{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.lg\:focus\:shadow-8:focus{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.lg\:hover\:shadow-8:hover{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.lg\:active\:shadow-8:active{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}}@media screen and (min-width: 1200px){.xl\:shadow-none{box-shadow:none !important}.xl\:shadow-1{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.xl\:shadow-2{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.xl\:shadow-3{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.xl\:shadow-4{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.xl\:shadow-5{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.xl\:shadow-6{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.xl\:shadow-7{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.xl\:shadow-8{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.xl\:focus\:shadow-none:focus{box-shadow:none !important}.xl\:hover\:shadow-none:hover{box-shadow:none !important}.xl\:active\:shadow-none:active{box-shadow:none !important}.xl\:focus\:shadow-1:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.xl\:hover\:shadow-1:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.xl\:active\:shadow-1:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.02), 0px 0px 2px rgba(0, 0, 0, 0.05), 0px 1px 4px rgba(0, 0, 0, 0.08) !important}.xl\:focus\:shadow-2:focus{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.xl\:hover\:shadow-2:hover{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.xl\:active\:shadow-2:active{box-shadow:0px 4px 10px rgba(0, 0, 0, 0.03), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 2px 6px rgba(0, 0, 0, 0.12) !important}.xl\:focus\:shadow-3:focus{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.xl\:hover\:shadow-3:hover{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.xl\:active\:shadow-3:active{box-shadow:0px 1px 8px rgba(0, 0, 0, 0.08), 0px 3px 4px rgba(0, 0, 0, 0.1), 0px 1px 4px -1px rgba(0, 0, 0, 0.1) !important}.xl\:focus\:shadow-4:focus{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.xl\:hover\:shadow-4:hover{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.xl\:active\:shadow-4:active{box-shadow:0px 1px 10px rgba(0, 0, 0, 0.12), 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.2) !important}.xl\:focus\:shadow-5:focus{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.xl\:hover\:shadow-5:hover{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.xl\:active\:shadow-5:active{box-shadow:0px 1px 7px rgba(0, 0, 0, 0.1), 0px 4px 5px -2px rgba(0, 0, 0, 0.12), 0px 10px 15px -5px rgba(0, 0, 0, 0.2) !important}.xl\:focus\:shadow-6:focus{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.xl\:hover\:shadow-6:hover{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.xl\:active\:shadow-6:active{box-shadow:0px 3px 5px rgba(0, 0, 0, 0.06), 0px 7px 9px rgba(0, 0, 0, 0.12), 0px 20px 25px -8px rgba(0, 0, 0, 0.18) !important}.xl\:focus\:shadow-7:focus{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.xl\:hover\:shadow-7:hover{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.xl\:active\:shadow-7:active{box-shadow:0px 7px 30px rgba(0, 0, 0, 0.08), 0px 22px 30px 2px rgba(0, 0, 0, 0.15), 0px 8px 10px rgba(0, 0, 0, 0.15) !important}.xl\:focus\:shadow-8:focus{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.xl\:hover\:shadow-8:hover{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}.xl\:active\:shadow-8:active{box-shadow:0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 11px 15px rgba(0, 0, 0, 0.2) !important}}.border-none{border-width:0px !important;border-style:none}.border-1{border-width:1px !important;border-style:solid}.border-2{border-width:2px !important;border-style:solid}.border-3{border-width:3px !important;border-style:solid}.border-top-none{border-top-width:0px !important;border-top-style:none}.border-top-1{border-top-width:1px !important;border-top-style:solid}.border-top-2{border-top-width:2px !important;border-top-style:solid}.border-top-3{border-top-width:3px !important;border-top-style:solid}.border-right-none{border-right-width:0px !important;border-right-style:none}.border-right-1{border-right-width:1px !important;border-right-style:solid}.border-right-2{border-right-width:2px !important;border-right-style:solid}.border-right-3{border-right-width:3px !important;border-right-style:solid}.border-left-none{border-left-width:0px !important;border-left-style:none}.border-left-1{border-left-width:1px !important;border-left-style:solid}.border-left-2{border-left-width:2px !important;border-left-style:solid}.border-left-3{border-left-width:3px !important;border-left-style:solid}.border-bottom-none{border-bottom-width:0px !important;border-bottom-style:none}.border-bottom-1{border-bottom-width:1px !important;border-bottom-style:solid}.border-bottom-2{border-bottom-width:2px !important;border-bottom-style:solid}.border-bottom-3{border-bottom-width:3px !important;border-bottom-style:solid}.border-x-none{border-left-width:0px !important;border-left-style:none;border-right-width:0px !important;border-right-style:none}.border-x-1{border-left-width:1px !important;border-left-style:solid;border-right-width:1px !important;border-right-style:solid}.border-x-2{border-left-width:2px !important;border-left-style:solid;border-right-width:2px !important;border-right-style:solid}.border-x-3{border-left-width:3px !important;border-left-style:solid;border-right-width:3px !important;border-right-style:solid}.border-y-none{border-top-width:0px !important;border-top-style:none;border-bottom-width:0px !important;border-bottom-style:none}.border-y-1{border-top-width:1px !important;border-top-style:solid;border-bottom-width:1px !important;border-bottom-style:solid}.border-y-2{border-top-width:2px !important;border-top-style:solid;border-bottom-width:2px !important;border-bottom-style:solid}.border-y-3{border-top-width:3px !important;border-top-style:solid;border-bottom-width:3px !important;border-bottom-style:solid}@media screen and (min-width: 576px){.sm\:border-none{border-width:0px !important;border-style:none}.sm\:border-1{border-width:1px !important;border-style:solid}.sm\:border-2{border-width:2px !important;border-style:solid}.sm\:border-3{border-width:3px !important;border-style:solid}.sm\:border-top-none{border-top-width:0px !important;border-top-style:none}.sm\:border-top-1{border-top-width:1px !important;border-top-style:solid}.sm\:border-top-2{border-top-width:2px !important;border-top-style:solid}.sm\:border-top-3{border-top-width:3px !important;border-top-style:solid}.sm\:border-right-none{border-right-width:0px !important;border-right-style:none}.sm\:border-right-1{border-right-width:1px !important;border-right-style:solid}.sm\:border-right-2{border-right-width:2px !important;border-right-style:solid}.sm\:border-right-3{border-right-width:3px !important;border-right-style:solid}.sm\:border-left-none{border-left-width:0px !important;border-left-style:none}.sm\:border-left-1{border-left-width:1px !important;border-left-style:solid}.sm\:border-left-2{border-left-width:2px !important;border-left-style:solid}.sm\:border-left-3{border-left-width:3px !important;border-left-style:solid}.sm\:border-bottom-none{border-bottom-width:0px !important;border-bottom-style:none}.sm\:border-bottom-1{border-bottom-width:1px !important;border-bottom-style:solid}.sm\:border-bottom-2{border-bottom-width:2px !important;border-bottom-style:solid}.sm\:border-bottom-3{border-bottom-width:3px !important;border-bottom-style:solid}.sm\:border-x-none{border-left-width:0px !important;border-left-style:none;border-right-width:0px !important;border-right-style:none}.sm\:border-x-1{border-left-width:1px !important;border-left-style:solid;border-right-width:1px !important;border-right-style:solid}.sm\:border-x-2{border-left-width:2px !important;border-left-style:solid;border-right-width:2px !important;border-right-style:solid}.sm\:border-x-3{border-left-width:3px !important;border-left-style:solid;border-right-width:3px !important;border-right-style:solid}.sm\:border-y-none{border-top-width:0px !important;border-top-style:none;border-bottom-width:0px !important;border-bottom-style:none}.sm\:border-y-1{border-top-width:1px !important;border-top-style:solid;border-bottom-width:1px !important;border-bottom-style:solid}.sm\:border-y-2{border-top-width:2px !important;border-top-style:solid;border-bottom-width:2px !important;border-bottom-style:solid}.sm\:border-y-3{border-top-width:3px !important;border-top-style:solid;border-bottom-width:3px !important;border-bottom-style:solid}}@media screen and (min-width: 768px){.md\:border-none{border-width:0px !important;border-style:none}.md\:border-1{border-width:1px !important;border-style:solid}.md\:border-2{border-width:2px !important;border-style:solid}.md\:border-3{border-width:3px !important;border-style:solid}.md\:border-top-none{border-top-width:0px !important;border-top-style:none}.md\:border-top-1{border-top-width:1px !important;border-top-style:solid}.md\:border-top-2{border-top-width:2px !important;border-top-style:solid}.md\:border-top-3{border-top-width:3px !important;border-top-style:solid}.md\:border-right-none{border-right-width:0px !important;border-right-style:none}.md\:border-right-1{border-right-width:1px !important;border-right-style:solid}.md\:border-right-2{border-right-width:2px !important;border-right-style:solid}.md\:border-right-3{border-right-width:3px !important;border-right-style:solid}.md\:border-left-none{border-left-width:0px !important;border-left-style:none}.md\:border-left-1{border-left-width:1px !important;border-left-style:solid}.md\:border-left-2{border-left-width:2px !important;border-left-style:solid}.md\:border-left-3{border-left-width:3px !important;border-left-style:solid}.md\:border-bottom-none{border-bottom-width:0px !important;border-bottom-style:none}.md\:border-bottom-1{border-bottom-width:1px !important;border-bottom-style:solid}.md\:border-bottom-2{border-bottom-width:2px !important;border-bottom-style:solid}.md\:border-bottom-3{border-bottom-width:3px !important;border-bottom-style:solid}.md\:border-x-none{border-left-width:0px !important;border-left-style:none;border-right-width:0px !important;border-right-style:none}.md\:border-x-1{border-left-width:1px !important;border-left-style:solid;border-right-width:1px !important;border-right-style:solid}.md\:border-x-2{border-left-width:2px !important;border-left-style:solid;border-right-width:2px !important;border-right-style:solid}.md\:border-x-3{border-left-width:3px !important;border-left-style:solid;border-right-width:3px !important;border-right-style:solid}.md\:border-y-none{border-top-width:0px !important;border-top-style:none;border-bottom-width:0px !important;border-bottom-style:none}.md\:border-y-1{border-top-width:1px !important;border-top-style:solid;border-bottom-width:1px !important;border-bottom-style:solid}.md\:border-y-2{border-top-width:2px !important;border-top-style:solid;border-bottom-width:2px !important;border-bottom-style:solid}.md\:border-y-3{border-top-width:3px !important;border-top-style:solid;border-bottom-width:3px !important;border-bottom-style:solid}}@media screen and (min-width: 992px){.lg\:border-none{border-width:0px !important;border-style:none}.lg\:border-1{border-width:1px !important;border-style:solid}.lg\:border-2{border-width:2px !important;border-style:solid}.lg\:border-3{border-width:3px !important;border-style:solid}.lg\:border-top-none{border-top-width:0px !important;border-top-style:none}.lg\:border-top-1{border-top-width:1px !important;border-top-style:solid}.lg\:border-top-2{border-top-width:2px !important;border-top-style:solid}.lg\:border-top-3{border-top-width:3px !important;border-top-style:solid}.lg\:border-right-none{border-right-width:0px !important;border-right-style:none}.lg\:border-right-1{border-right-width:1px !important;border-right-style:solid}.lg\:border-right-2{border-right-width:2px !important;border-right-style:solid}.lg\:border-right-3{border-right-width:3px !important;border-right-style:solid}.lg\:border-left-none{border-left-width:0px !important;border-left-style:none}.lg\:border-left-1{border-left-width:1px !important;border-left-style:solid}.lg\:border-left-2{border-left-width:2px !important;border-left-style:solid}.lg\:border-left-3{border-left-width:3px !important;border-left-style:solid}.lg\:border-bottom-none{border-bottom-width:0px !important;border-bottom-style:none}.lg\:border-bottom-1{border-bottom-width:1px !important;border-bottom-style:solid}.lg\:border-bottom-2{border-bottom-width:2px !important;border-bottom-style:solid}.lg\:border-bottom-3{border-bottom-width:3px !important;border-bottom-style:solid}.lg\:border-x-none{border-left-width:0px !important;border-left-style:none;border-right-width:0px !important;border-right-style:none}.lg\:border-x-1{border-left-width:1px !important;border-left-style:solid;border-right-width:1px !important;border-right-style:solid}.lg\:border-x-2{border-left-width:2px !important;border-left-style:solid;border-right-width:2px !important;border-right-style:solid}.lg\:border-x-3{border-left-width:3px !important;border-left-style:solid;border-right-width:3px !important;border-right-style:solid}.lg\:border-y-none{border-top-width:0px !important;border-top-style:none;border-bottom-width:0px !important;border-bottom-style:none}.lg\:border-y-1{border-top-width:1px !important;border-top-style:solid;border-bottom-width:1px !important;border-bottom-style:solid}.lg\:border-y-2{border-top-width:2px !important;border-top-style:solid;border-bottom-width:2px !important;border-bottom-style:solid}.lg\:border-y-3{border-top-width:3px !important;border-top-style:solid;border-bottom-width:3px !important;border-bottom-style:solid}}@media screen and (min-width: 1200px){.xl\:border-none{border-width:0px !important;border-style:none}.xl\:border-1{border-width:1px !important;border-style:solid}.xl\:border-2{border-width:2px !important;border-style:solid}.xl\:border-3{border-width:3px !important;border-style:solid}.xl\:border-top-none{border-top-width:0px !important;border-top-style:none}.xl\:border-top-1{border-top-width:1px !important;border-top-style:solid}.xl\:border-top-2{border-top-width:2px !important;border-top-style:solid}.xl\:border-top-3{border-top-width:3px !important;border-top-style:solid}.xl\:border-right-none{border-right-width:0px !important;border-right-style:none}.xl\:border-right-1{border-right-width:1px !important;border-right-style:solid}.xl\:border-right-2{border-right-width:2px !important;border-right-style:solid}.xl\:border-right-3{border-right-width:3px !important;border-right-style:solid}.xl\:border-left-none{border-left-width:0px !important;border-left-style:none}.xl\:border-left-1{border-left-width:1px !important;border-left-style:solid}.xl\:border-left-2{border-left-width:2px !important;border-left-style:solid}.xl\:border-left-3{border-left-width:3px !important;border-left-style:solid}.xl\:border-bottom-none{border-bottom-width:0px !important;border-bottom-style:none}.xl\:border-bottom-1{border-bottom-width:1px !important;border-bottom-style:solid}.xl\:border-bottom-2{border-bottom-width:2px !important;border-bottom-style:solid}.xl\:border-bottom-3{border-bottom-width:3px !important;border-bottom-style:solid}.xl\:border-x-none{border-left-width:0px !important;border-left-style:none;border-right-width:0px !important;border-right-style:none}.xl\:border-x-1{border-left-width:1px !important;border-left-style:solid;border-right-width:1px !important;border-right-style:solid}.xl\:border-x-2{border-left-width:2px !important;border-left-style:solid;border-right-width:2px !important;border-right-style:solid}.xl\:border-x-3{border-left-width:3px !important;border-left-style:solid;border-right-width:3px !important;border-right-style:solid}.xl\:border-y-none{border-top-width:0px !important;border-top-style:none;border-bottom-width:0px !important;border-bottom-style:none}.xl\:border-y-1{border-top-width:1px !important;border-top-style:solid;border-bottom-width:1px !important;border-bottom-style:solid}.xl\:border-y-2{border-top-width:2px !important;border-top-style:solid;border-bottom-width:2px !important;border-bottom-style:solid}.xl\:border-y-3{border-top-width:3px !important;border-top-style:solid;border-bottom-width:3px !important;border-bottom-style:solid}}.border-solid{border-style:solid !important}.border-dashed{border-style:dashed !important}.border-dotted{border-style:dotted !important}.border-double{border-style:double !important}@media screen and (min-width: 576px){.sm\:border-solid{border-style:solid !important}.sm\:border-dashed{border-style:dashed !important}.sm\:border-dotted{border-style:dotted !important}.sm\:border-double{border-style:double !important}}@media screen and (min-width: 768px){.md\:border-solid{border-style:solid !important}.md\:border-dashed{border-style:dashed !important}.md\:border-dotted{border-style:dotted !important}.md\:border-double{border-style:double !important}}@media screen and (min-width: 992px){.lg\:border-solid{border-style:solid !important}.lg\:border-dashed{border-style:dashed !important}.lg\:border-dotted{border-style:dotted !important}.lg\:border-double{border-style:double !important}}@media screen and (min-width: 1200px){.xl\:border-solid{border-style:solid !important}.xl\:border-dashed{border-style:dashed !important}.xl\:border-dotted{border-style:dotted !important}.xl\:border-double{border-style:double !important}}.border-noround{border-radius:0 !important}.border-round{border-radius:var(--border-radius) !important}.border-round-xs{border-radius:0.125rem !important}.border-round-sm{border-radius:0.25rem !important}.border-round-md{border-radius:0.375rem !important}.border-round-lg{border-radius:0.5rem !important}.border-round-xl{border-radius:0.75rem !important}.border-round-2xl{border-radius:1rem !important}.border-round-3xl{border-radius:1.5rem !important}.border-circle{border-radius:50% !important}@media screen and (min-width: 576px){.sm\:border-noround{border-radius:0 !important}.sm\:border-round{border-radius:var(--border-radius) !important}.sm\:border-round-xs{border-radius:0.125rem !important}.sm\:border-round-sm{border-radius:0.25rem !important}.sm\:border-round-md{border-radius:0.375rem !important}.sm\:border-round-lg{border-radius:0.5rem !important}.sm\:border-round-xl{border-radius:0.75rem !important}.sm\:border-round-2xl{border-radius:1rem !important}.sm\:border-round-3xl{border-radius:1.5rem !important}.sm\:border-circle{border-radius:50% !important}}@media screen and (min-width: 768px){.md\:border-noround{border-radius:0 !important}.md\:border-round{border-radius:var(--border-radius) !important}.md\:border-round-xs{border-radius:0.125rem !important}.md\:border-round-sm{border-radius:0.25rem !important}.md\:border-round-md{border-radius:0.375rem !important}.md\:border-round-lg{border-radius:0.5rem !important}.md\:border-round-xl{border-radius:0.75rem !important}.md\:border-round-2xl{border-radius:1rem !important}.md\:border-round-3xl{border-radius:1.5rem !important}.md\:border-circle{border-radius:50% !important}}@media screen and (min-width: 992px){.lg\:border-noround{border-radius:0 !important}.lg\:border-round{border-radius:var(--border-radius) !important}.lg\:border-round-xs{border-radius:0.125rem !important}.lg\:border-round-sm{border-radius:0.25rem !important}.lg\:border-round-md{border-radius:0.375rem !important}.lg\:border-round-lg{border-radius:0.5rem !important}.lg\:border-round-xl{border-radius:0.75rem !important}.lg\:border-round-2xl{border-radius:1rem !important}.lg\:border-round-3xl{border-radius:1.5rem !important}.lg\:border-circle{border-radius:50% !important}}@media screen and (min-width: 1200px){.xl\:border-noround{border-radius:0 !important}.xl\:border-round{border-radius:var(--border-radius) !important}.xl\:border-round-xs{border-radius:0.125rem !important}.xl\:border-round-sm{border-radius:0.25rem !important}.xl\:border-round-md{border-radius:0.375rem !important}.xl\:border-round-lg{border-radius:0.5rem !important}.xl\:border-round-xl{border-radius:0.75rem !important}.xl\:border-round-2xl{border-radius:1rem !important}.xl\:border-round-3xl{border-radius:1.5rem !important}.xl\:border-circle{border-radius:50% !important}}.border-noround-left{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.border-noround-top{border-top-left-radius:0 !important;border-top-right-radius:0 !important}.border-noround-right{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.border-noround-bottom{border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important}.border-round-left{border-top-left-radius:var(--border-radius) !important;border-bottom-left-radius:var(--border-radius) !important}.border-round-top{border-top-left-radius:var(--border-radius) !important;border-top-right-radius:var(--border-radius) !important}.border-round-right{border-top-right-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.border-round-bottom{border-bottom-left-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.border-round-left-xs{border-top-left-radius:0.125rem !important;border-bottom-left-radius:0.125rem !important}.border-round-top-xs{border-top-left-radius:0.125rem !important;border-top-right-radius:0.125rem !important}.border-round-right-xs{border-top-right-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.border-round-bottom-xs{border-bottom-left-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.border-round-left-sm{border-top-left-radius:0.25rem !important;border-bottom-left-radius:0.25rem !important}.border-round-top-sm{border-top-left-radius:0.25rem !important;border-top-right-radius:0.25rem !important}.border-round-right-sm{border-top-right-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.border-round-bottom-sm{border-bottom-left-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.border-round-left-md{border-top-left-radius:0.375rem !important;border-bottom-left-radius:0.375rem !important}.border-round-top-md{border-top-left-radius:0.375rem !important;border-top-right-radius:0.375rem !important}.border-round-right-md{border-top-right-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.border-round-bottom-md{border-bottom-left-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.border-round-left-lg{border-top-left-radius:0.5rem !important;border-bottom-left-radius:0.5rem !important}.border-round-top-lg{border-top-left-radius:0.5rem !important;border-top-right-radius:0.5rem !important}.border-round-right-lg{border-top-right-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.border-round-bottom-lg{border-bottom-left-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.border-round-left-xl{border-top-left-radius:0.75rem !important;border-bottom-left-radius:0.75rem !important}.border-round-top-xl{border-top-left-radius:0.75rem !important;border-top-right-radius:0.75rem !important}.border-round-right-xl{border-top-right-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.border-round-bottom-xl{border-bottom-left-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.border-round-left-2xl{border-top-left-radius:1rem !important;border-bottom-left-radius:1rem !important}.border-round-top-2xl{border-top-left-radius:1rem !important;border-top-right-radius:1rem !important}.border-round-right-2xl{border-top-right-radius:1rem !important;border-bottom-right-radius:1rem !important}.border-round-bottom-2xl{border-bottom-left-radius:1rem !important;border-bottom-right-radius:1rem !important}.border-round-left-3xl{border-top-left-radius:1.5rem !important;border-bottom-left-radius:1.5rem !important}.border-round-top-3xl{border-top-left-radius:1.5rem !important;border-top-right-radius:1.5rem !important}.border-round-right-3xl{border-top-right-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.border-round-bottom-3xl{border-bottom-left-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.border-circle-left{border-top-left-radius:50% !important;border-bottom-left-radius:50% !important}.border-circle-top{border-top-left-radius:50% !important;border-top-right-radius:50% !important}.border-circle-right{border-top-right-radius:50% !important;border-bottom-right-radius:50% !important}.border-circle-bottom{border-bottom-left-radius:50% !important;border-bottom-right-radius:50% !important}@media screen and (min-width: 576px){.sm\:border-noround-left{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.sm\:border-noround-top{border-top-left-radius:0 !important;border-top-right-radius:0 !important}.sm\:border-noround-right{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.sm\:border-noround-bottom{border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important}.sm\:border-round-left{border-top-left-radius:var(--border-radius) !important;border-bottom-left-radius:var(--border-radius) !important}.sm\:border-round-top{border-top-left-radius:var(--border-radius) !important;border-top-right-radius:var(--border-radius) !important}.sm\:border-round-right{border-top-right-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.sm\:border-round-bottom{border-bottom-left-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.sm\:border-round-left-xs{border-top-left-radius:0.125rem !important;border-bottom-left-radius:0.125rem !important}.sm\:border-round-top-xs{border-top-left-radius:0.125rem !important;border-top-right-radius:0.125rem !important}.sm\:border-round-right-xs{border-top-right-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.sm\:border-round-bottom-xs{border-bottom-left-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.sm\:border-round-left-sm{border-top-left-radius:0.25rem !important;border-bottom-left-radius:0.25rem !important}.sm\:border-round-top-sm{border-top-left-radius:0.25rem !important;border-top-right-radius:0.25rem !important}.sm\:border-round-right-sm{border-top-right-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.sm\:border-round-bottom-sm{border-bottom-left-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.sm\:border-round-left-md{border-top-left-radius:0.375rem !important;border-bottom-left-radius:0.375rem !important}.sm\:border-round-top-md{border-top-left-radius:0.375rem !important;border-top-right-radius:0.375rem !important}.sm\:border-round-right-md{border-top-right-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.sm\:border-round-bottom-md{border-bottom-left-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.sm\:border-round-left-lg{border-top-left-radius:0.5rem !important;border-bottom-left-radius:0.5rem !important}.sm\:border-round-top-lg{border-top-left-radius:0.5rem !important;border-top-right-radius:0.5rem !important}.sm\:border-round-right-lg{border-top-right-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.sm\:border-round-bottom-lg{border-bottom-left-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.sm\:border-round-left-xl{border-top-left-radius:0.75rem !important;border-bottom-left-radius:0.75rem !important}.sm\:border-round-top-xl{border-top-left-radius:0.75rem !important;border-top-right-radius:0.75rem !important}.sm\:border-round-right-xl{border-top-right-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.sm\:border-round-bottom-xl{border-bottom-left-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.sm\:border-round-left-2xl{border-top-left-radius:1rem !important;border-bottom-left-radius:1rem !important}.sm\:border-round-top-2xl{border-top-left-radius:1rem !important;border-top-right-radius:1rem !important}.sm\:border-round-right-2xl{border-top-right-radius:1rem !important;border-bottom-right-radius:1rem !important}.sm\:border-round-bottom-2xl{border-bottom-left-radius:1rem !important;border-bottom-right-radius:1rem !important}.sm\:border-round-left-3xl{border-top-left-radius:1.5rem !important;border-bottom-left-radius:1.5rem !important}.sm\:border-round-top-3xl{border-top-left-radius:1.5rem !important;border-top-right-radius:1.5rem !important}.sm\:border-round-right-3xl{border-top-right-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.sm\:border-round-bottom-3xl{border-bottom-left-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.sm\:border-circle-left{border-top-left-radius:50% !important;border-bottom-left-radius:50% !important}.sm\:border-circle-top{border-top-left-radius:50% !important;border-top-right-radius:50% !important}.sm\:border-circle-right{border-top-right-radius:50% !important;border-bottom-right-radius:50% !important}.sm\:border-circle-bottom{border-bottom-left-radius:50% !important;border-bottom-right-radius:50% !important}}@media screen and (min-width: 768px){.md\:border-noround-left{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.md\:border-noround-top{border-top-left-radius:0 !important;border-top-right-radius:0 !important}.md\:border-noround-right{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.md\:border-noround-bottom{border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important}.md\:border-round-left{border-top-left-radius:var(--border-radius) !important;border-bottom-left-radius:var(--border-radius) !important}.md\:border-round-top{border-top-left-radius:var(--border-radius) !important;border-top-right-radius:var(--border-radius) !important}.md\:border-round-right{border-top-right-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.md\:border-round-bottom{border-bottom-left-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.md\:border-round-left-xs{border-top-left-radius:0.125rem !important;border-bottom-left-radius:0.125rem !important}.md\:border-round-top-xs{border-top-left-radius:0.125rem !important;border-top-right-radius:0.125rem !important}.md\:border-round-right-xs{border-top-right-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.md\:border-round-bottom-xs{border-bottom-left-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.md\:border-round-left-sm{border-top-left-radius:0.25rem !important;border-bottom-left-radius:0.25rem !important}.md\:border-round-top-sm{border-top-left-radius:0.25rem !important;border-top-right-radius:0.25rem !important}.md\:border-round-right-sm{border-top-right-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.md\:border-round-bottom-sm{border-bottom-left-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.md\:border-round-left-md{border-top-left-radius:0.375rem !important;border-bottom-left-radius:0.375rem !important}.md\:border-round-top-md{border-top-left-radius:0.375rem !important;border-top-right-radius:0.375rem !important}.md\:border-round-right-md{border-top-right-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.md\:border-round-bottom-md{border-bottom-left-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.md\:border-round-left-lg{border-top-left-radius:0.5rem !important;border-bottom-left-radius:0.5rem !important}.md\:border-round-top-lg{border-top-left-radius:0.5rem !important;border-top-right-radius:0.5rem !important}.md\:border-round-right-lg{border-top-right-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.md\:border-round-bottom-lg{border-bottom-left-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.md\:border-round-left-xl{border-top-left-radius:0.75rem !important;border-bottom-left-radius:0.75rem !important}.md\:border-round-top-xl{border-top-left-radius:0.75rem !important;border-top-right-radius:0.75rem !important}.md\:border-round-right-xl{border-top-right-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.md\:border-round-bottom-xl{border-bottom-left-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.md\:border-round-left-2xl{border-top-left-radius:1rem !important;border-bottom-left-radius:1rem !important}.md\:border-round-top-2xl{border-top-left-radius:1rem !important;border-top-right-radius:1rem !important}.md\:border-round-right-2xl{border-top-right-radius:1rem !important;border-bottom-right-radius:1rem !important}.md\:border-round-bottom-2xl{border-bottom-left-radius:1rem !important;border-bottom-right-radius:1rem !important}.md\:border-round-left-3xl{border-top-left-radius:1.5rem !important;border-bottom-left-radius:1.5rem !important}.md\:border-round-top-3xl{border-top-left-radius:1.5rem !important;border-top-right-radius:1.5rem !important}.md\:border-round-right-3xl{border-top-right-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.md\:border-round-bottom-3xl{border-bottom-left-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.md\:border-circle-left{border-top-left-radius:50% !important;border-bottom-left-radius:50% !important}.md\:border-circle-top{border-top-left-radius:50% !important;border-top-right-radius:50% !important}.md\:border-circle-right{border-top-right-radius:50% !important;border-bottom-right-radius:50% !important}.md\:border-circle-bottom{border-bottom-left-radius:50% !important;border-bottom-right-radius:50% !important}}@media screen and (min-width: 992px){.lg\:border-noround-left{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.lg\:border-noround-top{border-top-left-radius:0 !important;border-top-right-radius:0 !important}.lg\:border-noround-right{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.lg\:border-noround-bottom{border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important}.lg\:border-round-left{border-top-left-radius:var(--border-radius) !important;border-bottom-left-radius:var(--border-radius) !important}.lg\:border-round-top{border-top-left-radius:var(--border-radius) !important;border-top-right-radius:var(--border-radius) !important}.lg\:border-round-right{border-top-right-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.lg\:border-round-bottom{border-bottom-left-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.lg\:border-round-left-xs{border-top-left-radius:0.125rem !important;border-bottom-left-radius:0.125rem !important}.lg\:border-round-top-xs{border-top-left-radius:0.125rem !important;border-top-right-radius:0.125rem !important}.lg\:border-round-right-xs{border-top-right-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.lg\:border-round-bottom-xs{border-bottom-left-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.lg\:border-round-left-sm{border-top-left-radius:0.25rem !important;border-bottom-left-radius:0.25rem !important}.lg\:border-round-top-sm{border-top-left-radius:0.25rem !important;border-top-right-radius:0.25rem !important}.lg\:border-round-right-sm{border-top-right-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.lg\:border-round-bottom-sm{border-bottom-left-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.lg\:border-round-left-md{border-top-left-radius:0.375rem !important;border-bottom-left-radius:0.375rem !important}.lg\:border-round-top-md{border-top-left-radius:0.375rem !important;border-top-right-radius:0.375rem !important}.lg\:border-round-right-md{border-top-right-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.lg\:border-round-bottom-md{border-bottom-left-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.lg\:border-round-left-lg{border-top-left-radius:0.5rem !important;border-bottom-left-radius:0.5rem !important}.lg\:border-round-top-lg{border-top-left-radius:0.5rem !important;border-top-right-radius:0.5rem !important}.lg\:border-round-right-lg{border-top-right-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.lg\:border-round-bottom-lg{border-bottom-left-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.lg\:border-round-left-xl{border-top-left-radius:0.75rem !important;border-bottom-left-radius:0.75rem !important}.lg\:border-round-top-xl{border-top-left-radius:0.75rem !important;border-top-right-radius:0.75rem !important}.lg\:border-round-right-xl{border-top-right-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.lg\:border-round-bottom-xl{border-bottom-left-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.lg\:border-round-left-2xl{border-top-left-radius:1rem !important;border-bottom-left-radius:1rem !important}.lg\:border-round-top-2xl{border-top-left-radius:1rem !important;border-top-right-radius:1rem !important}.lg\:border-round-right-2xl{border-top-right-radius:1rem !important;border-bottom-right-radius:1rem !important}.lg\:border-round-bottom-2xl{border-bottom-left-radius:1rem !important;border-bottom-right-radius:1rem !important}.lg\:border-round-left-3xl{border-top-left-radius:1.5rem !important;border-bottom-left-radius:1.5rem !important}.lg\:border-round-top-3xl{border-top-left-radius:1.5rem !important;border-top-right-radius:1.5rem !important}.lg\:border-round-right-3xl{border-top-right-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.lg\:border-round-bottom-3xl{border-bottom-left-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.lg\:border-circle-left{border-top-left-radius:50% !important;border-bottom-left-radius:50% !important}.lg\:border-circle-top{border-top-left-radius:50% !important;border-top-right-radius:50% !important}.lg\:border-circle-right{border-top-right-radius:50% !important;border-bottom-right-radius:50% !important}.lg\:border-circle-bottom{border-bottom-left-radius:50% !important;border-bottom-right-radius:50% !important}}@media screen and (min-width: 1200px){.xl\:border-noround-left{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.xl\:border-noround-top{border-top-left-radius:0 !important;border-top-right-radius:0 !important}.xl\:border-noround-right{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.xl\:border-noround-bottom{border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important}.xl\:border-round-left{border-top-left-radius:var(--border-radius) !important;border-bottom-left-radius:var(--border-radius) !important}.xl\:border-round-top{border-top-left-radius:var(--border-radius) !important;border-top-right-radius:var(--border-radius) !important}.xl\:border-round-right{border-top-right-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.xl\:border-round-bottom{border-bottom-left-radius:var(--border-radius) !important;border-bottom-right-radius:var(--border-radius) !important}.xl\:border-round-left-xs{border-top-left-radius:0.125rem !important;border-bottom-left-radius:0.125rem !important}.xl\:border-round-top-xs{border-top-left-radius:0.125rem !important;border-top-right-radius:0.125rem !important}.xl\:border-round-right-xs{border-top-right-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.xl\:border-round-bottom-xs{border-bottom-left-radius:0.125rem !important;border-bottom-right-radius:0.125rem !important}.xl\:border-round-left-sm{border-top-left-radius:0.25rem !important;border-bottom-left-radius:0.25rem !important}.xl\:border-round-top-sm{border-top-left-radius:0.25rem !important;border-top-right-radius:0.25rem !important}.xl\:border-round-right-sm{border-top-right-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.xl\:border-round-bottom-sm{border-bottom-left-radius:0.25rem !important;border-bottom-right-radius:0.25rem !important}.xl\:border-round-left-md{border-top-left-radius:0.375rem !important;border-bottom-left-radius:0.375rem !important}.xl\:border-round-top-md{border-top-left-radius:0.375rem !important;border-top-right-radius:0.375rem !important}.xl\:border-round-right-md{border-top-right-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.xl\:border-round-bottom-md{border-bottom-left-radius:0.375rem !important;border-bottom-right-radius:0.375rem !important}.xl\:border-round-left-lg{border-top-left-radius:0.5rem !important;border-bottom-left-radius:0.5rem !important}.xl\:border-round-top-lg{border-top-left-radius:0.5rem !important;border-top-right-radius:0.5rem !important}.xl\:border-round-right-lg{border-top-right-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.xl\:border-round-bottom-lg{border-bottom-left-radius:0.5rem !important;border-bottom-right-radius:0.5rem !important}.xl\:border-round-left-xl{border-top-left-radius:0.75rem !important;border-bottom-left-radius:0.75rem !important}.xl\:border-round-top-xl{border-top-left-radius:0.75rem !important;border-top-right-radius:0.75rem !important}.xl\:border-round-right-xl{border-top-right-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.xl\:border-round-bottom-xl{border-bottom-left-radius:0.75rem !important;border-bottom-right-radius:0.75rem !important}.xl\:border-round-left-2xl{border-top-left-radius:1rem !important;border-bottom-left-radius:1rem !important}.xl\:border-round-top-2xl{border-top-left-radius:1rem !important;border-top-right-radius:1rem !important}.xl\:border-round-right-2xl{border-top-right-radius:1rem !important;border-bottom-right-radius:1rem !important}.xl\:border-round-bottom-2xl{border-bottom-left-radius:1rem !important;border-bottom-right-radius:1rem !important}.xl\:border-round-left-3xl{border-top-left-radius:1.5rem !important;border-bottom-left-radius:1.5rem !important}.xl\:border-round-top-3xl{border-top-left-radius:1.5rem !important;border-top-right-radius:1.5rem !important}.xl\:border-round-right-3xl{border-top-right-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.xl\:border-round-bottom-3xl{border-bottom-left-radius:1.5rem !important;border-bottom-right-radius:1.5rem !important}.xl\:border-circle-left{border-top-left-radius:50% !important;border-bottom-left-radius:50% !important}.xl\:border-circle-top{border-top-left-radius:50% !important;border-top-right-radius:50% !important}.xl\:border-circle-right{border-top-right-radius:50% !important;border-bottom-right-radius:50% !important}.xl\:border-circle-bottom{border-bottom-left-radius:50% !important;border-bottom-right-radius:50% !important}}.w-full{width:100% !important}.w-screen{width:100vw !important}.w-auto{width:auto !important}.w-1{width:8.3333% !important}.w-2{width:16.6667% !important}.w-3{width:25% !important}.w-4{width:33.3333% !important}.w-5{width:41.6667% !important}.w-6{width:50% !important}.w-7{width:58.3333% !important}.w-8{width:66.6667% !important}.w-9{width:75% !important}.w-10{width:83.3333% !important}.w-11{width:91.6667% !important}.w-12{width:100% !important}.w-min{width:min-content !important}.w-max{width:max-content !important}.w-fit{width:fit-content !important}.w-1rem{width:1rem !important}.w-2rem{width:2rem !important}.w-3rem{width:3rem !important}.w-4rem{width:4rem !important}.w-5rem{width:5rem !important}.w-6rem{width:6rem !important}.w-7rem{width:7rem !important}.w-8rem{width:8rem !important}.w-9rem{width:9rem !important}.w-10rem{width:10rem !important}.w-11rem{width:11rem !important}.w-12rem{width:12rem !important}.w-13rem{width:13rem !important}.w-14rem{width:14rem !important}.w-15rem{width:15rem !important}.w-16rem{width:16rem !important}.w-17rem{width:17rem !important}.w-18rem{width:18rem !important}.w-19rem{width:19rem !important}.w-20rem{width:20rem !important}.w-21rem{width:21rem !important}.w-22rem{width:22rem !important}.w-23rem{width:23rem !important}.w-24rem{width:24rem !important}.w-25rem{width:25rem !important}.w-26rem{width:26rem !important}.w-27rem{width:27rem !important}.w-28rem{width:28rem !important}.w-29rem{width:29rem !important}.w-30rem{width:30rem !important}@media screen and (min-width: 576px){.sm\:w-full{width:100% !important}.sm\:w-screen{width:100vw !important}.sm\:w-auto{width:auto !important}.sm\:w-1{width:8.3333% !important}.sm\:w-2{width:16.6667% !important}.sm\:w-3{width:25% !important}.sm\:w-4{width:33.3333% !important}.sm\:w-5{width:41.6667% !important}.sm\:w-6{width:50% !important}.sm\:w-7{width:58.3333% !important}.sm\:w-8{width:66.6667% !important}.sm\:w-9{width:75% !important}.sm\:w-10{width:83.3333% !important}.sm\:w-11{width:91.6667% !important}.sm\:w-12{width:100% !important}.sm\:w-min{width:min-content !important}.sm\:w-max{width:max-content !important}.sm\:w-fit{width:fit-content !important}.sm\:w-1rem{width:1rem !important}.sm\:w-2rem{width:2rem !important}.sm\:w-3rem{width:3rem !important}.sm\:w-4rem{width:4rem !important}.sm\:w-5rem{width:5rem !important}.sm\:w-6rem{width:6rem !important}.sm\:w-7rem{width:7rem !important}.sm\:w-8rem{width:8rem !important}.sm\:w-9rem{width:9rem !important}.sm\:w-10rem{width:10rem !important}.sm\:w-11rem{width:11rem !important}.sm\:w-12rem{width:12rem !important}.sm\:w-13rem{width:13rem !important}.sm\:w-14rem{width:14rem !important}.sm\:w-15rem{width:15rem !important}.sm\:w-16rem{width:16rem !important}.sm\:w-17rem{width:17rem !important}.sm\:w-18rem{width:18rem !important}.sm\:w-19rem{width:19rem !important}.sm\:w-20rem{width:20rem !important}.sm\:w-21rem{width:21rem !important}.sm\:w-22rem{width:22rem !important}.sm\:w-23rem{width:23rem !important}.sm\:w-24rem{width:24rem !important}.sm\:w-25rem{width:25rem !important}.sm\:w-26rem{width:26rem !important}.sm\:w-27rem{width:27rem !important}.sm\:w-28rem{width:28rem !important}.sm\:w-29rem{width:29rem !important}.sm\:w-30rem{width:30rem !important}}@media screen and (min-width: 768px){.md\:w-full{width:100% !important}.md\:w-screen{width:100vw !important}.md\:w-auto{width:auto !important}.md\:w-1{width:8.3333% !important}.md\:w-2{width:16.6667% !important}.md\:w-3{width:25% !important}.md\:w-4{width:33.3333% !important}.md\:w-5{width:41.6667% !important}.md\:w-6{width:50% !important}.md\:w-7{width:58.3333% !important}.md\:w-8{width:66.6667% !important}.md\:w-9{width:75% !important}.md\:w-10{width:83.3333% !important}.md\:w-11{width:91.6667% !important}.md\:w-12{width:100% !important}.md\:w-min{width:min-content !important}.md\:w-max{width:max-content !important}.md\:w-fit{width:fit-content !important}.md\:w-1rem{width:1rem !important}.md\:w-2rem{width:2rem !important}.md\:w-3rem{width:3rem !important}.md\:w-4rem{width:4rem !important}.md\:w-5rem{width:5rem !important}.md\:w-6rem{width:6rem !important}.md\:w-7rem{width:7rem !important}.md\:w-8rem{width:8rem !important}.md\:w-9rem{width:9rem !important}.md\:w-10rem{width:10rem !important}.md\:w-11rem{width:11rem !important}.md\:w-12rem{width:12rem !important}.md\:w-13rem{width:13rem !important}.md\:w-14rem{width:14rem !important}.md\:w-15rem{width:15rem !important}.md\:w-16rem{width:16rem !important}.md\:w-17rem{width:17rem !important}.md\:w-18rem{width:18rem !important}.md\:w-19rem{width:19rem !important}.md\:w-20rem{width:20rem !important}.md\:w-21rem{width:21rem !important}.md\:w-22rem{width:22rem !important}.md\:w-23rem{width:23rem !important}.md\:w-24rem{width:24rem !important}.md\:w-25rem{width:25rem !important}.md\:w-26rem{width:26rem !important}.md\:w-27rem{width:27rem !important}.md\:w-28rem{width:28rem !important}.md\:w-29rem{width:29rem !important}.md\:w-30rem{width:30rem !important}}@media screen and (min-width: 992px){.lg\:w-full{width:100% !important}.lg\:w-screen{width:100vw !important}.lg\:w-auto{width:auto !important}.lg\:w-1{width:8.3333% !important}.lg\:w-2{width:16.6667% !important}.lg\:w-3{width:25% !important}.lg\:w-4{width:33.3333% !important}.lg\:w-5{width:41.6667% !important}.lg\:w-6{width:50% !important}.lg\:w-7{width:58.3333% !important}.lg\:w-8{width:66.6667% !important}.lg\:w-9{width:75% !important}.lg\:w-10{width:83.3333% !important}.lg\:w-11{width:91.6667% !important}.lg\:w-12{width:100% !important}.lg\:w-min{width:min-content !important}.lg\:w-max{width:max-content !important}.lg\:w-fit{width:fit-content !important}.lg\:w-1rem{width:1rem !important}.lg\:w-2rem{width:2rem !important}.lg\:w-3rem{width:3rem !important}.lg\:w-4rem{width:4rem !important}.lg\:w-5rem{width:5rem !important}.lg\:w-6rem{width:6rem !important}.lg\:w-7rem{width:7rem !important}.lg\:w-8rem{width:8rem !important}.lg\:w-9rem{width:9rem !important}.lg\:w-10rem{width:10rem !important}.lg\:w-11rem{width:11rem !important}.lg\:w-12rem{width:12rem !important}.lg\:w-13rem{width:13rem !important}.lg\:w-14rem{width:14rem !important}.lg\:w-15rem{width:15rem !important}.lg\:w-16rem{width:16rem !important}.lg\:w-17rem{width:17rem !important}.lg\:w-18rem{width:18rem !important}.lg\:w-19rem{width:19rem !important}.lg\:w-20rem{width:20rem !important}.lg\:w-21rem{width:21rem !important}.lg\:w-22rem{width:22rem !important}.lg\:w-23rem{width:23rem !important}.lg\:w-24rem{width:24rem !important}.lg\:w-25rem{width:25rem !important}.lg\:w-26rem{width:26rem !important}.lg\:w-27rem{width:27rem !important}.lg\:w-28rem{width:28rem !important}.lg\:w-29rem{width:29rem !important}.lg\:w-30rem{width:30rem !important}}@media screen and (min-width: 1200px){.xl\:w-full{width:100% !important}.xl\:w-screen{width:100vw !important}.xl\:w-auto{width:auto !important}.xl\:w-1{width:8.3333% !important}.xl\:w-2{width:16.6667% !important}.xl\:w-3{width:25% !important}.xl\:w-4{width:33.3333% !important}.xl\:w-5{width:41.6667% !important}.xl\:w-6{width:50% !important}.xl\:w-7{width:58.3333% !important}.xl\:w-8{width:66.6667% !important}.xl\:w-9{width:75% !important}.xl\:w-10{width:83.3333% !important}.xl\:w-11{width:91.6667% !important}.xl\:w-12{width:100% !important}.xl\:w-min{width:min-content !important}.xl\:w-max{width:max-content !important}.xl\:w-fit{width:fit-content !important}.xl\:w-1rem{width:1rem !important}.xl\:w-2rem{width:2rem !important}.xl\:w-3rem{width:3rem !important}.xl\:w-4rem{width:4rem !important}.xl\:w-5rem{width:5rem !important}.xl\:w-6rem{width:6rem !important}.xl\:w-7rem{width:7rem !important}.xl\:w-8rem{width:8rem !important}.xl\:w-9rem{width:9rem !important}.xl\:w-10rem{width:10rem !important}.xl\:w-11rem{width:11rem !important}.xl\:w-12rem{width:12rem !important}.xl\:w-13rem{width:13rem !important}.xl\:w-14rem{width:14rem !important}.xl\:w-15rem{width:15rem !important}.xl\:w-16rem{width:16rem !important}.xl\:w-17rem{width:17rem !important}.xl\:w-18rem{width:18rem !important}.xl\:w-19rem{width:19rem !important}.xl\:w-20rem{width:20rem !important}.xl\:w-21rem{width:21rem !important}.xl\:w-22rem{width:22rem !important}.xl\:w-23rem{width:23rem !important}.xl\:w-24rem{width:24rem !important}.xl\:w-25rem{width:25rem !important}.xl\:w-26rem{width:26rem !important}.xl\:w-27rem{width:27rem !important}.xl\:w-28rem{width:28rem !important}.xl\:w-29rem{width:29rem !important}.xl\:w-30rem{width:30rem !important}}.h-full{height:100% !important}.h-screen{height:100vh !important}.h-auto{height:auto !important}.h-min{height:min-content !important}.h-max{height:max-content !important}.h-fit{height:fit-content !important}.h-1rem{height:1rem !important}.h-2rem{height:2rem !important}.h-3rem{height:3rem !important}.h-4rem{height:4rem !important}.h-5rem{height:5rem !important}.h-6rem{height:6rem !important}.h-7rem{height:7rem !important}.h-8rem{height:8rem !important}.h-9rem{height:9rem !important}.h-10rem{height:10rem !important}.h-11rem{height:11rem !important}.h-12rem{height:12rem !important}.h-13rem{height:13rem !important}.h-14rem{height:14rem !important}.h-15rem{height:15rem !important}.h-16rem{height:16rem !important}.h-17rem{height:17rem !important}.h-18rem{height:18rem !important}.h-19rem{height:19rem !important}.h-20rem{height:20rem !important}.h-21rem{height:21rem !important}.h-22rem{height:22rem !important}.h-23rem{height:23rem !important}.h-24rem{height:24rem !important}.h-25rem{height:25rem !important}.h-26rem{height:26rem !important}.h-27rem{height:27rem !important}.h-28rem{height:28rem !important}.h-29rem{height:29rem !important}.h-30rem{height:30rem !important}@media screen and (min-width: 576px){.sm\:h-full{height:100% !important}.sm\:h-screen{height:100vh !important}.sm\:h-auto{height:auto !important}.sm\:h-min{height:min-content !important}.sm\:h-max{height:max-content !important}.sm\:h-fit{height:fit-content !important}.sm\:h-1rem{height:1rem !important}.sm\:h-2rem{height:2rem !important}.sm\:h-3rem{height:3rem !important}.sm\:h-4rem{height:4rem !important}.sm\:h-5rem{height:5rem !important}.sm\:h-6rem{height:6rem !important}.sm\:h-7rem{height:7rem !important}.sm\:h-8rem{height:8rem !important}.sm\:h-9rem{height:9rem !important}.sm\:h-10rem{height:10rem !important}.sm\:h-11rem{height:11rem !important}.sm\:h-12rem{height:12rem !important}.sm\:h-13rem{height:13rem !important}.sm\:h-14rem{height:14rem !important}.sm\:h-15rem{height:15rem !important}.sm\:h-16rem{height:16rem !important}.sm\:h-17rem{height:17rem !important}.sm\:h-18rem{height:18rem !important}.sm\:h-19rem{height:19rem !important}.sm\:h-20rem{height:20rem !important}.sm\:h-21rem{height:21rem !important}.sm\:h-22rem{height:22rem !important}.sm\:h-23rem{height:23rem !important}.sm\:h-24rem{height:24rem !important}.sm\:h-25rem{height:25rem !important}.sm\:h-26rem{height:26rem !important}.sm\:h-27rem{height:27rem !important}.sm\:h-28rem{height:28rem !important}.sm\:h-29rem{height:29rem !important}.sm\:h-30rem{height:30rem !important}}@media screen and (min-width: 768px){.md\:h-full{height:100% !important}.md\:h-screen{height:100vh !important}.md\:h-auto{height:auto !important}.md\:h-min{height:min-content !important}.md\:h-max{height:max-content !important}.md\:h-fit{height:fit-content !important}.md\:h-1rem{height:1rem !important}.md\:h-2rem{height:2rem !important}.md\:h-3rem{height:3rem !important}.md\:h-4rem{height:4rem !important}.md\:h-5rem{height:5rem !important}.md\:h-6rem{height:6rem !important}.md\:h-7rem{height:7rem !important}.md\:h-8rem{height:8rem !important}.md\:h-9rem{height:9rem !important}.md\:h-10rem{height:10rem !important}.md\:h-11rem{height:11rem !important}.md\:h-12rem{height:12rem !important}.md\:h-13rem{height:13rem !important}.md\:h-14rem{height:14rem !important}.md\:h-15rem{height:15rem !important}.md\:h-16rem{height:16rem !important}.md\:h-17rem{height:17rem !important}.md\:h-18rem{height:18rem !important}.md\:h-19rem{height:19rem !important}.md\:h-20rem{height:20rem !important}.md\:h-21rem{height:21rem !important}.md\:h-22rem{height:22rem !important}.md\:h-23rem{height:23rem !important}.md\:h-24rem{height:24rem !important}.md\:h-25rem{height:25rem !important}.md\:h-26rem{height:26rem !important}.md\:h-27rem{height:27rem !important}.md\:h-28rem{height:28rem !important}.md\:h-29rem{height:29rem !important}.md\:h-30rem{height:30rem !important}}@media screen and (min-width: 992px){.lg\:h-full{height:100% !important}.lg\:h-screen{height:100vh !important}.lg\:h-auto{height:auto !important}.lg\:h-min{height:min-content !important}.lg\:h-max{height:max-content !important}.lg\:h-fit{height:fit-content !important}.lg\:h-1rem{height:1rem !important}.lg\:h-2rem{height:2rem !important}.lg\:h-3rem{height:3rem !important}.lg\:h-4rem{height:4rem !important}.lg\:h-5rem{height:5rem !important}.lg\:h-6rem{height:6rem !important}.lg\:h-7rem{height:7rem !important}.lg\:h-8rem{height:8rem !important}.lg\:h-9rem{height:9rem !important}.lg\:h-10rem{height:10rem !important}.lg\:h-11rem{height:11rem !important}.lg\:h-12rem{height:12rem !important}.lg\:h-13rem{height:13rem !important}.lg\:h-14rem{height:14rem !important}.lg\:h-15rem{height:15rem !important}.lg\:h-16rem{height:16rem !important}.lg\:h-17rem{height:17rem !important}.lg\:h-18rem{height:18rem !important}.lg\:h-19rem{height:19rem !important}.lg\:h-20rem{height:20rem !important}.lg\:h-21rem{height:21rem !important}.lg\:h-22rem{height:22rem !important}.lg\:h-23rem{height:23rem !important}.lg\:h-24rem{height:24rem !important}.lg\:h-25rem{height:25rem !important}.lg\:h-26rem{height:26rem !important}.lg\:h-27rem{height:27rem !important}.lg\:h-28rem{height:28rem !important}.lg\:h-29rem{height:29rem !important}.lg\:h-30rem{height:30rem !important}}@media screen and (min-width: 1200px){.xl\:h-full{height:100% !important}.xl\:h-screen{height:100vh !important}.xl\:h-auto{height:auto !important}.xl\:h-min{height:min-content !important}.xl\:h-max{height:max-content !important}.xl\:h-fit{height:fit-content !important}.xl\:h-1rem{height:1rem !important}.xl\:h-2rem{height:2rem !important}.xl\:h-3rem{height:3rem !important}.xl\:h-4rem{height:4rem !important}.xl\:h-5rem{height:5rem !important}.xl\:h-6rem{height:6rem !important}.xl\:h-7rem{height:7rem !important}.xl\:h-8rem{height:8rem !important}.xl\:h-9rem{height:9rem !important}.xl\:h-10rem{height:10rem !important}.xl\:h-11rem{height:11rem !important}.xl\:h-12rem{height:12rem !important}.xl\:h-13rem{height:13rem !important}.xl\:h-14rem{height:14rem !important}.xl\:h-15rem{height:15rem !important}.xl\:h-16rem{height:16rem !important}.xl\:h-17rem{height:17rem !important}.xl\:h-18rem{height:18rem !important}.xl\:h-19rem{height:19rem !important}.xl\:h-20rem{height:20rem !important}.xl\:h-21rem{height:21rem !important}.xl\:h-22rem{height:22rem !important}.xl\:h-23rem{height:23rem !important}.xl\:h-24rem{height:24rem !important}.xl\:h-25rem{height:25rem !important}.xl\:h-26rem{height:26rem !important}.xl\:h-27rem{height:27rem !important}.xl\:h-28rem{height:28rem !important}.xl\:h-29rem{height:29rem !important}.xl\:h-30rem{height:30rem !important}}.min-w-0{min-width:0px !important}.min-w-full{min-width:100% !important}.min-w-screen{min-width:100vw !important}.min-w-min{min-width:min-content !important}.min-w-max{min-width:max-content !important}@media screen and (min-width: 576px){.sm\:min-w-0{min-width:0px !important}.sm\:min-w-full{min-width:100% !important}.sm\:min-w-screen{min-width:100vw !important}.sm\:min-w-min{min-width:min-content !important}.sm\:min-w-max{min-width:max-content !important}}@media screen and (min-width: 768px){.md\:min-w-0{min-width:0px !important}.md\:min-w-full{min-width:100% !important}.md\:min-w-screen{min-width:100vw !important}.md\:min-w-min{min-width:min-content !important}.md\:min-w-max{min-width:max-content !important}}@media screen and (min-width: 992px){.lg\:min-w-0{min-width:0px !important}.lg\:min-w-full{min-width:100% !important}.lg\:min-w-screen{min-width:100vw !important}.lg\:min-w-min{min-width:min-content !important}.lg\:min-w-max{min-width:max-content !important}}@media screen and (min-width: 1200px){.xl\:min-w-0{min-width:0px !important}.xl\:min-w-full{min-width:100% !important}.xl\:min-w-screen{min-width:100vw !important}.xl\:min-w-min{min-width:min-content !important}.xl\:min-w-max{min-width:max-content !important}}.max-w-0{max-width:0px !important}.max-w-full{max-width:100% !important}.max-w-screen{max-width:100vw !important}.max-w-min{max-width:min-content !important}.max-w-max{max-width:max-content !important}.max-w-fit{max-width:fit-content !important}.max-w-1rem{max-width:1rem !important}.max-w-2rem{max-width:2rem !important}.max-w-3rem{max-width:3rem !important}.max-w-4rem{max-width:4rem !important}.max-w-5rem{max-width:5rem !important}.max-w-6rem{max-width:6rem !important}.max-w-7rem{max-width:7rem !important}.max-w-8rem{max-width:8rem !important}.max-w-9rem{max-width:9rem !important}.max-w-10rem{max-width:10rem !important}.max-w-11rem{max-width:11rem !important}.max-w-12rem{max-width:12rem !important}.max-w-13rem{max-width:13rem !important}.max-w-14rem{max-width:14rem !important}.max-w-15rem{max-width:15rem !important}.max-w-16rem{max-width:16rem !important}.max-w-17rem{max-width:17rem !important}.max-w-18rem{max-width:18rem !important}.max-w-19rem{max-width:19rem !important}.max-w-20rem{max-width:20rem !important}.max-w-21rem{max-width:21rem !important}.max-w-22rem{max-width:22rem !important}.max-w-23rem{max-width:23rem !important}.max-w-24rem{max-width:24rem !important}.max-w-25rem{max-width:25rem !important}.max-w-26rem{max-width:26rem !important}.max-w-27rem{max-width:27rem !important}.max-w-28rem{max-width:28rem !important}.max-w-29rem{max-width:29rem !important}.max-w-30rem{max-width:30rem !important}@media screen and (min-width: 576px){.sm\:max-w-0{max-width:0px !important}.sm\:max-w-full{max-width:100% !important}.sm\:max-w-screen{max-width:100vw !important}.sm\:max-w-min{max-width:min-content !important}.sm\:max-w-max{max-width:max-content !important}.sm\:max-w-fit{max-width:fit-content !important}.sm\:max-w-1rem{max-width:1rem !important}.sm\:max-w-2rem{max-width:2rem !important}.sm\:max-w-3rem{max-width:3rem !important}.sm\:max-w-4rem{max-width:4rem !important}.sm\:max-w-5rem{max-width:5rem !important}.sm\:max-w-6rem{max-width:6rem !important}.sm\:max-w-7rem{max-width:7rem !important}.sm\:max-w-8rem{max-width:8rem !important}.sm\:max-w-9rem{max-width:9rem !important}.sm\:max-w-10rem{max-width:10rem !important}.sm\:max-w-11rem{max-width:11rem !important}.sm\:max-w-12rem{max-width:12rem !important}.sm\:max-w-13rem{max-width:13rem !important}.sm\:max-w-14rem{max-width:14rem !important}.sm\:max-w-15rem{max-width:15rem !important}.sm\:max-w-16rem{max-width:16rem !important}.sm\:max-w-17rem{max-width:17rem !important}.sm\:max-w-18rem{max-width:18rem !important}.sm\:max-w-19rem{max-width:19rem !important}.sm\:max-w-20rem{max-width:20rem !important}.sm\:max-w-21rem{max-width:21rem !important}.sm\:max-w-22rem{max-width:22rem !important}.sm\:max-w-23rem{max-width:23rem !important}.sm\:max-w-24rem{max-width:24rem !important}.sm\:max-w-25rem{max-width:25rem !important}.sm\:max-w-26rem{max-width:26rem !important}.sm\:max-w-27rem{max-width:27rem !important}.sm\:max-w-28rem{max-width:28rem !important}.sm\:max-w-29rem{max-width:29rem !important}.sm\:max-w-30rem{max-width:30rem !important}}@media screen and (min-width: 768px){.md\:max-w-0{max-width:0px !important}.md\:max-w-full{max-width:100% !important}.md\:max-w-screen{max-width:100vw !important}.md\:max-w-min{max-width:min-content !important}.md\:max-w-max{max-width:max-content !important}.md\:max-w-fit{max-width:fit-content !important}.md\:max-w-1rem{max-width:1rem !important}.md\:max-w-2rem{max-width:2rem !important}.md\:max-w-3rem{max-width:3rem !important}.md\:max-w-4rem{max-width:4rem !important}.md\:max-w-5rem{max-width:5rem !important}.md\:max-w-6rem{max-width:6rem !important}.md\:max-w-7rem{max-width:7rem !important}.md\:max-w-8rem{max-width:8rem !important}.md\:max-w-9rem{max-width:9rem !important}.md\:max-w-10rem{max-width:10rem !important}.md\:max-w-11rem{max-width:11rem !important}.md\:max-w-12rem{max-width:12rem !important}.md\:max-w-13rem{max-width:13rem !important}.md\:max-w-14rem{max-width:14rem !important}.md\:max-w-15rem{max-width:15rem !important}.md\:max-w-16rem{max-width:16rem !important}.md\:max-w-17rem{max-width:17rem !important}.md\:max-w-18rem{max-width:18rem !important}.md\:max-w-19rem{max-width:19rem !important}.md\:max-w-20rem{max-width:20rem !important}.md\:max-w-21rem{max-width:21rem !important}.md\:max-w-22rem{max-width:22rem !important}.md\:max-w-23rem{max-width:23rem !important}.md\:max-w-24rem{max-width:24rem !important}.md\:max-w-25rem{max-width:25rem !important}.md\:max-w-26rem{max-width:26rem !important}.md\:max-w-27rem{max-width:27rem !important}.md\:max-w-28rem{max-width:28rem !important}.md\:max-w-29rem{max-width:29rem !important}.md\:max-w-30rem{max-width:30rem !important}}@media screen and (min-width: 992px){.lg\:max-w-0{max-width:0px !important}.lg\:max-w-full{max-width:100% !important}.lg\:max-w-screen{max-width:100vw !important}.lg\:max-w-min{max-width:min-content !important}.lg\:max-w-max{max-width:max-content !important}.lg\:max-w-fit{max-width:fit-content !important}.lg\:max-w-1rem{max-width:1rem !important}.lg\:max-w-2rem{max-width:2rem !important}.lg\:max-w-3rem{max-width:3rem !important}.lg\:max-w-4rem{max-width:4rem !important}.lg\:max-w-5rem{max-width:5rem !important}.lg\:max-w-6rem{max-width:6rem !important}.lg\:max-w-7rem{max-width:7rem !important}.lg\:max-w-8rem{max-width:8rem !important}.lg\:max-w-9rem{max-width:9rem !important}.lg\:max-w-10rem{max-width:10rem !important}.lg\:max-w-11rem{max-width:11rem !important}.lg\:max-w-12rem{max-width:12rem !important}.lg\:max-w-13rem{max-width:13rem !important}.lg\:max-w-14rem{max-width:14rem !important}.lg\:max-w-15rem{max-width:15rem !important}.lg\:max-w-16rem{max-width:16rem !important}.lg\:max-w-17rem{max-width:17rem !important}.lg\:max-w-18rem{max-width:18rem !important}.lg\:max-w-19rem{max-width:19rem !important}.lg\:max-w-20rem{max-width:20rem !important}.lg\:max-w-21rem{max-width:21rem !important}.lg\:max-w-22rem{max-width:22rem !important}.lg\:max-w-23rem{max-width:23rem !important}.lg\:max-w-24rem{max-width:24rem !important}.lg\:max-w-25rem{max-width:25rem !important}.lg\:max-w-26rem{max-width:26rem !important}.lg\:max-w-27rem{max-width:27rem !important}.lg\:max-w-28rem{max-width:28rem !important}.lg\:max-w-29rem{max-width:29rem !important}.lg\:max-w-30rem{max-width:30rem !important}}@media screen and (min-width: 1200px){.xl\:max-w-0{max-width:0px !important}.xl\:max-w-full{max-width:100% !important}.xl\:max-w-screen{max-width:100vw !important}.xl\:max-w-min{max-width:min-content !important}.xl\:max-w-max{max-width:max-content !important}.xl\:max-w-fit{max-width:fit-content !important}.xl\:max-w-1rem{max-width:1rem !important}.xl\:max-w-2rem{max-width:2rem !important}.xl\:max-w-3rem{max-width:3rem !important}.xl\:max-w-4rem{max-width:4rem !important}.xl\:max-w-5rem{max-width:5rem !important}.xl\:max-w-6rem{max-width:6rem !important}.xl\:max-w-7rem{max-width:7rem !important}.xl\:max-w-8rem{max-width:8rem !important}.xl\:max-w-9rem{max-width:9rem !important}.xl\:max-w-10rem{max-width:10rem !important}.xl\:max-w-11rem{max-width:11rem !important}.xl\:max-w-12rem{max-width:12rem !important}.xl\:max-w-13rem{max-width:13rem !important}.xl\:max-w-14rem{max-width:14rem !important}.xl\:max-w-15rem{max-width:15rem !important}.xl\:max-w-16rem{max-width:16rem !important}.xl\:max-w-17rem{max-width:17rem !important}.xl\:max-w-18rem{max-width:18rem !important}.xl\:max-w-19rem{max-width:19rem !important}.xl\:max-w-20rem{max-width:20rem !important}.xl\:max-w-21rem{max-width:21rem !important}.xl\:max-w-22rem{max-width:22rem !important}.xl\:max-w-23rem{max-width:23rem !important}.xl\:max-w-24rem{max-width:24rem !important}.xl\:max-w-25rem{max-width:25rem !important}.xl\:max-w-26rem{max-width:26rem !important}.xl\:max-w-27rem{max-width:27rem !important}.xl\:max-w-28rem{max-width:28rem !important}.xl\:max-w-29rem{max-width:29rem !important}.xl\:max-w-30rem{max-width:30rem !important}}.min-h-0{min-height:0px !important}.min-h-full{min-height:100% !important}.min-h-screen{min-height:100vh !important}@media screen and (min-width: 576px){.sm\:min-h-0{min-height:0px !important}.sm\:min-h-full{min-height:100% !important}.sm\:min-h-screen{min-height:100vh !important}}@media screen and (min-width: 768px){.md\:min-h-0{min-height:0px !important}.md\:min-h-full{min-height:100% !important}.md\:min-h-screen{min-height:100vh !important}}@media screen and (min-width: 992px){.lg\:min-h-0{min-height:0px !important}.lg\:min-h-full{min-height:100% !important}.lg\:min-h-screen{min-height:100vh !important}}@media screen and (min-width: 1200px){.xl\:min-h-0{min-height:0px !important}.xl\:min-h-full{min-height:100% !important}.xl\:min-h-screen{min-height:100vh !important}}.max-h-0{max-height:0px !important}.max-h-full{max-height:100% !important}.max-h-screen{max-height:100vh !important}.max-h-min{max-height:min-content !important}.max-h-max{max-height:max-content !important}.max-h-fit{max-height:fit-content !important}.max-h-1rem{max-height:1rem !important}.max-h-2rem{max-height:2rem !important}.max-h-3rem{max-height:3rem !important}.max-h-4rem{max-height:4rem !important}.max-h-5rem{max-height:5rem !important}.max-h-6rem{max-height:6rem !important}.max-h-7rem{max-height:7rem !important}.max-h-8rem{max-height:8rem !important}.max-h-9rem{max-height:9rem !important}.max-h-10rem{max-height:10rem !important}.max-h-11rem{max-height:11rem !important}.max-h-12rem{max-height:12rem !important}.max-h-13rem{max-height:13rem !important}.max-h-14rem{max-height:14rem !important}.max-h-15rem{max-height:15rem !important}.max-h-16rem{max-height:16rem !important}.max-h-17rem{max-height:17rem !important}.max-h-18rem{max-height:18rem !important}.max-h-19rem{max-height:19rem !important}.max-h-20rem{max-height:20rem !important}.max-h-21rem{max-height:21rem !important}.max-h-22rem{max-height:22rem !important}.max-h-23rem{max-height:23rem !important}.max-h-24rem{max-height:24rem !important}.max-h-25rem{max-height:25rem !important}.max-h-26rem{max-height:26rem !important}.max-h-27rem{max-height:27rem !important}.max-h-28rem{max-height:28rem !important}.max-h-29rem{max-height:29rem !important}.max-h-30rem{max-height:30rem !important}@media screen and (min-width: 576px){.sm\:max-h-0{max-height:0px !important}.sm\:max-h-full{max-height:100% !important}.sm\:max-h-screen{max-height:100vh !important}.sm\:max-h-min{max-height:min-content !important}.sm\:max-h-max{max-height:max-content !important}.sm\:max-h-fit{max-height:fit-content !important}.sm\:max-h-1rem{max-height:1rem !important}.sm\:max-h-2rem{max-height:2rem !important}.sm\:max-h-3rem{max-height:3rem !important}.sm\:max-h-4rem{max-height:4rem !important}.sm\:max-h-5rem{max-height:5rem !important}.sm\:max-h-6rem{max-height:6rem !important}.sm\:max-h-7rem{max-height:7rem !important}.sm\:max-h-8rem{max-height:8rem !important}.sm\:max-h-9rem{max-height:9rem !important}.sm\:max-h-10rem{max-height:10rem !important}.sm\:max-h-11rem{max-height:11rem !important}.sm\:max-h-12rem{max-height:12rem !important}.sm\:max-h-13rem{max-height:13rem !important}.sm\:max-h-14rem{max-height:14rem !important}.sm\:max-h-15rem{max-height:15rem !important}.sm\:max-h-16rem{max-height:16rem !important}.sm\:max-h-17rem{max-height:17rem !important}.sm\:max-h-18rem{max-height:18rem !important}.sm\:max-h-19rem{max-height:19rem !important}.sm\:max-h-20rem{max-height:20rem !important}.sm\:max-h-21rem{max-height:21rem !important}.sm\:max-h-22rem{max-height:22rem !important}.sm\:max-h-23rem{max-height:23rem !important}.sm\:max-h-24rem{max-height:24rem !important}.sm\:max-h-25rem{max-height:25rem !important}.sm\:max-h-26rem{max-height:26rem !important}.sm\:max-h-27rem{max-height:27rem !important}.sm\:max-h-28rem{max-height:28rem !important}.sm\:max-h-29rem{max-height:29rem !important}.sm\:max-h-30rem{max-height:30rem !important}}@media screen and (min-width: 768px){.md\:max-h-0{max-height:0px !important}.md\:max-h-full{max-height:100% !important}.md\:max-h-screen{max-height:100vh !important}.md\:max-h-min{max-height:min-content !important}.md\:max-h-max{max-height:max-content !important}.md\:max-h-fit{max-height:fit-content !important}.md\:max-h-1rem{max-height:1rem !important}.md\:max-h-2rem{max-height:2rem !important}.md\:max-h-3rem{max-height:3rem !important}.md\:max-h-4rem{max-height:4rem !important}.md\:max-h-5rem{max-height:5rem !important}.md\:max-h-6rem{max-height:6rem !important}.md\:max-h-7rem{max-height:7rem !important}.md\:max-h-8rem{max-height:8rem !important}.md\:max-h-9rem{max-height:9rem !important}.md\:max-h-10rem{max-height:10rem !important}.md\:max-h-11rem{max-height:11rem !important}.md\:max-h-12rem{max-height:12rem !important}.md\:max-h-13rem{max-height:13rem !important}.md\:max-h-14rem{max-height:14rem !important}.md\:max-h-15rem{max-height:15rem !important}.md\:max-h-16rem{max-height:16rem !important}.md\:max-h-17rem{max-height:17rem !important}.md\:max-h-18rem{max-height:18rem !important}.md\:max-h-19rem{max-height:19rem !important}.md\:max-h-20rem{max-height:20rem !important}.md\:max-h-21rem{max-height:21rem !important}.md\:max-h-22rem{max-height:22rem !important}.md\:max-h-23rem{max-height:23rem !important}.md\:max-h-24rem{max-height:24rem !important}.md\:max-h-25rem{max-height:25rem !important}.md\:max-h-26rem{max-height:26rem !important}.md\:max-h-27rem{max-height:27rem !important}.md\:max-h-28rem{max-height:28rem !important}.md\:max-h-29rem{max-height:29rem !important}.md\:max-h-30rem{max-height:30rem !important}}@media screen and (min-width: 992px){.lg\:max-h-0{max-height:0px !important}.lg\:max-h-full{max-height:100% !important}.lg\:max-h-screen{max-height:100vh !important}.lg\:max-h-min{max-height:min-content !important}.lg\:max-h-max{max-height:max-content !important}.lg\:max-h-fit{max-height:fit-content !important}.lg\:max-h-1rem{max-height:1rem !important}.lg\:max-h-2rem{max-height:2rem !important}.lg\:max-h-3rem{max-height:3rem !important}.lg\:max-h-4rem{max-height:4rem !important}.lg\:max-h-5rem{max-height:5rem !important}.lg\:max-h-6rem{max-height:6rem !important}.lg\:max-h-7rem{max-height:7rem !important}.lg\:max-h-8rem{max-height:8rem !important}.lg\:max-h-9rem{max-height:9rem !important}.lg\:max-h-10rem{max-height:10rem !important}.lg\:max-h-11rem{max-height:11rem !important}.lg\:max-h-12rem{max-height:12rem !important}.lg\:max-h-13rem{max-height:13rem !important}.lg\:max-h-14rem{max-height:14rem !important}.lg\:max-h-15rem{max-height:15rem !important}.lg\:max-h-16rem{max-height:16rem !important}.lg\:max-h-17rem{max-height:17rem !important}.lg\:max-h-18rem{max-height:18rem !important}.lg\:max-h-19rem{max-height:19rem !important}.lg\:max-h-20rem{max-height:20rem !important}.lg\:max-h-21rem{max-height:21rem !important}.lg\:max-h-22rem{max-height:22rem !important}.lg\:max-h-23rem{max-height:23rem !important}.lg\:max-h-24rem{max-height:24rem !important}.lg\:max-h-25rem{max-height:25rem !important}.lg\:max-h-26rem{max-height:26rem !important}.lg\:max-h-27rem{max-height:27rem !important}.lg\:max-h-28rem{max-height:28rem !important}.lg\:max-h-29rem{max-height:29rem !important}.lg\:max-h-30rem{max-height:30rem !important}}@media screen and (min-width: 1200px){.xl\:max-h-0{max-height:0px !important}.xl\:max-h-full{max-height:100% !important}.xl\:max-h-screen{max-height:100vh !important}.xl\:max-h-min{max-height:min-content !important}.xl\:max-h-max{max-height:max-content !important}.xl\:max-h-fit{max-height:fit-content !important}.xl\:max-h-1rem{max-height:1rem !important}.xl\:max-h-2rem{max-height:2rem !important}.xl\:max-h-3rem{max-height:3rem !important}.xl\:max-h-4rem{max-height:4rem !important}.xl\:max-h-5rem{max-height:5rem !important}.xl\:max-h-6rem{max-height:6rem !important}.xl\:max-h-7rem{max-height:7rem !important}.xl\:max-h-8rem{max-height:8rem !important}.xl\:max-h-9rem{max-height:9rem !important}.xl\:max-h-10rem{max-height:10rem !important}.xl\:max-h-11rem{max-height:11rem !important}.xl\:max-h-12rem{max-height:12rem !important}.xl\:max-h-13rem{max-height:13rem !important}.xl\:max-h-14rem{max-height:14rem !important}.xl\:max-h-15rem{max-height:15rem !important}.xl\:max-h-16rem{max-height:16rem !important}.xl\:max-h-17rem{max-height:17rem !important}.xl\:max-h-18rem{max-height:18rem !important}.xl\:max-h-19rem{max-height:19rem !important}.xl\:max-h-20rem{max-height:20rem !important}.xl\:max-h-21rem{max-height:21rem !important}.xl\:max-h-22rem{max-height:22rem !important}.xl\:max-h-23rem{max-height:23rem !important}.xl\:max-h-24rem{max-height:24rem !important}.xl\:max-h-25rem{max-height:25rem !important}.xl\:max-h-26rem{max-height:26rem !important}.xl\:max-h-27rem{max-height:27rem !important}.xl\:max-h-28rem{max-height:28rem !important}.xl\:max-h-29rem{max-height:29rem !important}.xl\:max-h-30rem{max-height:30rem !important}}.static{position:static !important}.fixed{position:fixed !important}.absolute{position:absolute !important}.relative{position:relative !important}.sticky{position:sticky !important}@media screen and (min-width: 576px){.sm\:static{position:static !important}.sm\:fixed{position:fixed !important}.sm\:absolute{position:absolute !important}.sm\:relative{position:relative !important}.sm\:sticky{position:sticky !important}}@media screen and (min-width: 768px){.md\:static{position:static !important}.md\:fixed{position:fixed !important}.md\:absolute{position:absolute !important}.md\:relative{position:relative !important}.md\:sticky{position:sticky !important}}@media screen and (min-width: 992px){.lg\:static{position:static !important}.lg\:fixed{position:fixed !important}.lg\:absolute{position:absolute !important}.lg\:relative{position:relative !important}.lg\:sticky{position:sticky !important}}@media screen and (min-width: 1200px){.xl\:static{position:static !important}.xl\:fixed{position:fixed !important}.xl\:absolute{position:absolute !important}.xl\:relative{position:relative !important}.xl\:sticky{position:sticky !important}}.top-auto{top:auto !important}.top-0{top:0px !important}.top-50{top:50% !important}.top-100{top:100% !important}@media screen and (min-width: 576px){.sm\:top-auto{top:auto !important}.sm\:top-0{top:0px !important}.sm\:top-50{top:50% !important}.sm\:top-100{top:100% !important}}@media screen and (min-width: 768px){.md\:top-auto{top:auto !important}.md\:top-0{top:0px !important}.md\:top-50{top:50% !important}.md\:top-100{top:100% !important}}@media screen and (min-width: 992px){.lg\:top-auto{top:auto !important}.lg\:top-0{top:0px !important}.lg\:top-50{top:50% !important}.lg\:top-100{top:100% !important}}@media screen and (min-width: 1200px){.xl\:top-auto{top:auto !important}.xl\:top-0{top:0px !important}.xl\:top-50{top:50% !important}.xl\:top-100{top:100% !important}}.left-auto{left:auto !important}.left-0{left:0px !important}.left-50{left:50% !important}.left-100{left:100% !important}@media screen and (min-width: 576px){.sm\:left-auto{left:auto !important}.sm\:left-0{left:0px !important}.sm\:left-50{left:50% !important}.sm\:left-100{left:100% !important}}@media screen and (min-width: 768px){.md\:left-auto{left:auto !important}.md\:left-0{left:0px !important}.md\:left-50{left:50% !important}.md\:left-100{left:100% !important}}@media screen and (min-width: 992px){.lg\:left-auto{left:auto !important}.lg\:left-0{left:0px !important}.lg\:left-50{left:50% !important}.lg\:left-100{left:100% !important}}@media screen and (min-width: 1200px){.xl\:left-auto{left:auto !important}.xl\:left-0{left:0px !important}.xl\:left-50{left:50% !important}.xl\:left-100{left:100% !important}}.right-auto{right:auto !important}.right-0{right:0px !important}.right-50{right:50% !important}.right-100{right:100% !important}@media screen and (min-width: 576px){.sm\:right-auto{right:auto !important}.sm\:right-0{right:0px !important}.sm\:right-50{right:50% !important}.sm\:right-100{right:100% !important}}@media screen and (min-width: 768px){.md\:right-auto{right:auto !important}.md\:right-0{right:0px !important}.md\:right-50{right:50% !important}.md\:right-100{right:100% !important}}@media screen and (min-width: 992px){.lg\:right-auto{right:auto !important}.lg\:right-0{right:0px !important}.lg\:right-50{right:50% !important}.lg\:right-100{right:100% !important}}@media screen and (min-width: 1200px){.xl\:right-auto{right:auto !important}.xl\:right-0{right:0px !important}.xl\:right-50{right:50% !important}.xl\:right-100{right:100% !important}}.bottom-auto{bottom:auto !important}.bottom-0{bottom:0px !important}.bottom-50{bottom:50% !important}.bottom-100{bottom:100% !important}@media screen and (min-width: 576px){.sm\:bottom-auto{bottom:auto !important}.sm\:bottom-0{bottom:0px !important}.sm\:bottom-50{bottom:50% !important}.sm\:bottom-100{bottom:100% !important}}@media screen and (min-width: 768px){.md\:bottom-auto{bottom:auto !important}.md\:bottom-0{bottom:0px !important}.md\:bottom-50{bottom:50% !important}.md\:bottom-100{bottom:100% !important}}@media screen and (min-width: 992px){.lg\:bottom-auto{bottom:auto !important}.lg\:bottom-0{bottom:0px !important}.lg\:bottom-50{bottom:50% !important}.lg\:bottom-100{bottom:100% !important}}@media screen and (min-width: 1200px){.xl\:bottom-auto{bottom:auto !important}.xl\:bottom-0{bottom:0px !important}.xl\:bottom-50{bottom:50% !important}.xl\:bottom-100{bottom:100% !important}}.overflow-auto{overflow:auto !important}.overflow-hidden{overflow:hidden !important}.overflow-visible{overflow:visible !important}.overflow-scroll{overflow:scroll !important}@media screen and (min-width: 576px){.sm\:overflow-auto{overflow:auto !important}.sm\:overflow-hidden{overflow:hidden !important}.sm\:overflow-visible{overflow:visible !important}.sm\:overflow-scroll{overflow:scroll !important}}@media screen and (min-width: 768px){.md\:overflow-auto{overflow:auto !important}.md\:overflow-hidden{overflow:hidden !important}.md\:overflow-visible{overflow:visible !important}.md\:overflow-scroll{overflow:scroll !important}}@media screen and (min-width: 992px){.lg\:overflow-auto{overflow:auto !important}.lg\:overflow-hidden{overflow:hidden !important}.lg\:overflow-visible{overflow:visible !important}.lg\:overflow-scroll{overflow:scroll !important}}@media screen and (min-width: 1200px){.xl\:overflow-auto{overflow:auto !important}.xl\:overflow-hidden{overflow:hidden !important}.xl\:overflow-visible{overflow:visible !important}.xl\:overflow-scroll{overflow:scroll !important}}.overflow-x-auto{overflow-x:auto !important}.overflow-x-hidden{overflow-x:hidden !important}.overflow-x-visible{overflow-x:visible !important}.overflow-x-scroll{overflow-x:scroll !important}@media screen and (min-width: 576px){.sm\:overflow-x-auto{overflow-x:auto !important}.sm\:overflow-x-hidden{overflow-x:hidden !important}.sm\:overflow-x-visible{overflow-x:visible !important}.sm\:overflow-x-scroll{overflow-x:scroll !important}}@media screen and (min-width: 768px){.md\:overflow-x-auto{overflow-x:auto !important}.md\:overflow-x-hidden{overflow-x:hidden !important}.md\:overflow-x-visible{overflow-x:visible !important}.md\:overflow-x-scroll{overflow-x:scroll !important}}@media screen and (min-width: 992px){.lg\:overflow-x-auto{overflow-x:auto !important}.lg\:overflow-x-hidden{overflow-x:hidden !important}.lg\:overflow-x-visible{overflow-x:visible !important}.lg\:overflow-x-scroll{overflow-x:scroll !important}}@media screen and (min-width: 1200px){.xl\:overflow-x-auto{overflow-x:auto !important}.xl\:overflow-x-hidden{overflow-x:hidden !important}.xl\:overflow-x-visible{overflow-x:visible !important}.xl\:overflow-x-scroll{overflow-x:scroll !important}}.overflow-y-auto{overflow-y:auto !important}.overflow-y-hidden{overflow-y:hidden !important}.overflow-y-visible{overflow-y:visible !important}.overflow-y-scroll{overflow-y:scroll !important}@media screen and (min-width: 576px){.sm\:overflow-y-auto{overflow-y:auto !important}.sm\:overflow-y-hidden{overflow-y:hidden !important}.sm\:overflow-y-visible{overflow-y:visible !important}.sm\:overflow-y-scroll{overflow-y:scroll !important}}@media screen and (min-width: 768px){.md\:overflow-y-auto{overflow-y:auto !important}.md\:overflow-y-hidden{overflow-y:hidden !important}.md\:overflow-y-visible{overflow-y:visible !important}.md\:overflow-y-scroll{overflow-y:scroll !important}}@media screen and (min-width: 992px){.lg\:overflow-y-auto{overflow-y:auto !important}.lg\:overflow-y-hidden{overflow-y:hidden !important}.lg\:overflow-y-visible{overflow-y:visible !important}.lg\:overflow-y-scroll{overflow-y:scroll !important}}@media screen and (min-width: 1200px){.xl\:overflow-y-auto{overflow-y:auto !important}.xl\:overflow-y-hidden{overflow-y:hidden !important}.xl\:overflow-y-visible{overflow-y:visible !important}.xl\:overflow-y-scroll{overflow-y:scroll !important}}.z-auto{z-index:auto !important}.z-0{z-index:0 !important}.z-1{z-index:1 !important}.z-2{z-index:2 !important}.z-3{z-index:3 !important}.z-4{z-index:4 !important}.z-5{z-index:5 !important}@media screen and (min-width: 576px){.sm\:z-auto{z-index:auto !important}.sm\:z-0{z-index:0 !important}.sm\:z-1{z-index:1 !important}.sm\:z-2{z-index:2 !important}.sm\:z-3{z-index:3 !important}.sm\:z-4{z-index:4 !important}.sm\:z-5{z-index:5 !important}}@media screen and (min-width: 768px){.md\:z-auto{z-index:auto !important}.md\:z-0{z-index:0 !important}.md\:z-1{z-index:1 !important}.md\:z-2{z-index:2 !important}.md\:z-3{z-index:3 !important}.md\:z-4{z-index:4 !important}.md\:z-5{z-index:5 !important}}@media screen and (min-width: 992px){.lg\:z-auto{z-index:auto !important}.lg\:z-0{z-index:0 !important}.lg\:z-1{z-index:1 !important}.lg\:z-2{z-index:2 !important}.lg\:z-3{z-index:3 !important}.lg\:z-4{z-index:4 !important}.lg\:z-5{z-index:5 !important}}@media screen and (min-width: 1200px){.xl\:z-auto{z-index:auto !important}.xl\:z-0{z-index:0 !important}.xl\:z-1{z-index:1 !important}.xl\:z-2{z-index:2 !important}.xl\:z-3{z-index:3 !important}.xl\:z-4{z-index:4 !important}.xl\:z-5{z-index:5 !important}}.bg-repeat{background-repeat:repeat !important}.bg-no-repeat{background-repeat:no-repeat !important}.bg-repeat-x{background-repeat:repeat-x !important}.bg-repeat-y{background-repeat:repeat-y !important}.bg-repeat-round{background-repeat:round !important}.bg-repeat-space{background-repeat:space !important}@media screen and (min-width: 576px){.sm\:bg-repeat{background-repeat:repeat !important}.sm\:bg-no-repeat{background-repeat:no-repeat !important}.sm\:bg-repeat-x{background-repeat:repeat-x !important}.sm\:bg-repeat-y{background-repeat:repeat-y !important}.sm\:bg-repeat-round{background-repeat:round !important}.sm\:bg-repeat-space{background-repeat:space !important}}@media screen and (min-width: 768px){.md\:bg-repeat{background-repeat:repeat !important}.md\:bg-no-repeat{background-repeat:no-repeat !important}.md\:bg-repeat-x{background-repeat:repeat-x !important}.md\:bg-repeat-y{background-repeat:repeat-y !important}.md\:bg-repeat-round{background-repeat:round !important}.md\:bg-repeat-space{background-repeat:space !important}}@media screen and (min-width: 992px){.lg\:bg-repeat{background-repeat:repeat !important}.lg\:bg-no-repeat{background-repeat:no-repeat !important}.lg\:bg-repeat-x{background-repeat:repeat-x !important}.lg\:bg-repeat-y{background-repeat:repeat-y !important}.lg\:bg-repeat-round{background-repeat:round !important}.lg\:bg-repeat-space{background-repeat:space !important}}@media screen and (min-width: 1200px){.xl\:bg-repeat{background-repeat:repeat !important}.xl\:bg-no-repeat{background-repeat:no-repeat !important}.xl\:bg-repeat-x{background-repeat:repeat-x !important}.xl\:bg-repeat-y{background-repeat:repeat-y !important}.xl\:bg-repeat-round{background-repeat:round !important}.xl\:bg-repeat-space{background-repeat:space !important}}.bg-auto{background-size:auto !important}.bg-cover{background-size:cover !important}.bg-contain{background-size:contain !important}@media screen and (min-width: 576px){.sm\:bg-auto{background-size:auto !important}.sm\:bg-cover{background-size:cover !important}.sm\:bg-contain{background-size:contain !important}}@media screen and (min-width: 768px){.md\:bg-auto{background-size:auto !important}.md\:bg-cover{background-size:cover !important}.md\:bg-contain{background-size:contain !important}}@media screen and (min-width: 992px){.lg\:bg-auto{background-size:auto !important}.lg\:bg-cover{background-size:cover !important}.lg\:bg-contain{background-size:contain !important}}@media screen and (min-width: 1200px){.xl\:bg-auto{background-size:auto !important}.xl\:bg-cover{background-size:cover !important}.xl\:bg-contain{background-size:contain !important}}.bg-bottom{background-position:bottom !important}.bg-center{background-position:center !important}.bg-left{background-position:left !important}.bg-left-bottom{background-position:left bottom !important}.bg-left-top{background-position:left top !important}.bg-right{background-position:right !important}.bg-right-bottom{background-position:right bottom !important}.bg-right-top{background-position:right top !important}.bg-top{background-position:top !important}@media screen and (min-width: 576px){.sm\:bg-bottom{background-position:bottom !important}.sm\:bg-center{background-position:center !important}.sm\:bg-left{background-position:left !important}.sm\:bg-left-bottom{background-position:left bottom !important}.sm\:bg-left-top{background-position:left top !important}.sm\:bg-right{background-position:right !important}.sm\:bg-right-bottom{background-position:right bottom !important}.sm\:bg-right-top{background-position:right top !important}.sm\:bg-top{background-position:top !important}}@media screen and (min-width: 768px){.md\:bg-bottom{background-position:bottom !important}.md\:bg-center{background-position:center !important}.md\:bg-left{background-position:left !important}.md\:bg-left-bottom{background-position:left bottom !important}.md\:bg-left-top{background-position:left top !important}.md\:bg-right{background-position:right !important}.md\:bg-right-bottom{background-position:right bottom !important}.md\:bg-right-top{background-position:right top !important}.md\:bg-top{background-position:top !important}}@media screen and (min-width: 992px){.lg\:bg-bottom{background-position:bottom !important}.lg\:bg-center{background-position:center !important}.lg\:bg-left{background-position:left !important}.lg\:bg-left-bottom{background-position:left bottom !important}.lg\:bg-left-top{background-position:left top !important}.lg\:bg-right{background-position:right !important}.lg\:bg-right-bottom{background-position:right bottom !important}.lg\:bg-right-top{background-position:right top !important}.lg\:bg-top{background-position:top !important}}@media screen and (min-width: 1200px){.xl\:bg-bottom{background-position:bottom !important}.xl\:bg-center{background-position:center !important}.xl\:bg-left{background-position:left !important}.xl\:bg-left-bottom{background-position:left bottom !important}.xl\:bg-left-top{background-position:left top !important}.xl\:bg-right{background-position:right !important}.xl\:bg-right-bottom{background-position:right bottom !important}.xl\:bg-right-top{background-position:right top !important}.xl\:bg-top{background-position:top !important}}.select-none{user-select:none !important}.select-text{user-select:text !important}.select-all{user-select:all !important}.select-auto{user-select:auto !important}.list-none{list-style:none !important}.list-disc{list-style:disc !important}.list-decimal{list-style:decimal !important}.appearance-none{appearance:none !important}.outline-none{outline:none !important}.pointer-events-none{pointer-events:none !important}.pointer-events-auto{pointer-events:auto !important}.cursor-auto{cursor:auto !important}.cursor-pointer{cursor:pointer !important}.cursor-wait{cursor:wait !important}.cursor-move{cursor:move !important}.select-none{user-select:none !important}.select-text{user-select:text !important}.select-all{user-select:all !important}.select-auto{user-select:auto !important}.opacity-0{opacity:0 !important}.opacity-10{opacity:.1 !important}.opacity-20{opacity:.2 !important}.opacity-30{opacity:.3 !important}.opacity-40{opacity:.4 !important}.opacity-50{opacity:.5 !important}.opacity-60{opacity:.6 !important}.opacity-70{opacity:.7 !important}.opacity-80{opacity:.8 !important}.opacity-90{opacity:.9 !important}.opacity-100{opacity:1 !important}.transition-none{transition-property:none !important}.transition-all{transition-property:all !important}.transition-colors{transition-property:background-color,border-color,color !important}.transition-transform{transition-property:transform !important}.transition-duration-100{transition-duration:100ms !important}.transition-duration-150{transition-duration:150ms !important}.transition-duration-200{transition-duration:200ms !important}.transition-duration-300{transition-duration:300ms !important}.transition-duration-400{transition-duration:400ms !important}.transition-duration-500{transition-duration:500ms !important}.transition-duration-1000{transition-duration:1000ms !important}.transition-duration-2000{transition-duration:2000ms !important}.transition-duration-3000{transition-duration:3000ms !important}.transition-linear{transition-timing-function:linear !important}.transition-ease-in{transition-timing-function:cubic-bezier(0.4, 0, 1, 1) !important}.transition-ease-out{transition-timing-function:cubic-bezier(0, 0, 0.2, 1) !important}.transition-ease-in-out{transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1) !important}.transition-delay-100{transition-delay:100ms !important}.transition-delay-150{transition-delay:150ms !important}.transition-delay-200{transition-delay:200ms !important}.transition-delay-300{transition-delay:300ms !important}.transition-delay-400{transition-delay:400ms !important}.transition-delay-500{transition-delay:500ms !important}.transition-delay-1000{transition-delay:1000ms !important}.translate-x-0{transform:translateX(0%) !important}.translate-x-100{transform:translateX(100%) !important}.-translate-x-100{transform:translateX(-100%) !important}.translate-y-0{transform:translateY(0%) !important}.translate-y-100{transform:translateY(100%) !important}.-translate-y-100{transform:translateY(-100%) !important}@media screen and (min-width: 576px){.sm\:translate-x-0{transform:translateX(0%) !important}.sm\:translate-x-100{transform:translateX(100%) !important}.sm\:-translate-x-100{transform:translateX(-100%) !important}.sm\:translate-y-0{transform:translateY(0%) !important}.sm\:translate-y-100{transform:translateY(100%) !important}.sm\:-translate-y-100{transform:translateY(-100%) !important}}@media screen and (min-width: 768px){.md\:translate-x-0{transform:translateX(0%) !important}.md\:translate-x-100{transform:translateX(100%) !important}.md\:-translate-x-100{transform:translateX(-100%) !important}.md\:translate-y-0{transform:translateY(0%) !important}.md\:translate-y-100{transform:translateY(100%) !important}.md\:-translate-y-100{transform:translateY(-100%) !important}}@media screen and (min-width: 992px){.lg\:translate-x-0{transform:translateX(0%) !important}.lg\:translate-x-100{transform:translateX(100%) !important}.lg\:-translate-x-100{transform:translateX(-100%) !important}.lg\:translate-y-0{transform:translateY(0%) !important}.lg\:translate-y-100{transform:translateY(100%) !important}.lg\:-translate-y-100{transform:translateY(-100%) !important}}@media screen and (min-width: 1200px){.xl\:translate-x-0{transform:translateX(0%) !important}.xl\:translate-x-100{transform:translateX(100%) !important}.xl\:-translate-x-100{transform:translateX(-100%) !important}.xl\:translate-y-0{transform:translateY(0%) !important}.xl\:translate-y-100{transform:translateY(100%) !important}.xl\:-translate-y-100{transform:translateY(-100%) !important}}.rotate-45{transform:rotate(45deg) !important}.-rotate-45{transform:rotate(-45deg) !important}.rotate-90{transform:rotate(90deg) !important}.-rotate-90{transform:rotate(-90deg) !important}.rotate-180{transform:rotate(180deg) !important}.-rotate-180{transform:rotate(-180deg) !important}@media screen and (min-width: 576px){.sm\:rotate-45{transform:rotate(45deg) !important}.sm\:-rotate-45{transform:rotate(-45deg) !important}.sm\:rotate-90{transform:rotate(90deg) !important}.sm\:-rotate-90{transform:rotate(-90deg) !important}.sm\:rotate-180{transform:rotate(180deg) !important}.sm\:-rotate-180{transform:rotate(-180deg) !important}}@media screen and (min-width: 768px){.md\:rotate-45{transform:rotate(45deg) !important}.md\:-rotate-45{transform:rotate(-45deg) !important}.md\:rotate-90{transform:rotate(90deg) !important}.md\:-rotate-90{transform:rotate(-90deg) !important}.md\:rotate-180{transform:rotate(180deg) !important}.md\:-rotate-180{transform:rotate(-180deg) !important}}@media screen and (min-width: 992px){.lg\:rotate-45{transform:rotate(45deg) !important}.lg\:-rotate-45{transform:rotate(-45deg) !important}.lg\:rotate-90{transform:rotate(90deg) !important}.lg\:-rotate-90{transform:rotate(-90deg) !important}.lg\:rotate-180{transform:rotate(180deg) !important}.lg\:-rotate-180{transform:rotate(-180deg) !important}}@media screen and (min-width: 1200px){.xl\:rotate-45{transform:rotate(45deg) !important}.xl\:-rotate-45{transform:rotate(-45deg) !important}.xl\:rotate-90{transform:rotate(90deg) !important}.xl\:-rotate-90{transform:rotate(-90deg) !important}.xl\:rotate-180{transform:rotate(180deg) !important}.xl\:-rotate-180{transform:rotate(-180deg) !important}}.origin-center{transform-origin:center !important}.origin-top{transform-origin:top !important}.origin-top-right{transform-origin:top right !important}.origin-right{transform-origin:right !important}.origin-bottom-right{transform-origin:bottom right !important}.origin-bottom{transform-origin:bottom !important}.origin-bottom-left{transform-origin:bottom left !important}.origin-left{transform-origin:left !important}.origin-top-left{transform-origin:top-left !important}@media screen and (min-width: 576px){.sm\:origin-center{transform-origin:center !important}.sm\:origin-top{transform-origin:top !important}.sm\:origin-top-right{transform-origin:top right !important}.sm\:origin-right{transform-origin:right !important}.sm\:origin-bottom-right{transform-origin:bottom right !important}.sm\:origin-bottom{transform-origin:bottom !important}.sm\:origin-bottom-left{transform-origin:bottom left !important}.sm\:origin-left{transform-origin:left !important}.sm\:origin-top-left{transform-origin:top-left !important}}@media screen and (min-width: 768px){.md\:origin-center{transform-origin:center !important}.md\:origin-top{transform-origin:top !important}.md\:origin-top-right{transform-origin:top right !important}.md\:origin-right{transform-origin:right !important}.md\:origin-bottom-right{transform-origin:bottom right !important}.md\:origin-bottom{transform-origin:bottom !important}.md\:origin-bottom-left{transform-origin:bottom left !important}.md\:origin-left{transform-origin:left !important}.md\:origin-top-left{transform-origin:top-left !important}}@media screen and (min-width: 992px){.lg\:origin-center{transform-origin:center !important}.lg\:origin-top{transform-origin:top !important}.lg\:origin-top-right{transform-origin:top right !important}.lg\:origin-right{transform-origin:right !important}.lg\:origin-bottom-right{transform-origin:bottom right !important}.lg\:origin-bottom{transform-origin:bottom !important}.lg\:origin-bottom-left{transform-origin:bottom left !important}.lg\:origin-left{transform-origin:left !important}.lg\:origin-top-left{transform-origin:top-left !important}}@media screen and (min-width: 1200px){.xl\:origin-center{transform-origin:center !important}.xl\:origin-top{transform-origin:top !important}.xl\:origin-top-right{transform-origin:top right !important}.xl\:origin-right{transform-origin:right !important}.xl\:origin-bottom-right{transform-origin:bottom right !important}.xl\:origin-bottom{transform-origin:bottom !important}.xl\:origin-bottom-left{transform-origin:bottom left !important}.xl\:origin-left{transform-origin:left !important}.xl\:origin-top-left{transform-origin:top-left !important}}@keyframes fadein{0%{opacity:0}100%{opacity:1}}@keyframes fadeout{0%{opacity:1}100%{opacity:0}}@keyframes scalein{0%{opacity:0;transform:scaleY(0.8);transition:transform .12s cubic-bezier(0, 0, 0.2, 1),opacity .12s cubic-bezier(0, 0, 0.2, 1)}100%{opacity:1;transform:scaleY(1)}}@keyframes slidedown{0%{max-height:0}100%{max-height:auto}}@keyframes slideup{0%{max-height:1000px}100%{max-height:0}}@keyframes fadeinleft{0%{opacity:0;transform:translateX(-100%);transition:transform .12s cubic-bezier(0, 0, 0.2, 1),opacity .12s cubic-bezier(0, 0, 0.2, 1)}100%{opacity:1;transform:translateX(0%)}}@keyframes fadeoutleft{0%{opacity:1;transform:translateX(0%);transition:transform .12s cubic-bezier(0, 0, 0.2, 1),opacity .12s cubic-bezier(0, 0, 0.2, 1)}100%{opacity:0;transform:translateX(-100%)}}@keyframes fadeinright{0%{opacity:0;transform:translateX(100%);transition:transform .12s cubic-bezier(0, 0, 0.2, 1),opacity .12s cubic-bezier(0, 0, 0.2, 1)}100%{opacity:1;transform:translateX(0%)}}@keyframes fadeoutright{0%{opacity:1;transform:translateX(0%);transition:transform .12s cubic-bezier(0, 0, 0.2, 1),opacity .12s cubic-bezier(0, 0, 0.2, 1)}100%{opacity:0;transform:translateX(100%)}}@keyframes fadeinup{0%{opacity:0;transform:translateY(-100%);transition:transform .12s cubic-bezier(0, 0, 0.2, 1),opacity .12s cubic-bezier(0, 0, 0.2, 1)}100%{opacity:1;transform:translateY(0%)}}@keyframes fadeoutup{0%{opacity:1;transform:translateY(0%);transition:transform .12s cubic-bezier(0, 0, 0.2, 1),opacity .12s cubic-bezier(0, 0, 0.2, 1)}100%{opacity:0;transform:translateY(-100%)}}@keyframes fadeindown{0%{opacity:0;transform:translateY(100%);transition:transform .12s cubic-bezier(0, 0, 0.2, 1),opacity .12s cubic-bezier(0, 0, 0.2, 1)}100%{opacity:1;transform:translateY(0%)}}@keyframes fadeoutdown{0%{opacity:1;transform:translateY(0%);transition:transform .12s cubic-bezier(0, 0, 0.2, 1),opacity .12s cubic-bezier(0, 0, 0.2, 1)}100%{opacity:0;transform:translateY(100%)}}@keyframes animate-width{0%{width:0}100%{width:100%}}.fadein{animation:fadein .15s linear}.fadeout{animation:fadeout .15s linear}.slidedown{animation:slidedown .45s ease-in-out}.slideup{animation:slideup .45s cubic-bezier(0, 1, 0, 1)}.scalein{animation:scalein .15s linear}.fadeinleft{animation:fadeinleft .15s linear}.fadeoutleft{animation:fadeoutleft .15s linear}.fadeinright{animation:fadeinright .15s linear}.fadeoutright{animation:fadeoutright .15s linear}.fadeinup{animation:fadeinup .15s linear}.fadeoutup{animation:fadeoutup .15s linear}.fadeindown{animation:fadeindown .15s linear}.fadeoutdown{animation:fadeoutdown .15s linear}.animate-width{animation:animate-width 1000ms linear}.animation-duration-100{animation-duration:100ms !important}.animation-duration-150{animation-duration:150ms !important}.animation-duration-200{animation-duration:200ms !important}.animation-duration-300{animation-duration:300ms !important}.animation-duration-400{animation-duration:400ms !important}.animation-duration-500{animation-duration:500ms !important}.animation-duration-1000{animation-duration:1000ms !important}.animation-duration-2000{animation-duration:2000ms !important}.animation-duration-3000{animation-duration:3000ms !important}.animation-delay-100{animation-delay:100ms !important}.animation-delay-150{animation-delay:150ms !important}.animation-delay-200{animation-delay:200ms !important}.animation-delay-300{animation-delay:300ms !important}.animation-delay-400{animation-delay:400ms !important}.animation-delay-500{animation-delay:500ms !important}.animation-delay-1000{animation-delay:1000ms !important}.animation-iteration-1{animation-iteration-count:1 !important}.animation-iteration-2{animation-iteration-count:2 !important}.animation-iteration-infinite{animation-iteration-count:infinite !important}.animation-linear{animation-timing-function:linear !important}.animation-ease-in{animation-timing-function:cubic-bezier(0.4, 0, 1, 1) !important}.animation-ease-out{animation-timing-function:cubic-bezier(0, 0, 0.2, 1) !important}.animation-ease-in-out{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1) !important}.animation-fill-none{animation-fill-mode:none !important}.animation-fill-forwards{animation-fill-mode:forwards !important}.animation-fill-backwards{animation-fill-mode:backwards !important}.animation-fill-both{animation-fill-mode:both !important} \ No newline at end of file diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/css/primeicons.css b/src/main/resources/META-INF/resources/resources/freya-layout/css/primeicons.css new file mode 100644 index 0000000..397a28e --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/css/primeicons.css @@ -0,0 +1,1017 @@ +@font-face { + font-family: 'primeicons'; + font-display: block; + src: url("#{resource['freya-layout:icons/primeicons.eot']}"); + src: url("#{resource['freya-layout:icons/primeicons.eot']}#iefix") format('embedded-opentype'), + url("#{resource['freya-layout:icons/primeicons.ttf']}") format('truetype'), + url("#{resource['freya-layout:icons/primeicons.woff']}") format('woff'), + url("#{resource['freya-layout:icons/primeicons.svg']}#primeicons") format('svg'); + font-weight: normal; + font-style: normal; +} + +.pi { + font-family: 'primeicons'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + display: inline-block; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.pi:before { + --webkit-backface-visibility:hidden; + backface-visibility: hidden; +} + +.pi-fw { + width: 1.28571429em; + text-align: center; +} + +.pi-spin { + -webkit-animation: fa-spin 2s infinite linear; + animation: fa-spin 2s infinite linear; +} + +@-webkit-keyframes fa-spin { + 0% { + -webkit-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(359deg); + transform: rotate(359deg); + } +} + +@keyframes fa-spin { + 0% { + -webkit-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(359deg); + transform: rotate(359deg); + } +} + +.pi-sort-alt-slash:before { + content: "\e9ee"; +} + +.pi-arrows-h:before { + content: "\e9ec"; +} + +.pi-arrows-v:before { + content: "\e9ed"; +} + +.pi-pound:before { + content: "\e9eb"; +} + +.pi-prime:before { + content: "\e9ea"; +} + +.pi-chart-pie:before { + content: "\e9e9"; +} + +.pi-reddit:before { + content: "\e9e8"; +} + +.pi-code:before { + content: "\e9e7"; +} + +.pi-sync:before { + content: "\e9e6"; +} + +.pi-shopping-bag:before { + content: "\e9e5"; +} + +.pi-server:before { + content: "\e9e4"; +} + +.pi-database:before { + content: "\e9e3"; +} + +.pi-hashtag:before { + content: "\e9e2"; +} + +.pi-bookmark-fill:before { + content: "\e9df"; +} + +.pi-filter-fill:before { + content: "\e9e0"; +} + +.pi-heart-fill:before { + content: "\e9e1"; +} + +.pi-flag-fill:before { + content: "\e9de"; +} + +.pi-circle:before { + content: "\e9dc"; +} + +.pi-circle-fill:before { + content: "\e9dd"; +} + +.pi-bolt:before { + content: "\e9db"; +} + +.pi-history:before { + content: "\e9da"; +} + +.pi-box:before { + content: "\e9d9"; +} + +.pi-at:before { + content: "\e9d8"; +} + +.pi-arrow-up-right:before { + content: "\e9d4"; +} + +.pi-arrow-up-left:before { + content: "\e9d5"; +} + +.pi-arrow-down-left:before { + content: "\e9d6"; +} + +.pi-arrow-down-right:before { + content: "\e9d7"; +} + +.pi-telegram:before { + content: "\e9d3"; +} + +.pi-stop-circle:before { + content: "\e9d2"; +} + +.pi-stop:before { + content: "\e9d1"; +} + +.pi-whatsapp:before { + content: "\e9d0"; +} + +.pi-building:before { + content: "\e9cf"; +} + +.pi-qrcode:before { + content: "\e9ce"; +} + +.pi-car:before { + content: "\e9cd"; +} + +.pi-instagram:before { + content: "\e9cc"; +} + +.pi-linkedin:before { + content: "\e9cb"; +} + +.pi-send:before { + content: "\e9ca"; +} + +.pi-slack:before { + content: "\e9c9"; +} + +.pi-sun:before { + content: "\e9c8"; +} + +.pi-moon:before { + content: "\e9c7"; +} + +.pi-vimeo:before { + content: "\e9c6"; +} + +.pi-youtube:before { + content: "\e9c5"; +} + +.pi-flag:before { + content: "\e9c4"; +} + +.pi-wallet:before { + content: "\e9c3"; +} + +.pi-map:before { + content: "\e9c2"; +} + +.pi-link:before { + content: "\e9c1"; +} + +.pi-credit-card:before { + content: "\e9bf"; +} + +.pi-discord:before { + content: "\e9c0"; +} + +.pi-percentage:before { + content: "\e9be"; +} + +.pi-euro:before { + content: "\e9bd"; +} + +.pi-book:before { + content: "\e9ba"; +} + +.pi-shield:before { + content: "\e9b9"; +} + +.pi-paypal:before { + content: "\e9bb"; +} + +.pi-amazon:before { + content: "\e9bc"; +} + +.pi-phone:before { + content: "\e9b8"; +} + +.pi-filter-slash:before { + content: "\e9b7"; +} + +.pi-facebook:before { + content: "\e9b4"; +} + +.pi-github:before { + content: "\e9b5"; +} + +.pi-twitter:before { + content: "\e9b6"; +} + +.pi-step-backward-alt:before { + content: "\e9ac"; +} + +.pi-step-forward-alt:before { + content: "\e9ad"; +} + +.pi-forward:before { + content: "\e9ae"; +} + +.pi-backward:before { + content: "\e9af"; +} + +.pi-fast-backward:before { + content: "\e9b0"; +} + +.pi-fast-forward:before { + content: "\e9b1"; +} + +.pi-pause:before { + content: "\e9b2"; +} + +.pi-play:before { + content: "\e9b3"; +} + +.pi-compass:before { + content: "\e9ab"; +} + +.pi-id-card:before { + content: "\e9aa"; +} + +.pi-ticket:before { + content: "\e9a9"; +} + +.pi-file-o:before { + content: "\e9a8"; +} + +.pi-reply:before { + content: "\e9a7"; +} + +.pi-directions-alt:before { + content: "\e9a5"; +} + +.pi-directions:before { + content: "\e9a6"; +} + +.pi-thumbs-up:before { + content: "\e9a3"; +} + +.pi-thumbs-down:before { + content: "\e9a4"; +} + +.pi-sort-numeric-down-alt:before { + content: "\e996"; +} + +.pi-sort-numeric-up-alt:before { + content: "\e997"; +} + +.pi-sort-alpha-down-alt:before { + content: "\e998"; +} + +.pi-sort-alpha-up-alt:before { + content: "\e999"; +} + +.pi-sort-numeric-down:before { + content: "\e99a"; +} + +.pi-sort-numeric-up:before { + content: "\e99b"; +} + +.pi-sort-alpha-down:before { + content: "\e99c"; +} + +.pi-sort-alpha-up:before { + content: "\e99d"; +} + +.pi-sort-alt:before { + content: "\e99e"; +} + +.pi-sort-amount-up:before { + content: "\e99f"; +} + +.pi-sort-amount-down:before { + content: "\e9a0"; +} + +.pi-sort-amount-down-alt:before { + content: "\e9a1"; +} + +.pi-sort-amount-up-alt:before { + content: "\e9a2"; +} + +.pi-palette:before { + content: "\e995"; +} + +.pi-undo:before { + content: "\e994"; +} + +.pi-desktop:before { + content: "\e993"; +} + +.pi-sliders-v:before { + content: "\e991"; +} + +.pi-sliders-h:before { + content: "\e992"; +} + +.pi-search-plus:before { + content: "\e98f"; +} + +.pi-search-minus:before { + content: "\e990"; +} + +.pi-file-excel:before { + content: "\e98e"; +} + +.pi-file-pdf:before { + content: "\e98d"; +} + +.pi-check-square:before { + content: "\e98c"; +} + +.pi-chart-line:before { + content: "\e98b"; +} + +.pi-user-edit:before { + content: "\e98a"; +} + +.pi-exclamation-circle:before { + content: "\e989"; +} + +.pi-android:before { + content: "\e985"; +} + +.pi-google:before { + content: "\e986"; +} + +.pi-apple:before { + content: "\e987"; +} + +.pi-microsoft:before { + content: "\e988"; +} + +.pi-heart:before { + content: "\e984"; +} + +.pi-mobile:before { + content: "\e982"; +} + +.pi-tablet:before { + content: "\e983"; +} + +.pi-key:before { + content: "\e981"; +} + +.pi-shopping-cart:before { + content: "\e980"; +} + +.pi-comments:before { + content: "\e97e"; +} + +.pi-comment:before { + content: "\e97f"; +} + +.pi-briefcase:before { + content: "\e97d"; +} + +.pi-bell:before { + content: "\e97c"; +} + +.pi-paperclip:before { + content: "\e97b"; +} + +.pi-share-alt:before { + content: "\e97a"; +} + +.pi-envelope:before { + content: "\e979"; +} + +.pi-volume-down:before { + content: "\e976"; +} + +.pi-volume-up:before { + content: "\e977"; +} + +.pi-volume-off:before { + content: "\e978"; +} + +.pi-eject:before { + content: "\e975"; +} + +.pi-money-bill:before { + content: "\e974"; +} + +.pi-images:before { + content: "\e973"; +} + +.pi-image:before { + content: "\e972"; +} + +.pi-sign-in:before { + content: "\e970"; +} + +.pi-sign-out:before { + content: "\e971"; +} + +.pi-wifi:before { + content: "\e96f"; +} + +.pi-sitemap:before { + content: "\e96e"; +} + +.pi-chart-bar:before { + content: "\e96d"; +} + +.pi-camera:before { + content: "\e96c"; +} + +.pi-dollar:before { + content: "\e96b"; +} + +.pi-lock-open:before { + content: "\e96a"; +} + +.pi-table:before { + content: "\e969"; +} + +.pi-map-marker:before { + content: "\e968"; +} + +.pi-list:before { + content: "\e967"; +} + +.pi-eye-slash:before { + content: "\e965"; +} + +.pi-eye:before { + content: "\e966"; +} + +.pi-folder-open:before { + content: "\e964"; +} + +.pi-folder:before { + content: "\e963"; +} + +.pi-video:before { + content: "\e962"; +} + +.pi-inbox:before { + content: "\e961"; +} + +.pi-lock:before { + content: "\e95f"; +} + +.pi-unlock:before { + content: "\e960"; +} + +.pi-tags:before { + content: "\e95d"; +} + +.pi-tag:before { + content: "\e95e"; +} + +.pi-power-off:before { + content: "\e95c"; +} + +.pi-save:before { + content: "\e95b"; +} + +.pi-question-circle:before { + content: "\e959"; +} + +.pi-question:before { + content: "\e95a"; +} + +.pi-copy:before { + content: "\e957"; +} + +.pi-file:before { + content: "\e958"; +} + +.pi-clone:before { + content: "\e955"; +} + +.pi-calendar-times:before { + content: "\e952"; +} + +.pi-calendar-minus:before { + content: "\e953"; +} + +.pi-calendar-plus:before { + content: "\e954"; +} + +.pi-ellipsis-v:before { + content: "\e950"; +} + +.pi-ellipsis-h:before { + content: "\e951"; +} + +.pi-bookmark:before { + content: "\e94e"; +} + +.pi-globe:before { + content: "\e94f"; +} + +.pi-replay:before { + content: "\e94d"; +} + +.pi-filter:before { + content: "\e94c"; +} + +.pi-print:before { + content: "\e94b"; +} + +.pi-align-right:before { + content: "\e946"; +} + +.pi-align-left:before { + content: "\e947"; +} + +.pi-align-center:before { + content: "\e948"; +} + +.pi-align-justify:before { + content: "\e949"; +} + +.pi-cog:before { + content: "\e94a"; +} + +.pi-cloud-download:before { + content: "\e943"; +} + +.pi-cloud-upload:before { + content: "\e944"; +} + +.pi-cloud:before { + content: "\e945"; +} + +.pi-pencil:before { + content: "\e942"; +} + +.pi-users:before { + content: "\e941"; +} + +.pi-clock:before { + content: "\e940"; +} + +.pi-user-minus:before { + content: "\e93e"; +} + +.pi-user-plus:before { + content: "\e93f"; +} + +.pi-trash:before { + content: "\e93d"; +} + +.pi-external-link:before { + content: "\e93c"; +} + +.pi-window-maximize:before { + content: "\e93b"; +} + +.pi-window-minimize:before { + content: "\e93a"; +} + +.pi-refresh:before { + content: "\e938"; +} + +.pi-user:before { + content: "\e939"; +} + +.pi-exclamation-triangle:before { + content: "\e922"; +} + +.pi-calendar:before { + content: "\e927"; +} + +.pi-chevron-circle-left:before { + content: "\e928"; +} + +.pi-chevron-circle-down:before { + content: "\e929"; +} + +.pi-chevron-circle-right:before { + content: "\e92a"; +} + +.pi-chevron-circle-up:before { + content: "\e92b"; +} + +.pi-angle-double-down:before { + content: "\e92c"; +} + +.pi-angle-double-left:before { + content: "\e92d"; +} + +.pi-angle-double-right:before { + content: "\e92e"; +} + +.pi-angle-double-up:before { + content: "\e92f"; +} + +.pi-angle-down:before { + content: "\e930"; +} + +.pi-angle-left:before { + content: "\e931"; +} + +.pi-angle-right:before { + content: "\e932"; +} + +.pi-angle-up:before { + content: "\e933"; +} + +.pi-upload:before { + content: "\e934"; +} + +.pi-download:before { + content: "\e956"; +} + +.pi-ban:before { + content: "\e935"; +} + +.pi-star-fill:before { + content: "\e936"; +} + +.pi-star:before { + content: "\e937"; +} + +.pi-chevron-left:before { + content: "\e900"; +} + +.pi-chevron-right:before { + content: "\e901"; +} + +.pi-chevron-down:before { + content: "\e902"; +} + +.pi-chevron-up:before { + content: "\e903"; +} + +.pi-caret-left:before { + content: "\e904"; +} + +.pi-caret-right:before { + content: "\e905"; +} + +.pi-caret-down:before { + content: "\e906"; +} + +.pi-caret-up:before { + content: "\e907"; +} + +.pi-search:before { + content: "\e908"; +} + +.pi-check:before { + content: "\e909"; +} + +.pi-check-circle:before { + content: "\e90a"; +} + +.pi-times:before { + content: "\e90b"; +} + +.pi-times-circle:before { + content: "\e90c"; +} + +.pi-plus:before { + content: "\e90d"; +} + +.pi-plus-circle:before { + content: "\e90e"; +} + +.pi-minus:before { + content: "\e90f"; +} + +.pi-minus-circle:before { + content: "\e910"; +} + +.pi-circle-on:before { + content: "\e911"; +} + +.pi-circle-off:before { + content: "\e912"; +} + +.pi-sort-down:before { + content: "\e913"; +} + +.pi-sort-up:before { + content: "\e914"; +} + +.pi-sort:before { + content: "\e915"; +} + +.pi-step-backward:before { + content: "\e916"; +} + +.pi-step-forward:before { + content: "\e917"; +} + +.pi-th-large:before { + content: "\e918"; +} + +.pi-arrow-down:before { + content: "\e919"; +} + +.pi-arrow-left:before { + content: "\e91a"; +} + +.pi-arrow-right:before { + content: "\e91b"; +} + +.pi-arrow-up:before { + content: "\e91c"; +} + +.pi-bars:before { + content: "\e91d"; +} + +.pi-arrow-circle-down:before { + content: "\e91e"; +} + +.pi-arrow-circle-left:before { + content: "\e91f"; +} + +.pi-arrow-circle-right:before { + content: "\e920"; +} + +.pi-arrow-circle-up:before { + content: "\e921"; +} + +.pi-info:before { + content: "\e923"; +} + +.pi-info-circle:before { + content: "\e924"; +} + +.pi-home:before { + content: "\e925"; +} + +.pi-spinner:before { + content: "\e926"; +} diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.eot b/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.eot new file mode 100644 index 0000000..24df115 Binary files /dev/null and b/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.eot differ diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.svg b/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.svg new file mode 100644 index 0000000..c4e81e7 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.svg @@ -0,0 +1,270 @@ + + + + + + +{ + "fontFamily": "primeicons", + "majorVersion": 1, + "minorVersion": 0, + "copyright": "PrimeTek Informatics", + "designer": "", + "description": "Icon Library for Prime UI Libraries\nFont generated by IcoMoon.", + "fontURL": "https://github.com/primefaces/primeicons", + "license": "MIT", + "licenseURL": "https://opensource.org/licenses/MIT", + "version": "Version 1.0", + "fontId": "primeicons", + "psName": "primeicons", + "subFamily": "Regular", + "fullName": "primeicons" +} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.ttf b/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.ttf new file mode 100644 index 0000000..f428079 Binary files /dev/null and b/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.ttf differ diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.woff b/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.woff new file mode 100644 index 0000000..3d976cf Binary files /dev/null and b/src/main/resources/META-INF/resources/resources/freya-layout/icons/primeicons.woff differ diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/avatar-profilemenu.png b/src/main/resources/META-INF/resources/resources/freya-layout/images/avatar-profilemenu.png new file mode 100644 index 0000000..3dc5771 Binary files /dev/null and b/src/main/resources/META-INF/resources/resources/freya-layout/images/avatar-profilemenu.png differ diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/favicon.ico b/src/main/resources/META-INF/resources/resources/freya-layout/images/favicon.ico new file mode 100644 index 0000000..f1a546f Binary files /dev/null and b/src/main/resources/META-INF/resources/resources/freya-layout/images/favicon.ico differ diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/logo-freya-single.svg b/src/main/resources/META-INF/resources/resources/freya-layout/images/logo-freya-single.svg new file mode 100644 index 0000000..025c4dd --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/images/logo-freya-single.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/logo-freya-white.svg b/src/main/resources/META-INF/resources/resources/freya-layout/images/logo-freya-white.svg new file mode 100644 index 0000000..d5be8c1 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/images/logo-freya-white.svg @@ -0,0 +1,14 @@ + + + logo-freya-white + + + + + + + + + + + \ No newline at end of file diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/logo-freya.svg b/src/main/resources/META-INF/resources/resources/freya-layout/images/logo-freya.svg new file mode 100644 index 0000000..9813483 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/images/logo-freya.svg @@ -0,0 +1,40 @@ + + + logo-freya + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-404.svg b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-404.svg new file mode 100644 index 0000000..3feeed6 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-404.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-access.svg b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-access.svg new file mode 100644 index 0000000..e1dfca1 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-access.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-error.svg b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-error.svg new file mode 100644 index 0000000..673f0f6 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-error.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-landing-header.jpg b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-landing-header.jpg new file mode 100644 index 0000000..bd7808a Binary files /dev/null and b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/asset-landing-header.jpg differ diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/search.png b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/search.png new file mode 100644 index 0000000..d4cf601 Binary files /dev/null and b/src/main/resources/META-INF/resources/resources/freya-layout/images/pages/search.png differ diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/js/layout.js b/src/main/resources/META-INF/resources/resources/freya-layout/js/layout.js new file mode 100644 index 0000000..b7c812e --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/js/layout.js @@ -0,0 +1,879 @@ +/** + * PrimeFaces Freya Layout + */ +PrimeFaces.widget.Freya = PrimeFaces.widget.BaseWidget.extend({ + + init: function(cfg) { + this._super(cfg); + this.wrapper = $(document.body).children('.layout-wrapper'); + var $this = this; + + $(function() { + $this._init(); + }); + + this.restoreMenuState(); + this.expandedMenuitems = this.expandedMenuitems||[]; + }, + + _init: function() { + this.contentWrapper = this.wrapper.children('.layout-main'); + this.topbar = this.wrapper.find('.layout-topbar'); + this.topbarItems = this.topbar.find('.layout-topbar-actions > li.topbar-item'); + this.topbarLinks = this.topbarItems.children('a'); + this.topbarSearchItemMenu = this.topbar.find('.search-item'); + + this.menuWrapper = this.wrapper.find('.menu-wrapper'); + this.sidebarPin = this.menuWrapper.find('.sidebar-logo > .sidebar-pin'); + this.menu = this.menuWrapper.find('.layout-menu'); + this.menuButton = this.topbar.find('.menu-button'); + this.menulinks = this.menu.find('a'); + + this.rightpanel = this.wrapper.find('.layout-rightpanel'); + this.rightpanelButton = this.topbar.find('.layout-rightpanel-button'); + this.rightpanelExitButton = this.rightpanel.find('.rightpanel-exit-button'); + + this.configButton = $('#layout-config-button'); + this.configurator = this.wrapper.children('.layout-config'); + + this.bindEvents(); + }, + + toggleClass: function(el, className) { + if (el.hasClass(className)) { + el.removeClass(className); + } + else { + el.addClass(className); + } + }, + + bindEvents: function() { + var $this = this; + + this.bindTopbarEvents(); + this.bindMenuEvents(); + this.bindRightPanelEvents(); + this.bindConfigEvents(); + + $(document.body).off('click.layoutBody').on('click.layoutBody', function() { + if (!$this.menuClick) { + $this.wrapper.removeClass('layout-sidebar-active layout-mobile-active'); + $(document.body).removeClass('blocked-scroll'); + + if ($this.isHorizontal() || $this.isSlim()) { + $this.menu.find('.active-menuitem').removeClass('active-menuitem'); + $this.menu.find('ul:visible').hide(); + $this.menuActive = false; + } + } + + if (!$this.topbarItemClicked) { + $this.removeTopbarClassFromAllItems(null, 'active-topmenuitem', $this.topbarItems.filter('.active-topmenuitem')); + } + + if (!$this.rightpanelClicked) { + $this.wrapper.removeClass('layout-rightpanel-active'); + } + + if (!$this.configClicked && $this.configurator.hasClass('layout-config-active')) { + $this.configurator.removeClass('layout-config-active'); + } + + $this.horizontalMenuClick = false; + $this.topbarItemClicked = false; + $this.rightpanelClicked = false; + $this.menuClick = false; + $this.configClicked = false; + }); + }, + + bindConfigEvents: function() { + var $this = this; + + this.configButton.off('click.configbutton').on('click.configbutton', function(e) { + $this.configurator.toggleClass('layout-config-active'); + $this.configClicked = true; + }); + + this.configurator.off('click.config').on('click.config', function() { + $this.configClicked = true; + }); + }, + + bindMenuEvents: function() { + var $this = this; + + this.menuButton.off('click.menu').on('click.menu', function(e) { + $this.menuClick = true; + + if ($this.isMobile()) { + if ($this.wrapper.hasClass('layout-mobile-active')) { + $this.wrapper.removeClass('layout-mobile-active'); + $(document.body).removeClass('blocked-scroll'); + } + else { + $this.wrapper.addClass('layout-mobile-active'); + $(document.body).addClass('blocked-scroll'); + } + } + + e.preventDefault(); + }); + + this.menuWrapper.off('click.menuWrapper mouseenter.menuWrapper mouseleave.menuWrapper') + .on('click.menuWrapper', function() { + $this.menuClick = true; + }) + .on('mouseenter.menuWrapper', function(e) { + if(!$this.wrapper.hasClass('layout-sidebar-static')) { + if($this.hideTimeout) { + clearTimeout($this.hideTimeout); + } + + $this.menuWrapper.addClass('layout-sidebar-active'); + } + if(!$this.wrapper.hasClass('layout-sidebar')) { + if($this.hideTimeout) { + clearTimeout($this.hideTimeout); + } + + $this.menuWrapper.removeClass('layout-sidebar-active'); + } + }) + .on('mouseleave.menuWrapper', function(e) { + if(!$this.wrapper.hasClass('layout-sidebar-static')) { + $this.hideTimeout = setTimeout(function() { + $this.menuWrapper.removeClass('layout-sidebar-active'); + }, $this.cfg.closeDelay); + } + }); + + this.sidebarPin.off('click.menuWrapper').on('click.menuWrapper', function(e) { + $this.wrapper.removeClass('layout-static-restore'); + $this.wrapper.toggleClass('layout-static'); + $this.saveMenuState(); + e.preventDefault(); + }); + + this.menulinks.off('click.menuWrapper').on('click.menuWrapper', function(e) { + var link = $(this), + item = link.parent(), + submenu = item.children('ul'); + horizontal = $this.isHorizontal(); + slim = $this.isSlim(); + $this.menuClick = true; + + if (horizontal) { + $this.horizontalMenuClick = true; + } + + if(item.hasClass('active-menuitem')) { + if(submenu.length) { + $this.removeMenuitem(item.attr('id')); + item.removeClass('active-menuitem'); + + if(horizontal || slim) { + if(item.parent().is($this.jq)) { + $this.menuActive = false; + } + + submenu.hide(); + $this.removeMenuitem(item.attr('id')); + item.removeClass('active-menuitem'); + } + else { + submenu.slideUp(function() { + $this.removeMenuitem(item.attr('id')); + item.removeClass('active-menuitem'); + }); + } + } + } + else { + $this.addMenuitem(item.attr('id')); + + if(horizontal || slim) { + $this.deactivateItems(item.siblings()); + item.addClass('active-menuitem'); + $this.menuActive = true; + submenu.show(); + } + else { + $this.deactivateItems(item.siblings(), true); + $this.activate(item); + } + } + + if(submenu.length) { + e.preventDefault(); + } + }); + + this.menu.find('> li').off('mouseenter.menu').on('mouseenter.menu', function(e) { + if ($this.isHorizontal() || $this.isSlim()) { + var item = $(this); + + if(!item.hasClass('active-menuitem')) { + $this.menu.find('.active-menuitem').removeClass('active-menuitem'); + $this.menu.find('ul:visible').hide(); + + if($this.menuActive) { + item.addClass('active-menuitem'); + item.children('ul').show(); + } + } + } + }); + }, + + bindTopbarEvents: function() { + var $this = this; + + this.topbarLinks.off('click.topbar').on('click.topbar', function(e) { + var link = $(this), + item = link.parent(), + submenu = item.children('ul'); + + if ($this.isMobile()) { + $this.removeTopbarClassFromAllItems(null, 'active-topmenuitem', $this.topbarItems.filter('.active-topmenuitem').not(item)); + } + else { + $this.removeTopbarClassFromAllItems(item, 'active-topmenuitem'); + } + $this.addTopbarClass(item, 'active-topmenuitem'); + + $this.topbarItemClicked = true; + + if (submenu.length) { + e.preventDefault(); + } + }); + + this.topbarSearchItemMenu.off('click.topbar').on('click.topbar', function(e) { + $this.topbarItemClicked = true; + }); + }, + + bindRightPanelEvents: function() { + var $this = this; + var changeRightpanelState = function(e) { + this.toggleClass(this.wrapper, 'layout-rightpanel-active'); + + this.rightpanelClicked = true; + e.preventDefault(); + }; + + this.rightpanelButton.off('click.rightpanel').on('click.rightpanel', changeRightpanelState.bind(this)); + this.rightpanelExitButton.off('click.rightpanel').on('click.rightpanel', changeRightpanelState.bind(this)); + + this.rightpanel.off('click.rightpanel').on('click.rightpanel', function() { + $this.rightpanelClicked = true; + }); + }, + + activate: function(item) { + var submenu = item.children('ul'); + item.addClass('active-menuitem'); + + if(submenu.length) { + submenu.slideDown(); + } + }, + + deactivate: function(item) { + var submenu = item.children('ul'); + item.removeClass('active-menuitem'); + + if(submenu.length) { + submenu.hide(); + } + }, + + deactivateItems: function(items, animate) { + var $this = this; + + for(var i = 0; i < items.length; i++) { + var item = items.eq(i), + submenu = item.children('ul'); + + if(submenu.length) { + if(item.hasClass('active-menuitem')) { + var activeSubItems = item.find('.active-menuitem'); + item.removeClass('active-menuitem'); + + if(animate) { + submenu.slideUp('normal', function() { + $(this).parent().find('.active-menuitem').each(function() { + $this.deactivate($(this)); + }); + }); + } + else { + item.find('.active-menuitem').each(function() { + $this.deactivate($(this)); + }); + } + + $this.removeMenuitem(item.attr('id')); + activeSubItems.each(function() { + $this.removeMenuitem($(this).attr('id')); + }); + } + else { + item.find('.active-menuitem').each(function() { + var subItem = $(this); + $this.deactivate(subItem); + $this.removeMenuitem(subItem.attr('id')); + }); + } + } + else if(item.hasClass('active-menuitem')) { + $this.deactivate(item); + $this.removeMenuitem(item.attr('id')); + } + } + }, + + removeMenuitem: function (id) { + this.expandedMenuitems = $.grep(this.expandedMenuitems, function (value) { + return value !== id; + }); + this.saveMenuState(); + }, + + addMenuitem: function (id) { + if ($.inArray(id, this.expandedMenuitems) === -1) { + this.expandedMenuitems.push(id); + } + this.saveMenuState(); + }, + + saveMenuState: function() { + if(this.wrapper.hasClass('layout-static')) + $.cookie('freya_menu_static', 'freya_menu_static', {path: '/'}); + else + $.removeCookie('freya_menu_static', {path: '/'}); + + $.cookie('freya_expandeditems', this.expandedMenuitems.join(','), {path: '/'}); + }, + + clearMenuState: function() { + this.expandedMenuitems = []; + $.removeCookie('freya_expandeditems', {path: '/'}); + $.removeCookie('freya_menu_static', {path: '/'}); + }, + + clearActiveItems: function() { + var activeItems = this.jq.find('li.active-menuitem'), + subContainers = activeItems.children('ul'); + + activeItems.removeClass('active-menuitem'); + if(subContainers && subContainers.length) { + subContainers.hide(); + } + }, + + clearLayoutState: function() { + this.clearMenuState(); + this.clearActiveItems(); + }, + + restoreMenuState: function() { + var menuCookie = $.cookie('freya_expandeditems'); + if (!this.isSlim() && !this.isHorizontal() && menuCookie) { + this.expandedMenuitems = menuCookie.split(','); + for (var i = 0; i < this.expandedMenuitems.length; i++) { + var id = this.expandedMenuitems[i]; + if (id) { + var menuitem = $("#" + this.expandedMenuitems[i].replace(/:/g, "\\:")); + menuitem.addClass('active-menuitem'); + + var submenu = menuitem.children('ul'); + if(submenu.length) { + submenu.show(); + } + } + } + } + + var sidebarCookie = $.cookie('freya_menu_static'); + if(sidebarCookie) { + this.wrapper.addClass('layout-static'); + } + + }, + + removeTopbarClassFromAllItems: function(item, className, items) { + var activeItems = item != null ? item.siblings('.' + className) : items; + + activeItems.removeClass(className); + activeItems.children('ul').removeClass('fadeInDown'); + }, + + addTopbarClass: function(item, className) { + var submenu = item.children('ul'); + + if (submenu.length) { + if (item.hasClass(className)) { + submenu.removeClass('fadeInDown').addClass('fadeOutUp'); + + setTimeout(function() { + item.removeClass(className); + submenu.removeClass('fadeOutUp'); + }, 100); + } + else { + item.addClass(className); + submenu.addClass('fadeInDown'); + } + } + }, + + hideTopBar: function() { + var $this = this; + this.topbarMenu.addClass('fadeOutUp'); + + setTimeout(function() { + $this.topbarMenu.removeClass('fadeOutUp topbar-menu-visible'); + },500); + }, + + isMobile: function() { + return window.innerWidth < 992; + }, + isHorizontal: function() { + return this.wrapper.hasClass('layout-horizontal') && !this.isMobile(); + }, + isSlim: function() { + return this.wrapper.hasClass('layout-slim') && !this.isMobile(); + }, + isStatic: function() { + return this.wrapper.hasClass('layout-static') && !this.isMobile(); + } +}); + +PrimeFaces.FreyaConfigurator = { + + changeLayout: function( componentTheme, darkMode ) { + this.changeLayoutsTheme(darkMode); + this.changeDemo(darkMode); + this.changeComponentsTheme(componentTheme, darkMode); + this.changeSectionTheme( darkMode, 'layout-menu'); + this.changeSectionTheme( darkMode , 'layout-topbar'); + }, + + changeLayoutsTheme: function(darkMode) { + newLayout = '-' + darkMode; + var linkElement = $('link[href*="layout-"]'); + var href = linkElement.attr('href'); + var startIndexOf = href.indexOf('layout-') + 6; + var endIndexOf = href.indexOf('.css'); + var currentColor = href.substring(startIndexOf, endIndexOf); + this.replaceLink(linkElement, href.replace(currentColor, newLayout)); + }, + + changeDemo: function(darkMode) { + newLayout = '-' + darkMode; + var linkElement = $('link[href*="demo-"]'); + var href = linkElement.attr('href'); + var startIndexOf = href.indexOf('demo-') + 4; + var endIndexOf = href.indexOf('.css'); + var currentColor = href.substring(startIndexOf, endIndexOf); + + this.replaceLink(linkElement, href.replace(currentColor, newLayout)); + }, + + changeComponentsTheme: function(themeColor, darkMode) { + theme = this.getColor(themeColor, darkMode); + var library = 'primefaces-freya'; + var linkElement = $('link[href*="theme.css"]'); + var href = linkElement.attr('href'); + var index = href.indexOf(library) + 1; + var currentTheme = href.substring(index + library.length); + + this.replaceLink(linkElement, href.replace(currentTheme, theme)); + }, + + changeSectionTheme: function(theme, section) { + var wrapperElement = $('.layout-wrapper'); + + var styleClass = wrapperElement.attr('class'); + var tokens = styleClass.split(' '); + var sectionClass; + for (var i = 0; i < tokens.length; i++) { + if (tokens[i].indexOf(section + '-') > -1) { + sectionClass = tokens[i]; + break; + } + } + + wrapperElement.attr('class', styleClass.replace(sectionClass, section + '-' + theme)); + }, + + changeMenuMode: function(menuMode) { + var wrapper = $(document.body).children('.layout-wrapper'); + switch (menuMode) { + case 'layout-sidebar': + wrapper.addClass('layout-sidebar').removeClass('layout-slim layout-horizontal '); + this.clearLayoutState(); + break; + + case 'layout-horizontal': + wrapper.addClass('layout-horizontal').removeClass('layout-static layout-slim layout-sidebar'); + this.clearLayoutState(); + break; + + case 'layout-slim': + wrapper.addClass('layout-slim').removeClass('layout-static layout-horizontal layout-sidebar'); + this.clearLayoutState(); + break; + + default: + wrapper.addClass('layout-sidebar').removeClass('layout-slim layout-horizontal '); + this.clearLayoutState(); + break; + } + }, + + beforeResourceChange: function() { + PrimeFaces.ajax.RESOURCE = null; //prevent resource append + }, + + replaceLink: function(linkElement, href) { + PrimeFaces.ajax.RESOURCE = 'javax.faces.Resource'; + + var isIE = this.isIE(); + + if (isIE) { + linkElement.attr('href', href); + } + else { + var cloneLinkElement = linkElement.clone(false); + + cloneLinkElement.attr('href', href); + linkElement.after(cloneLinkElement); + + cloneLinkElement.off('load').on('load', function() { + linkElement.remove(); + }); + + // for dashboard + setTimeout(function() { + if (window['redrawChart']) { + window.redrawChart(); + } + }, 100); + } + }, + + getColor: function(name, darkMode) { + return name + '-' + darkMode; + }, + + isIE: function() { + return /(MSIE|Trident\/|Edge\/)/i.test(navigator.userAgent); + }, + + clearLayoutState: function() { + var menu = PF('FreyaMenuWidget'); + + if (menu) { + menu.clearLayoutState(); + } + }, + + updateInputStyle: function(value) { + if (value === 'filled') + $(document.body).addClass('ui-input-filled'); + else + $(document.body).removeClass('ui-input-filled'); + } +}; + +/*! + * jQuery Cookie Plugin v1.4.1 + * https://github.com/carhartl/jquery-cookie + * + * Copyright 2006, 2014 Klaus Hartl + * Released under the MIT license + */ +(function (factory) { + if (typeof define === 'function' && define.amd) { + // AMD (Register as an anonymous module) + define(['jquery'], factory); + } else if (typeof exports === 'object') { + // Node/CommonJS + module.exports = factory(require('jquery')); + } else { + // Browser globals + factory(jQuery); + } +}(function ($) { + + var pluses = /\+/g; + + function encode(s) { + return config.raw ? s : encodeURIComponent(s); + } + + function decode(s) { + return config.raw ? s : decodeURIComponent(s); + } + + function stringifyCookieValue(value) { + return encode(config.json ? JSON.stringify(value) : String(value)); + } + + function parseCookieValue(s) { + if (s.indexOf('"') === 0) { + // This is a quoted cookie as according to RFC2068, unescape... + s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\'); + } + + try { + // Replace server-side written pluses with spaces. + // If we can't decode the cookie, ignore it, it's unusable. + // If we can't parse the cookie, ignore it, it's unusable. + s = decodeURIComponent(s.replace(pluses, ' ')); + return config.json ? JSON.parse(s) : s; + } catch (e) { } + } + + function read(s, converter) { + var value = config.raw ? s : parseCookieValue(s); + return $.isFunction(converter) ? converter(value) : value; + } + + var config = $.cookie = function (key, value, options) { + + // Write + + if (arguments.length > 1 && !$.isFunction(value)) { + options = $.extend({}, config.defaults, options); + + if (typeof options.expires === 'number') { + var days = options.expires, t = options.expires = new Date(); + t.setMilliseconds(t.getMilliseconds() + days * 864e+5); + } + + return (document.cookie = [ + encode(key), '=', stringifyCookieValue(value), + options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE + options.path ? '; path=' + options.path : '', + options.domain ? '; domain=' + options.domain : '', + options.secure ? '; secure' : '' + ].join('')); + } + + // Read + + var result = key ? undefined : {}, + // To prevent the for loop in the first place assign an empty array + // in case there are no cookies at all. Also prevents odd result when + // calling $.cookie(). + cookies = document.cookie ? document.cookie.split('; ') : [], + i = 0, + l = cookies.length; + + for (; i < l; i++) { + var parts = cookies[i].split('='), + name = decode(parts.shift()), + cookie = parts.join('='); + + if (key === name) { + // If second argument (value) is a function it's a converter... + result = read(cookie, value); + break; + } + + // Prevent storing a cookie that we couldn't decode. + if (!key && (cookie = read(cookie)) !== undefined) { + result[name] = cookie; + } + } + + return result; + }; + + config.defaults = {}; + + $.removeCookie = function (key, options) { + // Must not alter options, thus extending a fresh object... + $.cookie(key, '', $.extend({}, options, { expires: -1 })); + return !$.cookie(key); + }; + +})); + +if (PrimeFaces.widget.InputSwitch) { + PrimeFaces.widget.InputSwitch = PrimeFaces.widget.InputSwitch.extend({ + + init: function (cfg) { + this._super(cfg); + + if (this.input.prop('checked')) { + this.jq.addClass('ui-inputswitch-checked'); + } + }, + + check: function () { + var $this = this; + + this.input.prop('checked', true).trigger('change'); + setTimeout(function () { + $this.jq.addClass('ui-inputswitch-checked'); + }, 100); + }, + + uncheck: function () { + var $this = this; + + this.input.prop('checked', false).trigger('change'); + setTimeout(function () { + $this.jq.removeClass('ui-inputswitch-checked'); + }, 100); + } + }); +} + +if (PrimeFaces.widget.AccordionPanel) { + PrimeFaces.widget.AccordionPanel = PrimeFaces.widget.AccordionPanel.extend({ + + init: function (cfg) { + this._super(cfg); + + this.headers.last().addClass('ui-accordion-header-last'); + } + }); +} + +/* Issue #924 is fixed for 5.3+ and 6.0. (compatibility with 5.3) */ +if(window['PrimeFaces'] && window['PrimeFaces'].widget.Dialog) { + PrimeFaces.widget.Dialog = PrimeFaces.widget.Dialog.extend({ + + enableModality: function() { + this._super(); + $(document.body).children(this.jqId + '_modal').addClass('ui-dialog-mask'); + }, + + syncWindowResize: function() {} + }); +} + +if (PrimeFaces.widget.SelectOneMenu) { + PrimeFaces.widget.SelectOneMenu = PrimeFaces.widget.SelectOneMenu.extend({ + init: function (cfg) { + this._super(cfg); + + var $this = this; + if (this.jq.parent().hasClass('ui-float-label')) { + this.m_panel = $(this.jqId + '_panel'); + this.m_focusInput = $(this.jqId + '_focus'); + + this.m_panel.addClass('ui-input-overlay-panel'); + this.jq.addClass('ui-inputwrapper'); + + if (this.input.val() != '') { + this.jq.addClass('ui-inputwrapper-filled'); + } + + this.input.off('change').on('change', function () { + $this.inputValueControl($(this)); + }); + + this.m_focusInput.on('focus.ui-selectonemenu', function () { + $this.jq.addClass('ui-inputwrapper-focus'); + }) + .on('blur.ui-selectonemenu', function () { + $this.jq.removeClass('ui-inputwrapper-focus'); + }); + + if (this.cfg.editable) { + this.label.on('input', function (e) { + $this.inputValueControl($(this)); + }).on('focus', function () { + $this.jq.addClass('ui-inputwrapper-focus'); + }).on('blur', function () { + $this.jq.removeClass('ui-inputwrapper-focus'); + $this.inputValueControl($(this)); + }); + } + } + }, + + inputValueControl: function (input) { + if (input.val() != '') + this.jq.addClass('ui-inputwrapper-filled'); + else + this.jq.removeClass('ui-inputwrapper-filled'); + } + }); +} + +if (PrimeFaces.widget.Chips) { + PrimeFaces.widget.Chips = PrimeFaces.widget.Chips.extend({ + init: function (cfg) { + this._super(cfg); + + var $this = this; + if (this.jq.parent().hasClass('ui-float-label')) { + this.jq.addClass('ui-inputwrapper'); + + if ($this.jq.find('.ui-chips-token').length !== 0) { + this.jq.addClass('ui-inputwrapper-filled'); + } + + this.input.on('focus.ui-chips', function () { + $this.jq.addClass('ui-inputwrapper-focus'); + }).on('input.ui-chips', function () { + $this.inputValueControl(); + }).on('blur.ui-chips', function () { + $this.jq.removeClass('ui-inputwrapper-focus'); + $this.inputValueControl(); + }); + + } + }, + + inputValueControl: function () { + if (this.jq.find('.ui-chips-token').length !== 0 || this.input.val() != '') + this.jq.addClass('ui-inputwrapper-filled'); + else + this.jq.removeClass('ui-inputwrapper-filled'); + } + }); +} + +if (PrimeFaces.widget.DatePicker) { + PrimeFaces.widget.DatePicker = PrimeFaces.widget.DatePicker.extend({ + init: function (cfg) { + this._super(cfg); + + var $this = this; + if (this.jq.parent().hasClass('ui-float-label') && !this.cfg.inline) { + if (this.input.val() != '') { + this.jq.addClass('ui-inputwrapper-filled'); + } + + this.jqEl.off('focus.ui-datepicker blur.ui-datepicker change.ui-datepicker') + .on('focus.ui-datepicker', function () { + $this.jq.addClass('ui-inputwrapper-focus'); + }) + .on('blur.ui-datepicker', function () { + $this.jq.removeClass('ui-inputwrapper-focus'); + }) + .on('change.ui-datepicker', function () { + $this.inputValueControl($(this)); + }); + } + }, + + inputValueControl: function (input) { + if (input.val() != '') + this.jq.addClass('ui-inputwrapper-filled'); + else + this.jq.removeClass('ui-inputwrapper-filled'); + } + }); +} \ No newline at end of file diff --git a/src/main/resources/META-INF/resources/resources/freya-layout/js/prism.js b/src/main/resources/META-INF/resources/resources/freya-layout/js/prism.js new file mode 100644 index 0000000..4cbeb12 --- /dev/null +++ b/src/main/resources/META-INF/resources/resources/freya-layout/js/prism.js @@ -0,0 +1,10 @@ +/* PrismJS 1.22.0 +https://prismjs.com/download.html#themes=prism-coy&languages=markup+css+clike+javascript+bash+java&plugins=line-numbers */ +var _self="undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?self:{},Prism=function(u){var c=/\blang(?:uage)?-([\w-]+)\b/i,n=0,_={manual:u.Prism&&u.Prism.manual,disableWorkerMessageHandler:u.Prism&&u.Prism.disableWorkerMessageHandler,util:{encode:function e(n){return n instanceof M?new M(n.type,e(n.content),n.alias):Array.isArray(n)?n.map(e):n.replace(/&/g,"&").replace(/=l.reach);y+=m.value.length,m=m.next){var k=m.value;if(t.length>n.length)return;if(!(k instanceof M)){var b,x=1;if(h){if(!(b=W(p,y,n,f)))break;var w=b.index,A=b.index+b[0].length,P=y;for(P+=m.value.length;P<=w;)m=m.next,P+=m.value.length;if(P-=m.value.length,y=P,m.value instanceof M)continue;for(var S=m;S!==t.tail&&(Pl.reach&&(l.reach=N);var j=m.prev;O&&(j=z(t,j,O),y+=O.length),I(t,j,x);var C=new M(o,g?_.tokenize(E,g):E,d,E);m=z(t,j,C),L&&z(t,m,L),1"+a.content+""},!u.document)return u.addEventListener&&(_.disableWorkerMessageHandler||u.addEventListener("message",function(e){var n=JSON.parse(e.data),t=n.language,r=n.code,a=n.immediateClose;u.postMessage(_.highlight(r,_.languages[t],t)),a&&u.close()},!1)),_;var e=_.util.currentScript();function t(){_.manual||_.highlightAll()}if(e&&(_.filename=e.src,e.hasAttribute("data-manual")&&(_.manual=!0)),!_.manual){var r=document.readyState;"loading"===r||"interactive"===r&&e&&e.defer?document.addEventListener("DOMContentLoaded",t):window.requestAnimationFrame?window.requestAnimationFrame(t):window.setTimeout(t,16)}return _}(_self);"undefined"!=typeof module&&module.exports&&(module.exports=Prism),"undefined"!=typeof global&&(global.Prism=Prism); +Prism.languages.markup={comment://,prolog:/<\?[\s\S]+?\?>/,doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/,name:/[^\s<>'"]+/}},cdata://i,tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},Prism.languages.markup.tag.inside["attr-value"].inside.entity=Prism.languages.markup.entity,Prism.languages.markup.doctype.inside["internal-subset"].inside=Prism.languages.markup,Prism.hooks.add("wrap",function(a){"entity"===a.type&&(a.attributes.title=a.content.replace(/&/,"&"))}),Object.defineProperty(Prism.languages.markup.tag,"addInlined",{value:function(a,e){var s={};s["language-"+e]={pattern:/(^$)/i,lookbehind:!0,inside:Prism.languages[e]},s.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:s}};n["language-"+e]={pattern:/[\s\S]+/,inside:Prism.languages[e]};var t={};t[a]={pattern:RegExp("(<__[^>]*>)(?:))*\\]\\]>|(?!)".replace(/__/g,function(){return a}),"i"),lookbehind:!0,greedy:!0,inside:n},Prism.languages.insertBefore("markup","cdata",t)}}),Prism.languages.html=Prism.languages.markup,Prism.languages.mathml=Prism.languages.markup,Prism.languages.svg=Prism.languages.markup,Prism.languages.xml=Prism.languages.extend("markup",{}),Prism.languages.ssml=Prism.languages.xml,Prism.languages.atom=Prism.languages.xml,Prism.languages.rss=Prism.languages.xml; +!function(s){var e=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;s.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:/@[\w-](?:[^;{\s]|\s+(?![\s{]))*(?:;|(?=\s*\{))/,inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|(?:[^\\\\\r\n()\"']|\\\\[^])*)\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:RegExp("[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+e.source+")*(?=\\s*\\{)"),string:{pattern:e,greedy:!0},property:/(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,important:/!important\b/i,function:/[-a-z0-9]+(?=\()/i,punctuation:/[(){};:,]/},s.languages.css.atrule.inside.rest=s.languages.css;var t=s.languages.markup;t&&(t.tag.addInlined("style","css"),s.languages.insertBefore("inside","attr-value",{"style-attr":{pattern:/(^|["'\s])style\s*=\s*(?:"[^"]*"|'[^']*')/i,lookbehind:!0,inside:{"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{style:{pattern:/(["'])[\s\S]+(?=["']$)/,lookbehind:!0,alias:"language-css",inside:s.languages.css},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}},"attr-name":/^style/i}}},t.tag))}(Prism); +Prism.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|interface|extends|implements|trait|instanceof|new)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/,boolean:/\b(?:true|false)\b/,function:/\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/}; +Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:prototype|constructor))/,lookbehind:!0}],keyword:[{pattern:/((?:^|})\s*)(?:catch|finally)\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|for|from|function|(?:get|set)(?=\s*[\[$\w\xA0-\uFFFF])|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:/\b(?:(?:0[xX](?:[\dA-Fa-f](?:_[\dA-Fa-f])?)+|0[bB](?:[01](?:_[01])?)+|0[oO](?:[0-7](?:_[0-7])?)+)n?|(?:\d(?:_\d)?)+n|NaN|Infinity)\b|(?:\b(?:\d(?:_\d)?)+\.?(?:\d(?:_\d)?)*|\B\.(?:\d(?:_\d)?)+)(?:[Ee][+-]?(?:\d(?:_\d)?)+)?/,operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|interface|extends|implements|instanceof|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)\/(?:\[(?:[^\]\\\r\n]|\\.)*]|\\.|[^/\\\[\r\n])+\/[gimyus]{0,6}(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/,lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:Prism.languages.regex},"regex-flags":/[a-z]+$/,"regex-delimiter":/^\/|\/$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{"template-string":{pattern:/`(?:\\[\s\S]|\${(?:[^{}]|{(?:[^{}]|{[^}]*})*})+}|(?!\${)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\${(?:[^{}]|{(?:[^{}]|{[^}]*})*})+}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\${|}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}}}),Prism.languages.markup&&Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.js=Prism.languages.javascript; +!function(e){var t="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},a={bash:n,environment:{pattern:RegExp("\\$"+t),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--?|-=|\+\+?|\+=|!=?|~|\*\*?|\*=|\/=?|%=?|<<=?|>>=?|<=?|>=?|==?|&&?|&=|\^=?|\|\|?|\|=|\?|:/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+t),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|x[0-9a-fA-F]{1,2}|u[0-9a-fA-F]{4}|U[0-9a-fA-F]{8})/};e.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)\w+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b\w+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+t),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+?)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:a},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)(["'])(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|(?!\2)[^\\`$])*\2/,lookbehind:!0,greedy:!0,inside:a}],environment:{pattern:RegExp("\\$?"+t),alias:"constant"},variable:a.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|aptitude|apt-cache|apt-get|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:if|then|else|elif|fi|for|while|in|case|esac|function|select|do|done|until)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|break|cd|continue|eval|exec|exit|export|getopts|hash|pwd|readonly|return|shift|test|times|trap|umask|unset|alias|bind|builtin|caller|command|declare|echo|enable|help|let|local|logout|mapfile|printf|read|readarray|source|type|typeset|ulimit|unalias|set|shopt)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:true|false)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|==?|!=?|=~|<<[<-]?|[&\d]?>>|\d?[<>]&?|&[>&]?|\|[&|]?|<=?|>=?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=e.languages.bash;for(var s=["comment","function-name","for-or-select","assign-left","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],i=a.variable[1].inside,o=0;o>>?=?|->|--|\+\+|&&|\|\||::|[?:~]|[-+*/%&|^!=<>]=?)/m,lookbehind:!0}}),e.languages.insertBefore("java","string",{"triple-quoted-string":{pattern:/"""[ \t]*[\r\n](?:(?:"|"")?(?:\\.|[^"\\]))*"""/,greedy:!0,alias:"string"}}),e.languages.insertBefore("java","class-name",{annotation:{pattern:/(^|[^.])@\w+(?:\s*\.\s*\w+)*/,lookbehind:!0,alias:"punctuation"},generics:{pattern:/<(?:[\w\s,.&?]|<(?:[\w\s,.&?]|<(?:[\w\s,.&?]|<[\w\s,.&?]*>)*>)*>)*>/,inside:{"class-name":a,keyword:t,punctuation:/[<>(),.:]/,operator:/[?&|]/}},namespace:{pattern:RegExp("(\\b(?:exports|import(?:\\s+static)?|module|open|opens|package|provides|requires|to|transitive|uses|with)\\s+)(?!)[a-z]\\w*(?:\\.[a-z]\\w*)*\\.?".replace(//g,function(){return t.source})),lookbehind:!0,inside:{punctuation:/\./}}})}(Prism); +!function(){if("undefined"!=typeof self&&self.Prism&&self.document){var o="line-numbers",a=/\n(?!$)/g,e=Prism.plugins.lineNumbers={getLine:function(e,n){if("PRE"===e.tagName&&e.classList.contains(o)){var t=e.querySelector(".line-numbers-rows");if(t){var i=parseInt(e.getAttribute("data-start"),10)||1,r=i+(t.children.length-1);n");(i=document.createElement("span")).setAttribute("aria-hidden","true"),i.className="line-numbers-rows",i.innerHTML=l,t.hasAttribute("data-start")&&(t.style.counterReset="linenumber "+(parseInt(t.getAttribute("data-start"),10)-1)),e.element.appendChild(i),u([t]),Prism.hooks.run("line-numbers",e)}}}),Prism.hooks.add("line-numbers",function(e){e.plugins=e.plugins||{},e.plugins.lineNumbers=!0})}function u(e){if(0!=(e=e.filter(function(e){var n=t(e)["white-space"];return"pre-wrap"===n||"pre-line"===n})).length){var n=e.map(function(e){var n=e.querySelector("code"),t=e.querySelector(".line-numbers-rows");if(n&&t){var i=e.querySelector(".line-numbers-sizer"),r=n.textContent.split(a);i||((i=document.createElement("span")).className="line-numbers-sizer",n.appendChild(i)),i.innerHTML="0",i.style.display="block";var s=i.getBoundingClientRect().height;return i.innerHTML="",{element:e,lines:r,lineHeights:[],oneLinerHeight:s,sizer:i}}}).filter(Boolean);n.forEach(function(e){var i=e.sizer,n=e.lines,r=e.lineHeights,s=e.oneLinerHeight;r[n.length-1]=void 0,n.forEach(function(e,n){if(e&&1 + + + +``` + +#### 2. `user-form.xhtml` +**Description**: Formulaire complet pour créer/modifier un utilisateur + +**Paramètres principaux**: +- `user`: UserDTO (requis) +- `mode`: String (défaut: "create") - "create" ou "edit" +- `showRealmSelector`: Boolean (défaut: false) +- `showPasswordFields`: Boolean (défaut: true) +- `readonly`: Boolean (défaut: false) + +**Exemple**: +```xhtml + + + + + +``` + +#### 3. `user-search-bar.xhtml` +**Description**: Barre de recherche avancée pour utilisateurs + +**Paramètres principaux**: +- `searchCriteria`: UserSearchCriteriaDTO (requis) +- `searchAction`: String (requis) +- `showAdvanced`: Boolean (défaut: false) +- `showRealmFilter`: Boolean (défaut: true) +- `showStatusFilter`: Boolean (défaut: true) + +**Exemple**: +```xhtml + + + + + +``` + +#### 4. `user-actions.xhtml` +**Description**: Boutons d'action pour un utilisateur + +**Paramètres principaux**: +- `user`: UserDTO (requis) +- `showView`: Boolean (défaut: true) +- `showEdit`: Boolean (défaut: true) +- `showDelete`: Boolean (défaut: true) +- `showActivate`: Boolean (défaut: true) +- `layout`: String (défaut: "horizontal") - "horizontal", "vertical" ou "dropdown" + +**Exemple**: +```xhtml + + + + + +``` + +#### 5. `user-role-badge.xhtml` +**Description**: Badge pour un rôle utilisateur + +**Paramètres principaux**: +- `roleName`: String (requis) +- `roleType`: String (optionnel) - "REALM_ROLE", "CLIENT_ROLE", "COMPOSITE_ROLE" +- `severity`: String (optionnel) - "success", "info", "warning", "danger" +- `clickable`: Boolean (défaut: false) + +**Exemple**: +```xhtml + + + + +``` + +--- + +### 🛡️ Role Management (3 composants) + +#### 6. `role-card.xhtml` +**Description**: Carte rôle avec informations principales + +**Paramètres principaux**: +- `role`: RoleDTO (requis) +- `showActions`: Boolean (défaut: true) +- `showDescription`: Boolean (défaut: true) +- `showCompositeInfo`: Boolean (défaut: true) + +**Exemple**: +```xhtml + + + +``` + +#### 7. `role-form.xhtml` +**Description**: Formulaire pour créer/modifier un rôle + +**Paramètres principaux**: +- `role`: RoleDTO (requis) +- `mode`: String (défaut: "create") +- `showRealmSelector`: Boolean (défaut: true) +- `showClientSelector`: Boolean (défaut: false) +- `showCompositeOptions`: Boolean (défaut: true) + +**Exemple**: +```xhtml + + + + + +``` + +#### 8. `role-assignment.xhtml` +**Description**: Interface pour attribuer/révoquer des rôles + +**Paramètres principaux**: +- `user`: UserDTO (requis) +- `availableRoles`: List (requis) +- `userRoles`: List (requis) +- `assignAction`: String (requis) +- `revokeAction`: String (requis) + +**Exemple**: +```xhtml + + + + + + + +``` + +--- + +### 📊 Audit (2 composants) + +#### 9. `audit-log-row.xhtml` +**Description**: Ligne de log d'audit avec informations détaillées + +**Paramètres principaux**: +- `auditLog`: AuditLogDTO (requis) +- `showDetails`: Boolean (défaut: false) +- `showActions`: Boolean (défaut: false) +- `compact`: Boolean (défaut: false) + +**Exemple**: +```xhtml + + + + +``` + +#### 10. `audit-stats-card.xhtml` +**Description**: Carte statistiques d'audit + +**Paramètres principaux**: +- `title`: String (requis) +- `value`: Number (requis) +- `icon`: String (requis) +- `iconColor`: String (requis) +- `trend`: Number (optionnel) +- `trendLabel`: String (optionnel) + +**Exemple**: +```xhtml + + + + + + +``` + +--- + +### 🔧 Shared Components (4 composants) + +#### 11. `button-user-action.xhtml` +**Description**: Bouton générique pour actions utilisateur + +**Paramètres principaux**: +- `value`: String (requis) +- `icon`: String (optionnel) +- `action`: String (optionnel) +- `outcome`: String (optionnel) +- `severity`: String (défaut: "primary") +- `size`: String (défaut: "normal") + +**Exemple**: +```xhtml + + + + + +``` + +#### 12. `user-stat-card.xhtml` +**Description**: Carte statistique utilisateur + +**Paramètres principaux**: +- `title`: String (requis) +- `value`: String/Number (requis) +- `icon`: String (requis) +- `iconColor`: String (requis) +- `trend`: Number (optionnel) +- `clickable`: Boolean (défaut: false) + +**Exemple**: +```xhtml + + + + + + +``` + +#### 13. `user-form-field.xhtml` +**Description**: Champ de formulaire générique + +**Paramètres principaux**: +- `id`: String (requis) +- `label`: String (requis) +- `value`: Object (requis) +- `type`: String (défaut: "text") - "text", "email", "password", "number", "textarea", "select", "checkbox", "calendar" +- `required`: Boolean (défaut: false) +- `readonly`: Boolean (défaut: false) + +**Exemple**: +```xhtml + + + + + + +``` + +#### 14. `user-data-table.xhtml` +**Description**: Tableau de données pour utilisateurs + +**Paramètres principaux**: +- `users`: List (requis) +- `var`: String (défaut: "user") +- `paginator`: Boolean (défaut: true) +- `rows`: Number (défaut: 20) +- `showActions`: Boolean (défaut: true) +- `showRoles`: Boolean (défaut: true) +- `showSelection`: Boolean (défaut: false) + +**Exemple**: +```xhtml + + + + +``` + +--- + +## 🎨 Patterns et Conventions + +### Documentation Inline +Chaque composant contient une documentation complète en commentaire avec: +- Description du composant +- Liste des paramètres avec types et valeurs par défaut +- Exemples d'utilisation + +### Paramètres Optionnels +Tous les paramètres optionnels ont des valeurs par défaut définies avec ``. + +### Pattern WOU/DRY +- **Write Once Use**: Chaque composant est écrit une fois et réutilisé partout +- **Don't Repeat Yourself**: Pas de duplication de code + +### Naming Convention +- Noms de fichiers en `kebab-case` +- Paramètres en `camelCase` +- IDs de composants avec préfixe cohérent + +--- + +## 🚀 Utilisation dans d'Autres Projets + +Ces composants peuvent être utilisés dans n'importe quel projet de l'écosystème **lionsdev** en ajoutant la dépendance Maven: + +```xml + + dev.lions.user.manager + lions-user-manager-client-quarkus-primefaces-freya + 1.0.0 + +``` + +Puis inclure les composants dans vos pages XHTML: + +```xhtml + + + +``` + +--- + +## 📝 Notes Importantes + +1. **Dépendances**: Tous les composants nécessitent PrimeFaces 14.0.5+ et Quarkus PrimeFaces 3.13.3+ +2. **Thème**: Les composants utilisent le thème Freya (compatible avec unionflow) +3. **Validation**: Les composants de formulaire incluent la validation JSF +4. **Accessibilité**: Les composants suivent les bonnes pratiques d'accessibilité + +--- + +## 🔄 Maintenance + +Pour ajouter un nouveau composant: + +1. Créer le fichier dans le répertoire approprié +2. Suivre le pattern de documentation inline +3. Ajouter des exemples d'utilisation +4. Mettre à jour ce README + +--- + +**Dernière mise à jour**: 2025-01-29 +**Version**: 1.0.0 +**Auteur**: Lions User Manager Team + diff --git a/src/main/resources/META-INF/resources/templates/components/audit/audit-log-row.xhtml b/src/main/resources/META-INF/resources/templates/components/audit/audit-log-row.xhtml new file mode 100644 index 0000000..403ae5b --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/audit/audit-log-row.xhtml @@ -0,0 +1,110 @@ + + + + + + + + + + + + +
+ + +
+ +
+ + +
+
+ #{auditLog.typeAction} + +
+ +
+ + #{auditLog.acteurUsername} + + + #{auditLog.ressourceType} + + + #{auditLog.dateAction} + +
+ + + +
+ +
Ressource ID: #{auditLog.ressourceId}
+ + +
Détails: #{auditLog.details}
+ + +
IP: #{auditLog.adresseIp}
+ + +
User Agent: #{auditLog.userAgent}
+ + +
Erreur: #{auditLog.messageErreur}
+ +
+ +
+ + + +
+ +
+ +
+ + + diff --git a/src/main/resources/META-INF/resources/templates/components/audit/audit-stats-card.xhtml b/src/main/resources/META-INF/resources/templates/components/audit/audit-stats-card.xhtml new file mode 100644 index 0000000..f964b99 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/audit/audit-stats-card.xhtml @@ -0,0 +1,120 @@ + + + + + + + +
+ + + +
+
+ #{title} +
+ +
+
+ +
#{value}
+ + +
#{subtitle}
+ + + +
+ + + #{trend >= 0 ? '+' : ''}#{trend}% + + + #{trendLabel} + +
+ +
+ + + + +
+
+ #{title} +
+ +
+
+ +
#{value}
+ + +
#{subtitle}
+ + + +
+ + + #{trend >= 0 ? '+' : ''}#{trend}% + + + #{trendLabel} + +
+ +
+ + +
+ + + diff --git a/src/main/resources/META-INF/resources/templates/components/layout/footer.xhtml b/src/main/resources/META-INF/resources/templates/components/layout/footer.xhtml new file mode 100644 index 0000000..440d19a --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/layout/footer.xhtml @@ -0,0 +1,28 @@ + + + + +
+
+
+
+

Lions User Manager

+
Copyright © Lions Dev Team - Gestion centralisée des utilisateurs Keycloak
+

Version 1.0.0

+
+
+
+
+ + + diff --git a/src/main/resources/META-INF/resources/templates/components/layout/menu.xhtml b/src/main/resources/META-INF/resources/templates/components/layout/menu.xhtml new file mode 100644 index 0000000..45d377b --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/layout/menu.xhtml @@ -0,0 +1,58 @@ + + + + +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ + + diff --git a/src/main/resources/META-INF/resources/templates/components/layout/page-header.xhtml b/src/main/resources/META-INF/resources/templates/components/layout/page-header.xhtml new file mode 100644 index 0000000..12dde00 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/layout/page-header.xhtml @@ -0,0 +1,52 @@ + + + + +
+
+
+
+
+

+ + + + #{title} +

+

#{description}

+
+
+ +
+
+
+
+
+ + diff --git a/src/main/resources/META-INF/resources/templates/components/layout/topbar.xhtml b/src/main/resources/META-INF/resources/templates/components/layout/topbar.xhtml new file mode 100644 index 0000000..6c6327f --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/layout/topbar.xhtml @@ -0,0 +1,117 @@ + + + + +
+
+
+ + + + + + +
+ + + +
+ + + + +
+
+
+ + + diff --git a/src/main/resources/META-INF/resources/templates/components/role-management/role-assignment.xhtml b/src/main/resources/META-INF/resources/templates/components/role-management/role-assignment.xhtml new file mode 100644 index 0000000..ad3f0f8 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/role-management/role-assignment.xhtml @@ -0,0 +1,183 @@ + + + + + + + + + + + + + + +

Rôles actuels

+
+ + + + + + + + + + Aucun rôle attribué + +
+ + + + +

Rôles disponibles

+ + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + +

Rechercher un rôle

+
+ + + +
+ +
+ +
+ + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/role-management/role-card.xhtml b/src/main/resources/META-INF/resources/templates/components/role-management/role-card.xhtml new file mode 100644 index 0000000..885e2ce --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/role-management/role-card.xhtml @@ -0,0 +1,155 @@ + + + + + + + + + + + +
+
+ +
+

#{role.name}

+ + + Rôle Realm + Rôle Client + Rôle Composite + Rôle + + +
+
+ +
+ + +
+ + +

#{role.description}

+ + + +
+ +
+ + Realm: #{role.realmName} +
+ + + +
+ + Client: #{role.clientId} +
+ + + + +
+ + Rôle composite +
+ +
+
+ + + +
+ + + + + + + + + +
+ + + + + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/role-management/role-form-content.xhtml b/src/main/resources/META-INF/resources/templates/components/role-management/role-form-content.xhtml new file mode 100644 index 0000000..9ed2f5a --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/role-management/role-form-content.xhtml @@ -0,0 +1,131 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + + + + + +
+ + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/role-management/role-form.xhtml b/src/main/resources/META-INF/resources/templates/components/role-management/role-form.xhtml new file mode 100644 index 0000000..df483be --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/role-management/role-form.xhtml @@ -0,0 +1,92 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/shared/README_KPI.md b/src/main/resources/META-INF/resources/templates/components/shared/README_KPI.md new file mode 100644 index 0000000..6b27a0d --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/shared/README_KPI.md @@ -0,0 +1,240 @@ +# 📊 Composants KPI Réutilisables - Écosystème LionsDev + +**Version**: 2.0.0 +**Date**: 2025-01-29 +**Pattern**: WOU/DRY (Write Once Use / Don't Repeat Yourself) + +--- + +## 🎯 Vue d'Ensemble + +Ces composants KPI (Indicateurs de Performance) sont conçus pour être **100% réutilisables** dans tous les projets de l'écosystème **lionsdev**. Ils suivent les meilleures pratiques de PrimeFaces Freya et offrent une expérience utilisateur cohérente. + +--- + +## 📦 Composants Disponibles + +### 1. **kpi-card.xhtml** - Carte KPI Individuelle + +Composant principal pour afficher un indicateur de performance unique. + +**Localisation**: `/templates/components/shared/cards/kpi-card.xhtml` + +**Paramètres principaux**: +- `title` (requis) - Titre du KPI +- `value` (requis) - Valeur à afficher +- `icon` (requis) - Icône PrimeIcons +- `iconColor` (requis) - Couleur de l'icône +- `growthValue` (optionnel) - Valeur de croissance +- `growthLabel` (optionnel) - Libellé de croissance +- `progressValue` (optionnel) - Barre de progression 0-100 +- `statusIcon`, `statusLabel`, `statusValue` (optionnel) - Mode statut +- `clickable` (défaut: false) - Rendre cliquable +- `clickOutcome` (optionnel) - Redirection au clic + +**Exemple simple**: +```xhtml + + + + + + +``` + +**Exemple avec croissance**: +```xhtml + + + + + + + + + +``` + +**Exemple avec statut**: +```xhtml + + + + + + + + + +``` + +--- + +### 2. **kpi-group.xhtml** - Groupe de KPI + +Composant composite pour organiser plusieurs KPI dans une grille. + +**Localisation**: `/templates/components/shared/dashboard/kpi-group.xhtml` + +**Paramètres**: +- `title` (optionnel) - Titre de la section +- `columns` (défaut: 4) - Nombre de colonnes (1-6) +- `colSize` (optionnel) - Taille personnalisée + +**Exemple**: +```xhtml + + + + + + + + + + + + + + +``` + +--- + +### 3. **dashboard-section.xhtml** - Section Dashboard + +Composant composite pour créer des sections de dashboard réutilisables. + +**Localisation**: `/templates/components/shared/dashboard/dashboard-section.xhtml` + +**Paramètres**: +- `title` (requis) - Titre de la section +- `description` (optionnel) - Description +- `icon` (optionnel) - Icône +- `colSize` (défaut: "col-12") - Taille de colonne +- `showCard` (défaut: true) - Envelopper dans une carte + +**Exemple**: +```xhtml + + + + + + +
+
+ +
+
+ + +``` + +--- + +### 4. **user-stat-card.xhtml** - Wrapper de Compatibilité + +Wrapper de compatibilité ascendante qui délègue à `kpi-card.xhtml`. + +**Note**: Pour de nouvelles implémentations, utilisez directement `kpi-card.xhtml`. + +--- + +## 🎨 Couleurs Disponibles + +Utilisez les couleurs PrimeFlex pour `iconColor`: +- `blue-600`, `blue-500`, `blue-400` +- `green-600`, `green-500`, `green-400` +- `purple-600`, `purple-500`, `purple-400` +- `orange-600`, `orange-500`, `orange-400` +- `red-600`, `red-500`, `red-400` +- `cyan-600`, `cyan-500`, `cyan-400` +- `pink-600`, `pink-500`, `pink-400` + +--- + +## 📐 Tailles de Colonnes + +Utilisez les classes PrimeFlex pour `colSize`: +- `col-12` - Pleine largeur +- `col-12 md:col-6` - 2 colonnes sur tablette+ +- `col-12 md:col-6 lg:col-3` - 4 colonnes sur desktop (défaut) +- `col-12 md:col-4` - 3 colonnes +- `col-12 md:col-6 lg:col-2` - 6 colonnes + +--- + +## 🔄 Réutilisabilité dans l'Écosystème LionsDev + +Ces composants peuvent être utilisés dans: +- ✅ **lions-user-manager** (module actuel) +- ✅ **unionflow** (via dépendance Maven) +- ✅ **btpxpress** (via dépendance Maven) +- ✅ **Tout autre projet lionsdev** (via dépendance Maven) + +**Avantages**: +- Code DRY (Don't Repeat Yourself) +- Interface utilisateur cohérente +- Maintenance centralisée +- Évolutivité garantie + +--- + +## 📝 Bonnes Pratiques + +1. **Toujours utiliser `kpi-card.xhtml`** pour de nouveaux KPI +2. **Utiliser `kpi-group.xhtml`** pour organiser plusieurs KPI +3. **Utiliser `dashboard-section.xhtml`** pour structurer les dashboards +4. **Respecter les conventions de couleurs** PrimeFlex +5. **Documenter les paramètres personnalisés** dans votre code + +--- + +## 🚀 Exemple Complet de Dashboard + +```xhtml +
+ +
+ + + +
+ + +
+
+ + + + + + + +
+
+ + + + + + + + +
+``` + +--- + +## 📚 Documentation Complète + +Pour plus de détails, consultez: +- `/templates/components/README.md` - Documentation générale +- Code source des composants avec commentaires JSDoc + +--- + +**Auteur**: Lions User Manager Team +**Licence**: Écosystème LionsDev + diff --git a/src/main/resources/META-INF/resources/templates/components/shared/buttons/button-user-action.xhtml b/src/main/resources/META-INF/resources/templates/components/shared/buttons/button-user-action.xhtml new file mode 100644 index 0000000..5a9cbba --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/shared/buttons/button-user-action.xhtml @@ -0,0 +1,132 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/shared/cards/kpi-card-content.xhtml b/src/main/resources/META-INF/resources/templates/components/shared/cards/kpi-card-content.xhtml new file mode 100644 index 0000000..7bfaac5 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/shared/cards/kpi-card-content.xhtml @@ -0,0 +1,115 @@ + + +
+ +
+ #{title} +
+ +
+
+ + +
+ + + + + 0 + 0 + #{value} + + + 0 + +
+ + + +
#{subtitle}
+ + + + + + + + +
+ + #{statusLabel} + #{statusValue} +
+ + +
Aucun #{statusLabel}
+ + + + + + + + + + +
+ + +#{growthValue} + + #{growthLabel} + +
+ + +
#{noDataLabel}
+ + + + + + + +
+ + + + +#{growthValue}% + + + + #{growthValue}% + + + + #{growthLabel} + +
+ + +
#{noDataLabel}
+ + + + + + + + + + + +
+ + + diff --git a/src/main/resources/META-INF/resources/templates/components/shared/cards/kpi-card.xhtml b/src/main/resources/META-INF/resources/templates/components/shared/cards/kpi-card.xhtml new file mode 100644 index 0000000..44b18b5 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/shared/cards/kpi-card.xhtml @@ -0,0 +1,95 @@ + + + + + + + + + + + +
+ + + +
+ + + + + + + + + + + + + + + + + +
+ + + + +
+ + + + + + + + + + + + + + + + + +
+ + + +
+ + + + + + + + + + + + + + + + + +
+ + +
+ + diff --git a/src/main/resources/META-INF/resources/templates/components/shared/cards/user-stat-card.xhtml b/src/main/resources/META-INF/resources/templates/components/shared/cards/user-stat-card.xhtml new file mode 100644 index 0000000..d278915 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/shared/cards/user-stat-card.xhtml @@ -0,0 +1,67 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/shared/dashboard/dashboard-section.xhtml b/src/main/resources/META-INF/resources/templates/components/shared/dashboard/dashboard-section.xhtml new file mode 100644 index 0000000..48dab69 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/shared/dashboard/dashboard-section.xhtml @@ -0,0 +1,77 @@ + + + + + + + +
+ + +
+ +
+ + + +
#{title}
+
+ + +

#{description}

+ + + + +
+ + + +
+ + + +
#{title}
+
+ + +

#{description}

+ + + + + + +
+ + + diff --git a/src/main/resources/META-INF/resources/templates/components/shared/dashboard/kpi-group.xhtml b/src/main/resources/META-INF/resources/templates/components/shared/dashboard/kpi-group.xhtml new file mode 100644 index 0000000..73187d7 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/shared/dashboard/kpi-group.xhtml @@ -0,0 +1,78 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
#{title}
+ +
+ + + +
+
+ + + diff --git a/src/main/resources/META-INF/resources/templates/components/shared/forms/user-form-field.xhtml b/src/main/resources/META-INF/resources/templates/components/shared/forms/user-form-field.xhtml new file mode 100644 index 0000000..3a73ffc --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/shared/forms/user-form-field.xhtml @@ -0,0 +1,163 @@ + + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + #{helpText} + +
+ + + diff --git a/src/main/resources/META-INF/resources/templates/components/shared/tables/user-data-table.xhtml b/src/main/resources/META-INF/resources/templates/components/shared/tables/user-data-table.xhtml new file mode 100644 index 0000000..c55a153 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/shared/tables/user-data-table.xhtml @@ -0,0 +1,191 @@ + + + + + + + + + + + + + + + + + + + +
+ Utilisateurs + + Total: #{totalRecords} + +
+ + + + + + + + + + + + + + +
+
+
+ + #{user.prenom != null ? user.prenom.substring(0,1) : 'U'}#{user.nom != null ? user.nom.substring(0,1) : ''} + +
+
+ #{user.username} +
+ + + + +
+ #{user.prenom} #{user.nom} + + #{user.fonction} + +
+ + + + + +
+ + #{user.email} + + + +
+ + + + + + +
+ +
+ + + + + + +
+ + + + + + + + + + + + + Aucun rôle + + +
+ + + + + + +
+ +
+ + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/user-management/user-actions.xhtml b/src/main/resources/META-INF/resources/templates/components/user-management/user-actions.xhtml new file mode 100644 index 0000000..06a4d14 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/user-management/user-actions.xhtml @@ -0,0 +1,387 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + +
+ + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/user-management/user-card.xhtml b/src/main/resources/META-INF/resources/templates/components/user-management/user-card.xhtml new file mode 100644 index 0000000..3734dd2 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/user-management/user-card.xhtml @@ -0,0 +1,130 @@ + + + + + + + + + + +
+ +
+

#{user.prenom} #{user.nom}

+ @#{user.username} +
+
+ + +
+ +
+
+ + #{user.email} +
+ + +
+ + #{user.telephone} +
+ + + +
+ + +
+
+ + + +
+
Rôles
+
+ + + +
+
+ +
+ + + +
+ + + + + + + + + +
+ + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/user-management/user-form-content.xhtml b/src/main/resources/META-INF/resources/templates/components/user-management/user-form-content.xhtml new file mode 100644 index 0000000..d407e84 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/user-management/user-form-content.xhtml @@ -0,0 +1,216 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Mot de passe

+ + + + + + + + + + + + + +
+ + + + + + + + + + + + + + + + + +
+ + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/user-management/user-form.xhtml b/src/main/resources/META-INF/resources/templates/components/user-management/user-form.xhtml new file mode 100644 index 0000000..7de20d0 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/user-management/user-form.xhtml @@ -0,0 +1,95 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/user-management/user-role-badge.xhtml b/src/main/resources/META-INF/resources/templates/components/user-management/user-role-badge.xhtml new file mode 100644 index 0000000..b015886 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/user-management/user-role-badge.xhtml @@ -0,0 +1,105 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/user-management/user-search-bar-content.xhtml b/src/main/resources/META-INF/resources/templates/components/user-management/user-search-bar-content.xhtml new file mode 100644 index 0000000..0b4db41 --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/user-management/user-search-bar-content.xhtml @@ -0,0 +1,181 @@ + + + + +
+ Recherche d'utilisateurs + +
+ + + +
+
+ + + + +
+ + + +
+ + + + + +
+ + + + +
+ + + + + +
+ + + +
+ +
+ + +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ + + + + + diff --git a/src/main/resources/META-INF/resources/templates/components/user-management/user-search-bar.xhtml b/src/main/resources/META-INF/resources/templates/components/user-management/user-search-bar.xhtml new file mode 100644 index 0000000..836e92e --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/components/user-management/user-search-bar.xhtml @@ -0,0 +1,83 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main/resources/META-INF/resources/templates/main-template.xhtml b/src/main/resources/META-INF/resources/templates/main-template.xhtml new file mode 100644 index 0000000..a3f201b --- /dev/null +++ b/src/main/resources/META-INF/resources/templates/main-template.xhtml @@ -0,0 +1,54 @@ + + + + + + + + + + + + <ui:insert name="title">Lions User Manager</ui:insert> + + + + + + +
+ + +
+
+ + +
+ +
+ + + +