/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./apps/system/src/styles.scss?ngGlobalStyle ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/* ===================================
   SISTEMA DE TOKENS CSS Y RESET PROFESIONAL
   ================================= */
:root {
  /* Typography System */
  --ui-font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  /* Color System */
  --ui-color-primary: #7e549e;
  --ui-color-primary-hover: #9371b8;
  --ui-color-primary-light: #e2d5ed;
  --ui-color-text-primary: #333333;
  --ui-color-text-secondary: #717a82;
  --ui-color-text-muted: #666666;
  --ui-color-border: #e4e4e6;
  --ui-color-border-input: #c9ced4;
  --ui-color-border-focus: #51525e;
  --ui-color-background: #ffffff;
  --ui-color-background-hover: #f0f0f0;
  --ui-color-error: #dc3545;
  --ui-color-success: #28a745;
  /* Spacing System */
  --ui-spacing-xs: 4px;
  --ui-spacing-sm: 8px;
  --ui-spacing-md: 12px;
  --ui-spacing-lg: 15px;
  --ui-spacing-xl: 20px;
  --ui-spacing-xxl: 25px;
  /* Border Radius System */
  --ui-radius-sm: 4px;
  --ui-radius-md: 6px;
  --ui-radius-lg: 8px;
  --ui-radius-xl: 12px;
  /* Shadow System */
  --ui-shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.1);
  --ui-shadow-md: 0 4px 12px rgba(126, 84, 158, 0.3);
  --ui-shadow-lg: 0 8px 25px rgba(0, 0, 0, 0.15);
  /* Component Heights */
  --ui-height-input: 45px;
  --ui-height-button: 45px;
  --ui-height-header: 75px;
  /* Layout Widths */
  --ui-width-form: 350px;
  --ui-width-dropdown: 290px;
  --ui-width-menu-option: 260px;
}

/* Reset Universal - Especificidad: 0,0,0,1 */
*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Reset de Elementos Problemáticos - Especificidad: 0,0,0,1 */
img, iframe, object, embed, hr {
  border: none;
}

/* Reset de Listas - Especificidad: 0,0,0,1 */
ul, ol, li {
  list-style: none;
}

/* Reset de Enlaces - Especificidad: 0,0,0,1 */
a {
  text-decoration: none;
  color: inherit;
}

/* Reset de Botones - Especificidad: 0,0,0,1 */
button {
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
}

/* Viewport Base - Solo Critical !important para override del navegador */
html, body {
  width: 100vw !important;
  height: 100vh !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  margin: 0;
  padding: 0;
  font-family: var(--ui-font-primary);
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
  font-optical-sizing: auto;
}

/* Contenedores Angular Base - Especificidad: 0,0,0,1 */
app-root,
app-login-layout,
app-login-panel,
app-image-panel {
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
}

/* Container Principal - Especificidad: 0,0,0,1 */
app-root {
  width: 100%;
  height: 100%;
}

/* Media Queries Responsive - Solo Critical !important */
@media (max-width: 1279px) {
  html, body {
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
}
/* Utility Classes - Para usar en lugar de !important */
.ui-margin-reset {
  margin: 0;
}

.ui-padding-reset {
  padding: 0;
}

.ui-border-none {
  border: none;
}

.ui-outline-none {
  outline: none;
}

.ui-width-full {
  width: 100%;
}

.ui-height-full {
  height: 100%;
}

/* Focus Management - Sistema de especificidad */
.ui-no-focus:focus,
.ui-no-focus:focus-visible {
  outline: none;
  box-shadow: none;
}

/*# sourceMappingURL=styles.css.map*/