/* IMAGINA PLATFORM UI v2 - global client area standardization */

:root {
  --iwp-primary: #0f766e;
  --iwp-primary-hover: #115e59;
  --iwp-primary-soft: #e7fbff;
  --iwp-secondary: #0f4660;
  --iwp-secondary-dark: #071b33;
  --iwp-bg: #f7f9fb;
  --iwp-surface: #ffffff;
  --iwp-surface-soft: #f8fafc;
  --iwp-border: #dbe3ea;
  --iwp-border-soft: #edf2f7;
  --iwp-text: #0f172a;
  --iwp-text-soft: #334155;
  --iwp-muted: #64748b;
  --iwp-muted-light: #94a3b8;
  --iwp-success: #057a43;
  --iwp-success-bg: #d8fbe4;
  --iwp-warning: #946200;
  --iwp-warning-bg: #fff6d8;
  --iwp-danger: #b6202a;
  --iwp-danger-bg: #ffe5e7;
  --iwp-info: #155ab6;
  --iwp-info-bg: #e0efff;
  --iwp-radius-sm: 8px;
  --iwp-radius-md: 12px;
  --iwp-radius-lg: 16px;
  --iwp-shadow: 0 10px 28px rgba(15, 23, 42, .055);
  --iwp-shadow-soft: 0 4px 14px rgba(15, 23, 42, .045);
  --iwp-font: "Plus Jakarta Sans", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html {
  scroll-behavior: auto !important;
}

body:not(.login-bg),
body:not(.login-bg) button,
body:not(.login-bg) input,
body:not(.login-bg) select,
body:not(.login-bg) textarea {
  font-family: var(--iwp-font) !important;
  letter-spacing: 0 !important;
}

body:not(.login-bg) {
  background: var(--iwp-bg) !important;
  color: var(--iwp-text) !important;
}

body:not(.login-bg) *,
body:not(.login-bg) *::before,
body:not(.login-bg) *::after,
html.iw-cart-page *,
html.iw-cart-page *::before,
html.iw-cart-page *::after {
  animation: none !important;
  animation-delay: 0s !important;
  animation-duration: 0s !important;
  animation-iteration-count: 1 !important;
  scroll-behavior: auto !important;
}

body:not(.login-bg) a,
body:not(.login-bg) button,
body:not(.login-bg) .btn,
body:not(.login-bg) .card,
body:not(.login-bg) .panel,
body:not(.login-bg) .badge,
body:not(.login-bg) .label,
body:not(.login-bg) input,
body:not(.login-bg) select,
body:not(.login-bg) textarea,
html.iw-cart-page a,
html.iw-cart-page button,
html.iw-cart-page .btn,
html.iw-cart-page input,
html.iw-cart-page select,
html.iw-cart-page textarea {
  transition-property: color, background-color, border-color, opacity !important;
  transition-duration: 150ms !important;
  transition-timing-function: ease-out !important;
}

body:not(.login-bg) [class*="animate"],
body:not(.login-bg) [class*="fade"],
body:not(.login-bg) [class*="zoom"],
body:not(.login-bg) [class*="bounce"],
body:not(.login-bg) [class*="pulse"],
body:not(.login-bg) [class*="slide"],
body:not(.login-bg) [class*="parallax"],
body:not(.login-bg) [data-aos],
body:not(.login-bg) .wow,
body:not(.login-bg) .animated {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

body:not(.login-bg) .fa-spin,
body:not(.login-bg) .fas.fa-spinner,
body:not(.login-bg) .fas.fa-circle-notch,
html.iw-cart-page .fa-spin,
html.iw-cart-page .fas.fa-spinner,
html.iw-cart-page .fas.fa-circle-notch {
  animation: none !important;
}

body:not(.login-bg) #main-body,
body:not(.login-bg) .wrapper,
body:not(.login-bg) #content,
body:not(.login-bg) .theme-main-inner-page-section {
  background: var(--iwp-bg) !important;
  background-image: none !important;
}

body:not(.login-bg) .theme-main-inner-page-section > .container,
body:not(.login-bg) .theme-main-inner-page-section > .container-fluid {
  max-width: 1320px !important;
  padding-left: 22px !important;
  padding-right: 22px !important;
}

body:not(.login-bg) h1,
body:not(.login-bg) h2,
body:not(.login-bg) h3,
body:not(.login-bg) h4,
body:not(.login-bg) h5,
body:not(.login-bg) h6 {
  color: var(--iwp-text) !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

body:not(.login-bg) p,
body:not(.login-bg) .text-muted,
body:not(.login-bg) small,
body:not(.login-bg) .help-block {
  color: var(--iwp-muted) !important;
}

body:not(.login-bg) .iw-page-header,
body:not(.login-bg) .iw-home-card,
body:not(.login-bg) .iw-panel-card,
body:not(.login-bg) .iw-stat-card,
body:not(.login-bg) .card,
body:not(.login-bg) .panel,
body:not(.login-bg) .tile,
body:not(.login-bg) .widget,
body:not(.login-bg) .section,
body:not(.login-bg) .theme-table-card,
body:not(.login-bg) .table-container,
body:not(.login-bg) .invoice-inner-section,
body:not(.login-bg) .data-table-main-container,
body:not(.login-bg) .payment-gateway-section,
body:not(.login-bg) .cart-pnl-content,
body:not(.login-bg) .defaultClientxSidebar .card,
body:not(.login-bg) .list-group-item {
  background: var(--iwp-surface) !important;
  background-image: none !important;
  border: 1px solid var(--iwp-border) !important;
  border-radius: var(--iwp-radius-md) !important;
  box-shadow: var(--iwp-shadow-soft) !important;
}

body:not(.login-bg) .card-header,
body:not(.login-bg) .card-footer,
body:not(.login-bg) .panel-heading,
body:not(.login-bg) .panel-footer,
body:not(.login-bg) .iw-home-card-head,
body:not(.login-bg) .iw-home-card-footer {
  background: var(--iwp-surface) !important;
  border-color: var(--iwp-border-soft) !important;
}

body:not(.login-bg) .btn,
body:not(.login-bg) button.btn,
body:not(.login-bg) input[type="submit"],
body:not(.login-bg) input[type="button"] {
  align-items: center !important;
  border-radius: var(--iwp-radius-sm) !important;
  box-shadow: none !important;
  display: inline-flex !important;
  font-weight: 800 !important;
  gap: 8px !important;
  justify-content: center !important;
  min-height: 38px !important;
  padding: 9px 14px !important;
  text-decoration: none !important;
  text-shadow: none !important;
}

body:not(.login-bg) .btn-primary,
body:not(.login-bg) .btn-success,
body:not(.login-bg) .wgs_custom-btn,
body:not(.login-bg) .iw-btn-primary,
body:not(.login-bg) .add-button-common {
  background: var(--iwp-primary) !important;
  border-color: var(--iwp-primary) !important;
  color: #fff !important;
}

body:not(.login-bg) .btn-primary:hover,
body:not(.login-bg) .btn-success:hover,
body:not(.login-bg) .wgs_custom-btn:hover,
body:not(.login-bg) .iw-btn-primary:hover,
body:not(.login-bg) .add-button-common:hover {
  background: var(--iwp-primary-hover) !important;
  border-color: var(--iwp-primary-hover) !important;
  color: #fff !important;
}

body:not(.login-bg) .btn-default,
body:not(.login-bg) .btn-secondary,
body:not(.login-bg) .btn-light,
body:not(.login-bg) .iw-btn-secondary {
  background: #fff !important;
  border-color: var(--iwp-border) !important;
  color: var(--iwp-text-soft) !important;
}

body:not(.login-bg) .btn-danger,
body:not(.login-bg) .iw-btn-danger {
  background: var(--iwp-danger-bg) !important;
  border-color: #f3b8bc !important;
  color: var(--iwp-danger) !important;
}

body:not(.login-bg) .form-control,
body:not(.login-bg) input[type="text"],
body:not(.login-bg) input[type="email"],
body:not(.login-bg) input[type="password"],
body:not(.login-bg) input[type="search"],
body:not(.login-bg) input[type="tel"],
body:not(.login-bg) input[type="url"],
body:not(.login-bg) input[type="number"],
body:not(.login-bg) select,
body:not(.login-bg) textarea {
  background: #fff !important;
  border: 1px solid var(--iwp-border) !important;
  border-radius: var(--iwp-radius-sm) !important;
  box-shadow: none !important;
  color: var(--iwp-text) !important;
  min-height: 40px !important;
}

body:not(.login-bg) .form-control:focus,
body:not(.login-bg) input:focus,
body:not(.login-bg) select:focus,
body:not(.login-bg) textarea:focus {
  border-color: var(--iwp-primary) !important;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, .12) !important;
  outline: 0 !important;
}

body:not(.login-bg) label {
  color: var(--iwp-text-soft) !important;
  font-weight: 750 !important;
}

body:not(.login-bg) table,
body:not(.login-bg) .table,
body:not(.login-bg) table.dataTable {
  background: #fff !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: var(--iwp-text-soft) !important;
}

body:not(.login-bg) .table thead th,
body:not(.login-bg) table.dataTable thead th {
  background: var(--iwp-surface-soft) !important;
  border-bottom: 1px solid var(--iwp-border) !important;
  color: #475569 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  padding: 13px 14px !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

body:not(.login-bg) .table tbody td,
body:not(.login-bg) table.dataTable tbody td {
  border-top: 0 !important;
  border-bottom: 1px solid var(--iwp-border-soft) !important;
  color: var(--iwp-text-soft) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  padding: 14px !important;
  vertical-align: middle !important;
}

body:not(.login-bg) .table tbody tr:hover,
body:not(.login-bg) table.dataTable tbody tr:hover {
  background: #f8fbff !important;
}

body:not(.login-bg) .badge,
body:not(.login-bg) .label,
body:not(.login-bg) .status,
body:not(.login-bg) span[class*="status"],
body:not(.login-bg) .invoice-status {
  border-radius: 999px !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 24px !important;
  padding: 5px 10px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body:not(.login-bg) .label-success,
body:not(.login-bg) .badge-success,
body:not(.login-bg) .status-active,
body:not(.login-bg) .status-paid,
body:not(.login-bg) .status-completed {
  background: var(--iwp-success-bg) !important;
  border: 1px solid #acefc5 !important;
  color: var(--iwp-success) !important;
}

body:not(.login-bg) .label-warning,
body:not(.login-bg) .badge-warning,
body:not(.login-bg) .status-pending,
body:not(.login-bg) .status-unpaid {
  background: var(--iwp-warning-bg) !important;
  border: 1px solid #f2df9c !important;
  color: var(--iwp-warning) !important;
}

body:not(.login-bg) .label-danger,
body:not(.login-bg) .badge-danger,
body:not(.login-bg) .status-cancelled,
body:not(.login-bg) .status-canceled,
body:not(.login-bg) .status-overdue,
body:not(.login-bg) .status-terminated {
  background: var(--iwp-danger-bg) !important;
  border: 1px solid #f3b8bc !important;
  color: var(--iwp-danger) !important;
}

body:not(.login-bg) .label-info,
body:not(.login-bg) .badge-info,
body:not(.login-bg) .status-suspended {
  background: var(--iwp-info-bg) !important;
  border: 1px solid #bdd9ff !important;
  color: var(--iwp-info) !important;
}

body:not(.login-bg) .modal-content {
  border: 1px solid var(--iwp-border) !important;
  border-radius: var(--iwp-radius-lg) !important;
  box-shadow: var(--iwp-shadow) !important;
  overflow: hidden !important;
}

body:not(.login-bg) .modal-header,
body:not(.login-bg) .modal-footer {
  background: #fff !important;
  border-color: var(--iwp-border-soft) !important;
}

body:not(.login-bg) .alert {
  border-radius: var(--iwp-radius-md) !important;
  box-shadow: none !important;
}

body:not(.login-bg) .attachment-list,
body:not(.login-bg) .ticket-attachments,
body:not(.login-bg) .attachments {
  display: grid !important;
  gap: 10px !important;
}

body:not(.login-bg) .attachment-list li,
body:not(.login-bg) .ticket-attachments li,
body:not(.login-bg) .attachments li {
  align-items: center !important;
  background: #fff !important;
  border: 1px solid var(--iwp-border) !important;
  border-radius: var(--iwp-radius-sm) !important;
  display: flex !important;
  gap: 10px !important;
  min-height: 44px !important;
  padding: 10px 12px !important;
}

body:not(.login-bg) .iw-topbar {
  background: var(--iwp-secondary-dark) !important;
  border: 0 !important;
  color: #e2f5f3 !important;
}

body:not(.login-bg) .iw-topbar-link {
  color: #ffffff !important;
  font-weight: 900 !important;
}

body:not(.login-bg) nav#sidebar,
body:not(.login-bg) .sidebar-wrapper,
body:not(.login-bg) .wgs-sidebar {
  background: var(--iwp-secondary-dark) !important;
}

body:not(.login-bg) nav#sidebar a,
body:not(.login-bg) .sidebar-wrapper a,
body:not(.login-bg) .wgs-sidebar a {
  letter-spacing: 0 !important;
}

body:not(.login-bg) nav#sidebar .active > a,
body:not(.login-bg) nav#sidebar a.active,
body:not(.login-bg) .sidebar-wrapper .active > a,
body:not(.login-bg) .wgs-sidebar .active > a {
  background: rgba(15, 118, 110, .18) !important;
  border-color: rgba(125, 230, 218, .24) !important;
  color: #ffffff !important;
}

@media (max-width: 991px) {
  body:not(.login-bg) .theme-main-inner-page-section > .container,
  body:not(.login-bg) .theme-main-inner-page-section > .container-fluid {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  body:not(.login-bg) .table-responsive,
  body:not(.login-bg) .invoice-inner-section,
  body:not(.login-bg) .data-table-main-container,
  body:not(.login-bg) .table-container {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

@media (max-width: 640px) {
  body:not(.login-bg) .btn,
  body:not(.login-bg) button.btn,
  body:not(.login-bg) input[type="submit"],
  body:not(.login-bg) input[type="button"] {
    min-height: 42px !important;
    width: 100%;
  }

  body:not(.login-bg) .iw-page-actions,
  body:not(.login-bg) .button-group,
  body:not(.login-bg) .btn-group {
    align-items: stretch !important;
    display: grid !important;
    gap: 8px !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }
}