@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";
@import "https://fonts.googleapis.com/icon?family=Material+Icons";

/* src/styles.scss */
:root {
  --font-family:
    "Inter",
    "Segoe UI",
    Tahoma,
    Geneva,
    Verdana,
    sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-xxl: 3rem;
  --border-radius-sm: 4px;
  --border-radius-md: 8px;
  --border-radius-lg: 12px;
  --border-radius-xl: 16px;
  --border-radius-full: 9999px;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07), 0 2px 4px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.05);
  --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.04);
  --shadow-2xl: 0 25px 50px rgba(0, 0, 0, 0.15);
  --transition-fast: 0.15s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;
  --transition-bounce: 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  --surface-elevation-1: 0 1px 3px rgba(0, 0, 0, 0.12);
  --surface-elevation-2: 0 3px 6px rgba(0, 0, 0, 0.16);
  --surface-elevation-3: 0 10px 20px rgba(0, 0, 0, 0.19);
  --interactive-hover: rgba(0, 0, 0, 0.04);
  --interactive-pressed: rgba(0, 0, 0, 0.08);
  --interactive-focus: rgba(59, 130, 246, 0.12);
  --interactive-focus-ring: 0 0 0 3px rgba(59, 130, 246, 0.12);
  --status-success: #10b981;
  --status-success-bg: #d1fae5;
  --status-success-border: #a7f3d0;
  --status-warning: #f59e0b;
  --status-warning-bg: #fef3c7;
  --status-warning-border: #fde68a;
  --status-error: #ef4444;
  --status-error-bg: #fee2e2;
  --status-error-border: #fecaca;
  --status-info: #3b82f6;
  --status-info-bg: #dbeafe;
  --status-info-border: #bfdbfe;
  --gradient-primary:
    linear-gradient(
      135deg,
      #3b82f6 0%,
      #1d4ed8 100%);
  --gradient-success:
    linear-gradient(
      135deg,
      #10b981 0%,
      #059669 100%);
  --gradient-warning:
    linear-gradient(
      135deg,
      #f59e0b 0%,
      #d97706 100%);
  --gradient-error:
    linear-gradient(
      135deg,
      #ef4444 0%,
      #dc2626 100%);
  --gradient-surface:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #f8fafc 100%);
  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal-backdrop: 1040;
  --z-modal: 1050;
  --z-popover: 1060;
  --z-tooltip: 1070;
  --z-toast: 1080;
}
.theme-light {
  --color-primary: #3498db;
  --color-accent: #27ae60;
  --color-warn: #e74c3c;
  --color-success: #27ae60;
  --color-info: #3498db;
  --color-warning: #f39c12;
  --color-danger: #e74c3c;
  --background-primary: #ffffff;
  --background-secondary: white;
  --background-tertiary: white;
  --text-primary: #2c3e50;
  --text-secondary: rgba(44, 62, 80, 0.7);
  --text-tertiary: rgba(44, 62, 80, 0.5);
  --text-disabled: rgba(44, 62, 80, 0.3);
  --border-color: rgba(44, 62, 80, 0.12);
  --divider-color: rgba(44, 62, 80, 0.08);
  --background-app: #f8f9fa;
  --background-card: #ffffff;
  --background-hover: rgba(52, 152, 219, 0.04);
  --background-selected: rgba(52, 152, 219, 0.08);
  --status-available-bg: #d5f4e6;
  --status-available-color: #27ae60;
  --status-borrowed-bg: #fef5e7;
  --status-borrowed-color: #f39c12;
  --status-maintenance-bg: #fadbd8;
  --status-maintenance-color: #e74c3c;
  --status-unavailable-bg: #f4f4f4;
  --status-unavailable-color: #7f8c8d;
}
.theme-dark {
  --color-primary: #5dade2;
  --color-accent: #58d68d;
  --color-warn: #ec7063;
  --color-success: #27ae60;
  --color-info: #3498db;
  --color-warning: #f39c12;
  --color-danger: #e74c3c;
  --background-primary: #2c3e50;
  --background-secondary: rgb(52.44, 69.72, 87);
  --background-tertiary: rgb(60.88, 77.44, 94);
  --text-primary: #ecf0f1;
  --text-secondary: rgba(236, 240, 241, 0.7);
  --text-tertiary: rgba(236, 240, 241, 0.5);
  --text-disabled: rgba(236, 240, 241, 0.3);
  --border-color: rgba(236, 240, 241, 0.12);
  --divider-color: rgba(236, 240, 241, 0.08);
  --background-app: #121212;
  --background-card: #1e1e1e;
  --background-hover: rgba(93, 173, 226, 0.08);
  --background-selected: rgba(93, 173, 226, 0.12);
  --status-available-bg: rgba(39, 174, 96, 0.2);
  --status-available-color: #58d68d;
  --status-borrowed-bg: rgba(243, 156, 18, 0.2);
  --status-borrowed-color: #f7dc6f;
  --status-maintenance-bg: rgba(231, 76, 60, 0.2);
  --status-maintenance-color: #ec7063;
  --status-unavailable-bg: rgba(127, 140, 141, 0.2);
  --status-unavailable-color: #bdc3c7;
}
.theme-corporate {
  --color-primary: #2c3e50;
  --color-accent: #34495e;
  --color-warn: #e74c3c;
  --color-success: #27ae60;
  --color-info: #3498db;
  --color-warning: #f39c12;
  --color-danger: #e74c3c;
  --background-primary: #ffffff;
  --background-secondary: white;
  --background-tertiary: white;
  --text-primary: #2c3e50;
  --text-secondary: rgba(44, 62, 80, 0.7);
  --text-tertiary: rgba(44, 62, 80, 0.5);
  --text-disabled: rgba(44, 62, 80, 0.3);
  --border-color: rgba(44, 62, 80, 0.12);
  --divider-color: rgba(44, 62, 80, 0.08);
  --background-app: #ecf0f1;
  --background-card: #ffffff;
  --background-hover: rgba(44, 62, 80, 0.04);
  --background-selected: rgba(44, 62, 80, 0.08);
  --status-available-bg: #d4edda;
  --status-available-color: #155724;
  --status-borrowed-bg: #fff3cd;
  --status-borrowed-color: #856404;
  --status-maintenance-bg: #f8d7da;
  --status-maintenance-color: #721c24;
  --status-unavailable-bg: #e2e3e5;
  --status-unavailable-color: #6c757d;
}
.theme-cosmic {
  --color-primary: #9b59b6;
  --color-accent: #e91e63;
  --color-warn: #e74c3c;
  --color-success: #27ae60;
  --color-info: #3498db;
  --color-warning: #f39c12;
  --color-danger: #e74c3c;
  --background-primary: #2c2c54;
  --background-secondary: rgb(52.44, 52.44, 90.84);
  --background-tertiary: rgb(60.88, 60.88, 97.68);
  --text-primary: #ffffff;
  --text-secondary: rgba(255, 255, 255, 0.7);
  --text-tertiary: rgba(255, 255, 255, 0.5);
  --text-disabled: rgba(255, 255, 255, 0.3);
  --border-color: rgba(255, 255, 255, 0.12);
  --divider-color: rgba(255, 255, 255, 0.08);
  --background-app:
    linear-gradient(
      135deg,
      #667eea 0%,
      #764ba2 100%);
  --background-card: rgba(255, 255, 255, 0.1);
  --background-hover: rgba(155, 89, 182, 0.1);
  --background-selected: rgba(155, 89, 182, 0.2);
  --status-available-bg: rgba(46, 204, 113, 0.2);
  --status-available-color: #2ecc71;
  --status-borrowed-bg: rgba(230, 126, 34, 0.2);
  --status-borrowed-color: #e67e22;
  --status-maintenance-bg: rgba(231, 76, 60, 0.2);
  --status-maintenance-color: #e74c3c;
  --status-unavailable-bg: rgba(149, 165, 166, 0.2);
  --status-unavailable-color: #95a5a6;
}
.theme-cosmic .mat-mdc-card {
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
:root {
  --theme-count: 4;
}
body {
  margin: 0;
  padding: 0;
  font-family: "Roboto", sans-serif;
  transition: all 0.3s ease;
}
.app-container {
  min-height: 100vh;
  background: var(--background-app, #fafafa);
}
.mat-mdc-card {
  background: var(--background-card, #ffffff) !important;
  transition: all 0.3s ease;
}
.status-indicator {
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 500;
}
.status-indicator.available {
  background-color: var(--status-available-bg);
  color: var(--status-available-color);
}
.status-indicator.borrowed {
  background-color: var(--status-borrowed-bg);
  color: var(--status-borrowed-color);
}
.status-indicator.maintenance {
  background-color: var(--status-maintenance-bg);
  color: var(--status-maintenance-color);
}
.status-indicator.unavailable {
  background-color: var(--status-unavailable-bg);
  color: var(--status-unavailable-color);
}
.mat-mdc-button,
.mat-mdc-raised-button,
.mat-mdc-fab,
.mat-mdc-mini-fab {
  transition: all 0.3s ease;
}
.mat-mdc-form-field .mat-mdc-text-field-wrapper {
  background: var(--background-card, #ffffff);
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: var(--font-family);
  font-size: var(--font-size-base);
  line-height: 1.5;
  transition: var(--transition-normal);
}
body {
  background: var(--background-app);
  color: var(--text-primary);
  overflow-x: hidden;
}
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: var(--background-secondary);
}
::-webkit-scrollbar-thumb {
  background: var(--border-color);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--text-tertiary);
}
.mat-mdc-card {
  background: var(--background-card) !important;
  color: var(--text-primary) !important;
  border-radius: var(--border-radius-md) !important;
  box-shadow: var(--shadow-md) !important;
  border: 1px solid var(--border-color);
  transition: var(--transition-normal);
}
.mat-mdc-card:hover {
  box-shadow: var(--shadow-lg) !important;
  transform: translateY(-2px);
}
.mat-mdc-button,
.mat-mdc-raised-button,
.mat-mdc-outlined-button,
.mat-mdc-fab,
.mat-mdc-mini-fab {
  border-radius: var(--border-radius-sm) !important;
  font-weight: var(--font-weight-medium) !important;
  transition: var(--transition-normal);
}
.mat-mdc-button:hover,
.mat-mdc-raised-button:hover,
.mat-mdc-outlined-button:hover,
.mat-mdc-fab:hover,
.mat-mdc-mini-fab:hover {
  transform: translateY(-1px);
}
.mat-mdc-form-field .mat-mdc-text-field-wrapper {
  border-radius: var(--border-radius-sm) !important;
}
.mat-mdc-form-field .mdc-text-field--outlined .mdc-text-field__input {
  padding-left: 12px !important;
}
.mat-mdc-form-field .mdc-text-field--outlined .mat-mdc-select-trigger {
  padding-left: 12px !important;
}
.custom-select-panel {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: var(--border-radius-sm) !important;
  box-shadow: var(--shadow-lg) !important;
}
.custom-select-panel .mat-mdc-option {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
}
.custom-select-panel .mat-mdc-option:hover:not(.mdc-list-item--disabled),
.custom-select-panel .mat-mdc-option.mat-mdc-option-active {
  background-color: var(--background-secondary) !important;
  color: var(--text-primary) !important;
}
.custom-select-panel .mat-mdc-option.mdc-list-item--selected {
  background-color: var(--primary-color) !important;
  color: var(--primary-contrast) !important;
}
.custom-select-panel .mat-mdc-option.mdc-list-item--selected:hover {
  background-color: var(--primary-dark) !important;
  color: var(--primary-contrast) !important;
}
.custom-select-panel .mat-mdc-option .mdc-list-item__primary-text {
  color: inherit !important;
}
.mat-datepicker-content {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: var(--border-radius-sm) !important;
  box-shadow: var(--shadow-lg) !important;
}
.mat-calendar {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
}
.mat-calendar-header {
  background-color: var(--background-secondary) !important;
  color: var(--text-primary) !important;
}
.mat-calendar-body-cell-content {
  background-color: transparent !important;
  color: var(--text-primary) !important;
  border-radius: var(--border-radius-sm) !important;
}
.mat-calendar-body-cell-content:hover {
  background-color: var(--background-secondary) !important;
}
.mat-calendar-body-selected {
  background-color: var(--primary-color) !important;
  color: var(--primary-contrast) !important;
}
.mat-calendar-body-selected:hover {
  background-color: var(--primary-dark) !important;
}
.mat-calendar-body-today:not(.mat-calendar-body-selected) {
  border-color: var(--primary-color) !important;
  color: var(--text-primary) !important;
}
.mat-mdc-tooltip {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: var(--border-radius-sm) !important;
  box-shadow: var(--shadow-lg) !important;
  font-size: 12px !important;
  padding: 8px 12px !important;
  max-width: 250px !important;
}
.mat-mdc-tooltip .mdc-tooltip__surface {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
}
.cdk-overlay-backdrop {
  background-color: rgba(0, 0, 0, 0.32) !important;
}
.cdk-overlay-backdrop.cdk-overlay-dark-backdrop {
  background-color: rgba(0, 0, 0, 0.6) !important;
}
.cdk-overlay-backdrop.cdk-overlay-transparent-backdrop {
  background-color: rgba(0, 0, 0, 0.1) !important;
}
@media (prefers-color-scheme: dark) {
  .cdk-overlay-backdrop.cdk-overlay-transparent-backdrop {
    background-color: rgba(255, 255, 255, 0.05) !important;
  }
}
.mat-mdc-dialog-container .mdc-dialog__surface {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border-radius: var(--border-radius-md) !important;
  box-shadow: var(--shadow-lg) !important;
}
.mat-mdc-snack-bar-container {
  z-index: 10000 !important;
}
.success-snackbar .mdc-snackbar__surface {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-left: 6px solid #16a34a !important;
  border-radius: var(--border-radius-md) !important;
  box-shadow: var(--shadow-lg) !important;
  min-width: 320px;
  max-width: min(560px, 92vw);
}
.success-snackbar .mdc-snackbar__label {
  color: var(--text-primary) !important;
  font-weight: 600;
}
.success-snackbar .mat-mdc-snack-bar-action,
.success-snackbar .mdc-button {
  color: #16a34a !important;
  font-weight: 700 !important;
}
.error-snackbar .mdc-snackbar__surface {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-left: 6px solid #dc2626 !important;
  border-radius: var(--border-radius-md) !important;
  box-shadow: var(--shadow-lg) !important;
  min-width: 320px;
  max-width: min(560px, 92vw);
}
.error-snackbar .mdc-snackbar__label {
  color: var(--text-primary) !important;
  font-weight: 600;
}
.error-snackbar .mat-mdc-snack-bar-action,
.error-snackbar .mdc-button {
  color: #dc2626 !important;
  font-weight: 700 !important;
}
.info-snackbar .mdc-snackbar__surface {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-left: 6px solid #2563eb !important;
  border-radius: var(--border-radius-md) !important;
  box-shadow: var(--shadow-lg) !important;
  min-width: 320px;
  max-width: min(560px, 92vw);
}
.info-snackbar .mdc-snackbar__label {
  color: var(--text-primary) !important;
  font-weight: 600;
}
.info-snackbar .mat-mdc-snack-bar-action,
.info-snackbar .mdc-button {
  color: #2563eb !important;
  font-weight: 700 !important;
}
.warning-snackbar .mdc-snackbar__surface {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-left: 6px solid #f59e0b !important;
  border-radius: var(--border-radius-md) !important;
  box-shadow: var(--shadow-lg) !important;
  min-width: 320px;
  max-width: min(560px, 92vw);
}
.warning-snackbar .mdc-snackbar__label {
  color: var(--text-primary) !important;
  font-weight: 600;
}
.warning-snackbar .mat-mdc-snack-bar-action,
.warning-snackbar .mdc-button {
  color: #f59e0b !important;
  font-weight: 700 !important;
}
.delete-confirmation-snackbar .mdc-snackbar__surface {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-left: 6px solid #f59e0b !important;
  border-radius: var(--border-radius-md) !important;
  box-shadow: var(--shadow-lg) !important;
  min-width: 320px;
  max-width: min(560px, 92vw);
}
.delete-confirmation-snackbar .mdc-snackbar__label {
  color: var(--text-primary) !important;
  font-weight: 600;
}
.delete-confirmation-snackbar .mat-mdc-snack-bar-action,
.delete-confirmation-snackbar .mdc-button {
  color: #f59e0b !important;
  font-weight: 700 !important;
}
.mat-mdc-menu-panel {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: var(--border-radius-sm) !important;
  box-shadow: var(--shadow-lg) !important;
}
.mat-mdc-menu-panel .mat-mdc-menu-item {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
}
.mat-mdc-menu-panel .mat-mdc-menu-item:hover:not([disabled]),
.mat-mdc-menu-panel .mat-mdc-menu-item.cdk-program-focused:not([disabled]),
.mat-mdc-menu-panel .mat-mdc-menu-item.cdk-keyboard-focused:not([disabled]) {
  background-color: var(--background-secondary) !important;
  color: var(--text-primary) !important;
}
.mat-mdc-menu-panel .mat-mdc-menu-item[aria-selected=true]:not([disabled]) {
  background-color: var(--primary-color) !important;
  color: var(--primary-contrast) !important;
}
.mat-mdc-menu-panel .mat-mdc-menu-item .mat-icon {
  color: inherit !important;
}
.mat-mdc-menu-panel .mat-mdc-menu-content {
  background-color: var(--background-card) !important;
  color: var(--text-primary) !important;
}
.status-badge {
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  display: inline-block;
}
.status-badge.status-available {
  background-color: var(--status-available-bg);
  color: var(--status-available-color);
}
.status-badge.status-borrowed {
  background-color: var(--status-borrowed-bg);
  color: var(--status-borrowed-color);
}
.status-badge.status-maintenance {
  background-color: var(--status-maintenance-bg);
  color: var(--status-maintenance-color);
}
.status-badge.status-unavailable {
  background-color: var(--status-unavailable-bg);
  color: var(--status-unavailable-color);
}
.text-primary {
  color: var(--text-primary) !important;
}
.text-secondary {
  color: var(--text-secondary) !important;
}
.text-tertiary {
  color: var(--text-tertiary) !important;
}
.bg-primary {
  background-color: var(--background-primary) !important;
}
.bg-secondary {
  background-color: var(--background-secondary) !important;
}
.bg-card {
  background-color: var(--background-card) !important;
}
.border-radius-sm {
  border-radius: var(--border-radius-sm) !important;
}
.border-radius-md {
  border-radius: var(--border-radius-md) !important;
}
.border-radius-lg {
  border-radius: var(--border-radius-lg) !important;
}
.shadow-sm {
  box-shadow: var(--shadow-sm) !important;
}
.shadow-md {
  box-shadow: var(--shadow-md) !important;
}
.shadow-lg {
  box-shadow: var(--shadow-lg) !important;
}
.fade-in {
  animation: fadeIn 0.3s ease-in-out;
}
.slide-up {
  animation: slideUp 0.3s ease-out;
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (max-width: 768px) {
  :root {
    --font-size-base: 13px;
    --spacing-md: 0.75rem;
    --spacing-lg: 1rem;
    --spacing-xl: 1.5rem;
  }
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */