/* System 360 - macOS/iOS 26 Visual Refresh (clean glass, smooth loading, minimal motion) */

:root {
  --s360-font-ui: "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --s360-bg: #eef3fb;
  --s360-bg-soft: #f4f7fd;
  --s360-ink: #0f2138;
  --s360-ink-soft: #4a617a;
  --s360-line: rgba(130, 160, 201, 0.42);
  --s360-line-soft: rgba(130, 160, 201, 0.26);
  --s360-glass: rgba(255, 255, 255, 0.62);
  --s360-glass-strong: rgba(255, 255, 255, 0.76);
  --s360-glass-nested: rgba(255, 255, 255, 0.38);
  --s360-overlay: rgba(16, 27, 44, 0.3);
  --s360-accent: #0a84ff;
  --s360-success: #19a45b;
  --s360-warn: #c88616;
  --s360-danger: #cc4c62;
  --s360-radius-sm: 12px;
  --s360-radius-md: 16px;
  --s360-radius-lg: 22px;
  --s360-shadow: 0 12px 26px rgba(12, 34, 64, 0.12);
  --s360-shadow-soft: 0 6px 16px rgba(12, 34, 64, 0.08);
  --s360-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ===== 360 CRM Chat Hub premium ===== */
body .s360-chat-layer,
#system360-app .s360-chat-layer {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10080 !important;
  pointer-events: none !important;
  font-family: Inter, "SF Pro Display", "Segoe UI", sans-serif !important;
}

body .s360-chat-layer .s360-chat-window,
#system360-app .s360-chat-layer .s360-chat-window {
  pointer-events: auto !important;
  background:
    radial-gradient(circle at 18% -8%, rgba(56, 130, 246, 0.22), transparent 30%),
    radial-gradient(circle at 88% 0%, rgba(236, 72, 153, 0.14), transparent 29%),
    linear-gradient(145deg, #0b0b0f 0%, #0d1320 48%, #080a12 100%) !important;
  border: 1px solid rgba(88, 122, 189, 0.34) !important;
  border-radius: 18px !important;
  color: #eef4ff !important;
  box-shadow: 0 34px 100px rgba(0, 0, 0, 0.68), 0 0 0 1px rgba(255, 255, 255, 0.035) inset !important;
  overflow: hidden !important;
}

body .s360-chat-layer .s360-chat-window.is-launcher,
#system360-app .s360-chat-layer .s360-chat-window.is-launcher {
  min-width: min(1180px, calc(100vw - 32px)) !important;
  min-height: min(700px, calc(100vh - 70px)) !important;
}

body .s360-chat-layer .s360-chat-window-head,
#system360-app .s360-chat-layer .s360-chat-window-head {
  min-height: 68px !important;
  padding: 14px 18px !important;
  background: rgba(11, 11, 15, 0.86) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12) !important;
}

body .s360-chat-layer .s360-chat-window-head-main strong,
#system360-app .s360-chat-layer .s360-chat-window-head-main strong {
  font-size: 20px !important;
  letter-spacing: -0.02em !important;
}

body .s360-chat-layer .s360-chat-window-head-main small,
#system360-app .s360-chat-layer .s360-chat-window-head-main small {
  color: #a9b7d5 !important;
}

body .s360-chat-layer .s360-chat-window-nav,
#system360-app .s360-chat-layer .s360-chat-window-nav {
  grid-template-columns: 240px minmax(0, 1fr) !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  background: rgba(11, 11, 15, 0.72) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.1) !important;
}

body .s360-chat-layer .s360-chat-window-tabs,
#system360-app .s360-chat-layer .s360-chat-window-tabs {
  border-radius: 14px !important;
  border: 1px solid rgba(96, 165, 250, 0.18) !important;
  background: #151821 !important;
  padding: 4px !important;
}

body .s360-chat-layer .s360-chat-window-tab,
#system360-app .s360-chat-layer .s360-chat-window-tab {
  min-height: 38px !important;
  border-radius: 12px !important;
  color: #8ea0c4 !important;
  font-weight: 850 !important;
}

body .s360-chat-layer .s360-chat-window-tab.active,
#system360-app .s360-chat-layer .s360-chat-window-tab.active {
  color: #fff !important;
  background: linear-gradient(135deg, #3862f6 0%, #885cf6 55%, #ec4899 100%) !important;
  box-shadow: 0 14px 30px rgba(94, 92, 246, 0.28), 0 0 28px rgba(236, 72, 153, 0.16) !important;
}

body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
#system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
  grid-template-columns: 304px minmax(420px, 1fr) 296px !important;
  gap: 14px !important;
  padding: 14px 16px 16px !important;
  background: #0b0b0f !important;
}

body .s360-chat-layer .s360-chat-window-directory,
body .s360-chat-layer .s360-chat-window-main,
body .s360-chat-layer .s360-chat-launcher-info,
#system360-app .s360-chat-layer .s360-chat-window-directory,
#system360-app .s360-chat-layer .s360-chat-window-main,
#system360-app .s360-chat-layer .s360-chat-launcher-info {
  border-radius: 18px !important;
  border: 1px solid rgba(96, 165, 250, 0.16) !important;
  background: linear-gradient(180deg, #151821 0%, #10131c 100%) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.18) !important;
}

body .s360-chat-layer .s360-chat-user-status,
#system360-app .s360-chat-layer .s360-chat-user-status {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) 94px !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 12px !important;
  padding: 12px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(96, 165, 250, 0.18) !important;
  background: #1c1f2a !important;
}

body .s360-chat-layer .s360-chat-user-status > span,
#system360-app .s360-chat-layer .s360-chat-user-status > span {
  position: relative !important;
  width: 40px !important;
  height: 40px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #3862f6, #885cf6 56%, #ec4899) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

body .s360-chat-layer .s360-chat-user-status i,
#system360-app .s360-chat-layer .s360-chat-user-status i {
  position: absolute !important;
  right: -2px !important;
  bottom: -2px !important;
  width: 12px !important;
  height: 12px !important;
  border: 2px solid #151821 !important;
  border-radius: 999px !important;
  background: #22c55e !important;
}

body .s360-chat-layer .s360-chat-user-status.is-busy i,
#system360-app .s360-chat-layer .s360-chat-user-status.is-busy i { background: #ef4444 !important; }
body .s360-chat-layer .s360-chat-user-status.is-away i,
#system360-app .s360-chat-layer .s360-chat-user-status.is-away i { background: #f59e0b !important; }
body .s360-chat-layer .s360-chat-user-status.is-offline i,
#system360-app .s360-chat-layer .s360-chat-user-status.is-offline i { background: #64748b !important; }

body .s360-chat-layer .s360-chat-user-status strong,
#system360-app .s360-chat-layer .s360-chat-user-status strong {
  color: #f8fbff !important;
  font-size: 13px !important;
}

body .s360-chat-layer .s360-chat-user-status small,
#system360-app .s360-chat-layer .s360-chat-user-status small {
  display: block !important;
  color: #91a4c4 !important;
  font-size: 11px !important;
}

body .s360-chat-layer .s360-chat-user-status select,
#system360-app .s360-chat-layer .s360-chat-user-status select {
  width: 100% !important;
  height: 32px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(96, 165, 250, 0.18) !important;
  background: #0f1320 !important;
  color: #cfe0ff !important;
  font-size: 11px !important;
}

body .s360-chat-layer .s360-chat-directory-item,
#system360-app .s360-chat-layer .s360-chat-directory-item {
  min-height: 58px !important;
  margin-bottom: 4px !important;
  border-radius: 14px !important;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background 180ms ease !important;
}

body .s360-chat-layer .s360-chat-directory-item:hover,
body .s360-chat-layer .s360-chat-directory-item.active,
#system360-app .s360-chat-layer .s360-chat-directory-item:hover,
#system360-app .s360-chat-layer .s360-chat-directory-item.active {
  transform: translateY(-1px) !important;
  background: linear-gradient(135deg, rgba(56, 98, 246, 0.32), rgba(136, 92, 246, 0.24) 56%, rgba(236, 72, 153, 0.22)) !important;
  border-color: rgba(139, 92, 246, 0.56) !important;
  box-shadow: 0 0 26px rgba(99, 102, 241, 0.18) !important;
}

body .s360-chat-layer .s360-chat-active,
#system360-app .s360-chat-layer .s360-chat-active {
  grid-template-rows: auto auto minmax(0, 1fr) auto auto !important;
  padding: 16px !important;
  position: relative !important;
}

body .s360-chat-layer .s360-chat-active.is-drag-over::after,
#system360-app .s360-chat-layer .s360-chat-active.is-drag-over::after {
  content: "Suelta el archivo para adjuntarlo al chat" !important;
  position: absolute !important;
  inset: 16px !important;
  z-index: 4 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px dashed rgba(236, 72, 153, 0.72) !important;
  border-radius: 18px !important;
  background: rgba(11, 11, 15, 0.82) !important;
  color: #fff !important;
  font-weight: 900 !important;
  backdrop-filter: blur(10px) !important;
}

body .s360-chat-layer .s360-chat-pinned-strip,
#system360-app .s360-chat-layer .s360-chat-pinned-strip {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  padding-bottom: 2px !important;
}

body .s360-chat-layer .s360-chat-pinned-strip button,
#system360-app .s360-chat-layer .s360-chat-pinned-strip button {
  flex: 0 0 auto !important;
  max-width: 260px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  border: 1px solid rgba(236, 72, 153, 0.26) !important;
  border-radius: 999px !important;
  background: rgba(236, 72, 153, 0.08) !important;
  color: #f6d8ff !important;
  padding: 7px 10px !important;
  font-size: 12px !important;
}

body .s360-chat-layer .s360-chat-bubble,
#system360-app .s360-chat-layer .s360-chat-bubble {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  gap: 10px !important;
  max-width: 82% !important;
  margin: 12px 0 !important;
  animation: s360ChatMessageIn 220ms ease both !important;
}

body .s360-chat-layer .s360-chat-bubble.is-mine,
#system360-app .s360-chat-layer .s360-chat-bubble.is-mine {
  margin-left: auto !important;
}

body .s360-chat-layer .s360-chat-bubble-avatar,
#system360-app .s360-chat-layer .s360-chat-bubble-avatar {
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 13px !important;
  background: #1c1f2a !important;
  color: #dce8ff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

body .s360-chat-layer .s360-chat-bubble-card,
#system360-app .s360-chat-layer .s360-chat-bubble-card {
  position: relative !important;
  padding: 12px 13px !important;
  border: 1px solid rgba(96, 165, 250, 0.14) !important;
  border-radius: 16px !important;
  background: #1c1f2a !important;
}

body .s360-chat-layer .s360-chat-bubble.is-mine .s360-chat-bubble-card,
#system360-app .s360-chat-layer .s360-chat-bubble.is-mine .s360-chat-bubble-card {
  background: linear-gradient(135deg, rgba(56, 98, 246, 0.34), rgba(136, 92, 246, 0.28) 58%, rgba(236, 72, 153, 0.24)) !important;
  border-color: rgba(139, 92, 246, 0.44) !important;
}

body .s360-chat-layer .s360-chat-bubble-head,
#system360-app .s360-chat-layer .s360-chat-bubble-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

body .s360-chat-layer .s360-chat-bubble-head strong,
#system360-app .s360-chat-layer .s360-chat-bubble-head strong {
  color: #fff !important;
}

body .s360-chat-layer .s360-chat-bubble-head span,
#system360-app .s360-chat-layer .s360-chat-bubble-head span {
  color: #90a3c2 !important;
  font-size: 11px !important;
}

body .s360-chat-layer .s360-chat-bubble p,
#system360-app .s360-chat-layer .s360-chat-bubble p {
  color: #dce8ff !important;
  line-height: 1.45 !important;
}

body .s360-chat-layer .s360-chat-bubble a,
#system360-app .s360-chat-layer .s360-chat-bubble a {
  color: #93c5fd !important;
}

body .s360-chat-layer .s360-chat-bubble-actions,
#system360-app .s360-chat-layer .s360-chat-bubble-actions {
  display: flex !important;
  gap: 5px !important;
  margin-top: 9px !important;
  opacity: 0 !important;
  transform: translateY(4px) !important;
  transition: opacity 180ms ease, transform 180ms ease !important;
}

body .s360-chat-layer .s360-chat-bubble:hover .s360-chat-bubble-actions,
#system360-app .s360-chat-layer .s360-chat-bubble:hover .s360-chat-bubble-actions {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

body .s360-chat-layer .s360-chat-bubble-actions button,
body .s360-chat-layer .s360-chat-reaction-row button,
#system360-app .s360-chat-layer .s360-chat-bubble-actions button,
#system360-app .s360-chat-layer .s360-chat-reaction-row button {
  min-width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  background: rgba(11, 11, 15, 0.68) !important;
  color: #dce8ff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
}

body .s360-chat-layer .s360-chat-reaction-row,
#system360-app .s360-chat-layer .s360-chat-reaction-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-top: 8px !important;
}

body .s360-chat-layer .s360-chat-file-card,
#system360-app .s360-chat-layer .s360-chat-file-card {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  border-radius: 14px !important;
  border: 1px solid rgba(96, 165, 250, 0.2) !important;
  background: rgba(11, 11, 15, 0.44) !important;
}

body .s360-chat-layer .s360-chat-file-icon,
#system360-app .s360-chat-layer .s360-chat-file-icon {
  width: 40px !important;
  height: 40px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #3862f6, #885cf6) !important;
  color: #fff !important;
}

body .s360-chat-layer .s360-chat-file-input,
#system360-app .s360-chat-layer .s360-chat-file-input {
  display: none !important;
}

body .s360-chat-layer .s360-chat-upload-state,
#system360-app .s360-chat-layer .s360-chat-upload-state {
  grid-column: 1 / -1 !important;
  padding: 8px 10px !important;
  border-radius: 12px !important;
  background: rgba(56, 98, 246, 0.14) !important;
  color: #cfe0ff !important;
  font-size: 12px !important;
}

body .s360-chat-layer .s360-chat-active-search,
#system360-app .s360-chat-layer .s360-chat-active-search {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 118px 42px !important;
  gap: 8px !important;
  padding: 10px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(96, 165, 250, 0.14) !important;
  background: rgba(21, 24, 33, 0.82) !important;
}

body .s360-chat-layer .s360-chat-active-search > button,
#system360-app .s360-chat-layer .s360-chat-active-search > button {
  border: 0 !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: linear-gradient(135deg, #3862f6, #885cf6 55%, #ec4899) !important;
}

body .s360-chat-layer .s360-chat-search-results,
#system360-app .s360-chat-layer .s360-chat-search-results {
  grid-column: 1 / -1 !important;
  display: grid !important;
  gap: 7px !important;
  max-height: 170px !important;
  overflow: auto !important;
}

body .s360-chat-layer .s360-chat-search-results button,
body .s360-chat-layer .s360-chat-search-results .s360-chat-search-item,
#system360-app .s360-chat-layer .s360-chat-search-results button,
#system360-app .s360-chat-layer .s360-chat-search-results .s360-chat-search-item {
  border-radius: 12px !important;
  border: 1px solid rgba(96, 165, 250, 0.14) !important;
  background: #10131c !important;
  color: #dce8ff !important;
  padding: 9px 10px !important;
}

body .s360-chat-layer .s360-chat-typing-indicator,
#system360-app .s360-chat-layer .s360-chat-typing-indicator {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  margin: 8px 0 !important;
  color: #a9b7d5 !important;
  font-size: 12px !important;
}

body .s360-chat-layer .s360-chat-typing-indicator i,
#system360-app .s360-chat-layer .s360-chat-typing-indicator i {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #a78bfa !important;
  animation: s360ChatTyping 900ms ease-in-out infinite !important;
}

body .s360-chat-layer .s360-chat-typing-indicator i:nth-child(2),
#system360-app .s360-chat-layer .s360-chat-typing-indicator i:nth-child(2) { animation-delay: 120ms !important; }
body .s360-chat-layer .s360-chat-typing-indicator i:nth-child(3),
#system360-app .s360-chat-layer .s360-chat-typing-indicator i:nth-child(3) { animation-delay: 240ms !important; }

body .s360-chat-layer .s360-chat-info-section,
#system360-app .s360-chat-layer .s360-chat-info-section {
  display: grid !important;
  gap: 8px !important;
  padding: 12px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(96, 165, 250, 0.14) !important;
  background: #151821 !important;
}

body .s360-chat-layer .s360-chat-info-section > strong,
#system360-app .s360-chat-layer .s360-chat-info-section > strong {
  color: #fff !important;
  font-size: 13px !important;
}

body .s360-chat-layer .s360-chat-info-section :is(button, a),
#system360-app .s360-chat-layer .s360-chat-info-section :is(button, a) {
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: rgba(28, 31, 42, 0.92) !important;
  color: #cfe0ff !important;
  padding: 8px 10px !important;
  text-align: left !important;
  text-decoration: none !important;
}

body .s360-chat-layer .s360-chat-member-row,
#system360-app .s360-chat-layer .s360-chat-member-row {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: center !important;
}

body .s360-chat-layer .s360-chat-member-row > span,
#system360-app .s360-chat-layer .s360-chat-member-row > span {
  position: relative !important;
  width: 32px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 11px !important;
  background: #1c1f2a !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

body .s360-chat-layer .s360-chat-member-row i,
#system360-app .s360-chat-layer .s360-chat-member-row i {
  position: absolute !important;
  right: -2px !important;
  bottom: -2px !important;
  width: 9px !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: #64748b !important;
  border: 2px solid #151821 !important;
}

body .s360-chat-layer .s360-chat-member-row i.is-online,
#system360-app .s360-chat-layer .s360-chat-member-row i.is-online {
  background: #22c55e !important;
}

body .s360-chat-layer .s360-chat-member-row b,
#system360-app .s360-chat-layer .s360-chat-member-row b {
  display: block !important;
  color: #f8fbff !important;
  font-size: 12px !important;
}

body .s360-chat-layer .s360-chat-member-row small,
body .s360-chat-layer .s360-chat-info-section small,
#system360-app .s360-chat-layer .s360-chat-member-row small,
#system360-app .s360-chat-layer .s360-chat-info-section small {
  color: #91a4c4 !important;
  font-size: 11px !important;
}

@keyframes s360ChatMessageIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes s360ChatTyping {
  0%, 100% { opacity: 0.35; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(-3px); }
}

@media (max-width: 1100px) {
  body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
    grid-template-columns: 292px minmax(0, 1fr) !important;
  }

  body .s360-chat-layer .s360-chat-launcher-info,
  #system360-app .s360-chat-layer .s360-chat-launcher-info {
    display: none !important;
  }
}

@media (max-width: 760px) {
  body .s360-chat-layer .s360-chat-window.is-launcher,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher {
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-width: 0 !important;
    min-height: 0 !important;
    border-radius: 0 !important;
  }

  body .s360-chat-layer .s360-chat-window-nav,
  #system360-app .s360-chat-layer .s360-chat-window-nav,
  body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
    grid-template-columns: 1fr !important;
  }

  body .s360-chat-layer .s360-chat-window-directory,
  #system360-app .s360-chat-layer .s360-chat-window-directory {
    max-height: 250px !important;
  }

  body .s360-chat-layer .s360-chat-bubble,
  #system360-app .s360-chat-layer .s360-chat-bubble {
    max-width: 96% !important;
  }
}

/* ===== System 360 Light Mode ===== */
#system360-app.s360-theme-light {
  --s360-light-bg: #eef4fb;
  --s360-light-surface: rgba(255, 255, 255, .88);
  --s360-light-surface-strong: rgba(255, 255, 255, .96);
  --s360-light-surface-soft: rgba(246, 250, 255, .82);
  --s360-light-border: rgba(145, 166, 196, .48);
  --s360-light-border-strong: rgba(112, 135, 170, .62);
  --s360-light-text: #102033;
  --s360-light-muted: #5a6d84;
  --s360-light-accent: #2463d8;
  --s360-light-shadow: 0 18px 44px rgba(43, 70, 108, .14);
  color-scheme: light !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system {
  color-scheme: light !important;
  color: var(--s360-light-text) !important;
  background:
    radial-gradient(1000px 520px at -10% -10%, rgba(83, 154, 255, .22), transparent 62%),
    radial-gradient(760px 480px at 112% 108%, rgba(35, 197, 143, .16), transparent 60%),
    linear-gradient(145deg, #f7fbff 0%, #eaf2fb 52%, #dfeaf6 100%) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-shell, .s360-topbar, .s360-sidebar, .s360-panel, .s360-card, .s360-box, .s360-modal, .s360-dropdown, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-table-panel, .s360-atc-subtable, .s360-atcdb-config, .s360-quality-table-panel, .s360-home-sidebar-card, .s360-form360-side-legacy) {
  border-color: var(--s360-light-border) !important;
  background: linear-gradient(180deg, var(--s360-light-surface-strong), var(--s360-light-surface)) !important;
  color: var(--s360-light-text) !important;
  box-shadow: var(--s360-light-shadow) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-sidebar, .s360-topbar.s360-topbar-macos) {
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: 0 16px 38px rgba(47, 73, 110, .16), inset 0 1px 0 rgba(255, 255, 255, .92) !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-sidebar::before {
  background:
    radial-gradient(80% 52% at 0% 0%, rgba(36, 99, 216, .12), transparent 68%),
    radial-gradient(72% 44% at 100% 100%, rgba(20, 184, 166, .1), transparent 66%) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-title-text, h1, h2, h3, h4, h5, h6, strong, .v, .s360-panel-headline h3, .s360-card .v) {
  color: var(--s360-light-text) !important;
  -webkit-text-fill-color: var(--s360-light-text) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-muted, small, .k, .s360-panel-headline p, .s360-card .k, .s360-label, .meta, .s360-topbar-user, .s360-live-datetime) {
  color: var(--s360-light-muted) !important;
  -webkit-text-fill-color: var(--s360-light-muted) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-brand-logo, .s360-brand-logo-full, .s360-brand-logo-short) {
  filter: invert(1) hue-rotate(180deg) brightness(.55) contrast(1.25) !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-nav-section-label {
  color: #6b7f96 !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-nav-item {
  color: #43566d !important;
  background: transparent !important;
  border-color: transparent !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-nav-item:hover {
  color: #173b66 !important;
  border-color: rgba(93, 126, 176, .45) !important;
  background: linear-gradient(180deg, rgba(247, 251, 255, .96), rgba(230, 240, 253, .9)) !important;
  box-shadow: 0 8px 18px rgba(31, 83, 148, .12) !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-nav-item.active,
#system360-app.s360-theme-light .s360-app-system .s360-nav-item.s360-sub-item.active {
  color: #073f83 !important;
  border-color: rgba(36, 99, 216, .48) !important;
  background: linear-gradient(180deg, rgba(220, 235, 255, .98), rgba(190, 218, 255, .9)) !important;
  box-shadow: 0 10px 24px rgba(36, 99, 216, .18) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-icon-btn, .s360-btn, button, .s360-live-time, .s360-badge, .s360-pill, .s360-folder-tab, .s360-drop-btn, .s360-filter-btn, .s360-db360-filter-btn, .s360-db360-date-menu summary) {
  border-color: var(--s360-light-border) !important;
  background: linear-gradient(180deg, #ffffff, #edf5ff) !important;
  color: #14385f !important;
  -webkit-text-fill-color: #14385f !important;
  box-shadow: 0 5px 14px rgba(39, 83, 146, .12) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-btn.ok, .s360-folder-tab.active, .s360-folder-tab.is-active, .s360-view-tab.active, .s360-btn.sale) {
  border-color: rgba(36, 99, 216, .52) !important;
  background: linear-gradient(180deg, #e9f2ff, #cfe3ff) !important;
  color: #073f83 !important;
  -webkit-text-fill-color: #073f83 !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-btn.danger {
  border-color: rgba(220, 38, 38, .42) !important;
  background: linear-gradient(180deg, #fff1f2, #ffe0e4) !important;
  color: #9f1239 !important;
  -webkit-text-fill-color: #9f1239 !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-btn.warn {
  border-color: rgba(217, 119, 6, .42) !important;
  background: linear-gradient(180deg, #fff8eb, #ffe8bd) !important;
  color: #8a4b05 !important;
  -webkit-text-fill-color: #8a4b05 !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea) {
  border-color: var(--s360-light-border-strong) !important;
  background: #ffffff !important;
  color: #13283f !important;
  -webkit-text-fill-color: #13283f !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92), 0 3px 10px rgba(38, 70, 105, .07) !important;
  color-scheme: light !important;
}

#system360-app.s360-theme-light .s360-app-system :is(input, textarea)::placeholder {
  color: #8191a6 !important;
  -webkit-text-fill-color: #8191a6 !important;
}

#system360-app.s360-theme-light .s360-app-system select option {
  background: #ffffff !important;
  color: #13283f !important;
}

#system360-app.s360-theme-light .s360-app-system :is(table, .s360-table-sales, .s360-db360-table) {
  background: #ffffff !important;
  color: var(--s360-light-text) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(table, .s360-table-sales, .s360-db360-table) thead th {
  background: #e8f1fc !important;
  color: #1f3854 !important;
  border-bottom-color: rgba(113, 136, 166, .46) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(table, .s360-table-sales, .s360-db360-table) tbody td {
  background: rgba(255, 255, 255, .96) !important;
  color: #182f49 !important;
  border-bottom-color: rgba(178, 193, 214, .58) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(table, .s360-table-sales, .s360-db360-table) tbody tr:nth-child(even) td {
  background: rgba(246, 250, 255, .96) !important;
}

#system360-app.s360-theme-light .s360-app-system :is(table, .s360-table-sales, .s360-db360-table) tbody tr:hover td {
  background: #eaf3ff !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-alert, .s360-ok) {
  background: #ecfdf5 !important;
  border-color: rgba(16, 185, 129, .32) !important;
  color: #075f3f !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-error {
  background: #fff1f2 !important;
  border-color: rgba(244, 63, 94, .32) !important;
  color: #9f1239 !important;
}

#system360-app.s360-theme-light .s360-app-system :is(.s360-loading-layer, .s360-modal-bg, .s360-message-popup-backdrop) {
  background: rgba(227, 236, 248, .72) !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-message-popup,
#system360-app.s360-theme-light .s360-app-system .s360-add-member-popup,
#system360-app.s360-theme-light .s360-app-system .s360-dependent-popup {
  background: linear-gradient(180deg, #ffffff, #f2f7ff) !important;
  border-color: rgba(135, 157, 190, .58) !important;
  color: var(--s360-light-text) !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-wz-med-row,
#system360-app.s360-theme-light .s360-app-system .s360-add-dependent-pane[data-add-dependent-pane="historial"] {
  background: linear-gradient(180deg, #ffffff, #f6faff) !important;
  border-color: rgba(145, 166, 196, .52) !important;
  color: var(--s360-light-text) !important;
}

#system360-app.s360-theme-light .s360-app-system .s360-topbar-loader {
  background: #ffffff !important;
  border-color: rgba(112, 135, 170, .56) !important;
  color: #173b66 !important;
}

body.system360-fullscreen-page {
  background: #0f172a !important;
  color: var(--s360-ink);
}

body.system360-client-portal-page {
  background: url("https://static.wixstatic.com/media/ddf669_5cc977fd054b461688d04b2e7ca24e13~mv2.png") center center / cover no-repeat fixed !important;
  color: var(--s360-ink);
}

#system360-app .s360-app.s360-app-login {
  background: url("https://static.wixstatic.com/media/ddf669_32863d411267453195064f0b4b883d28~mv2.png") center center / cover no-repeat fixed !important;
}

#system360-app .s360-app.s360-app-system {
  background: url("https://static.wixstatic.com/media/ddf669_5cc977fd054b461688d04b2e7ca24e13~mv2.png") center center / cover no-repeat fixed !important;
}

#system360-client-portal {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

#system360-app,
#system360-client-portal,
#s360c-popup-root,
#s360c-advisor-popup-root,
#s360c-contact-popup-root,
.s360-wrap {
  color: var(--s360-ink);
  font-family: var(--s360-font-ui) !important;
}

#system360-app :is(h1, h2, h3, h4, h5, h6),
#system360-client-portal :is(h1, h2, h3, h4, h5, h6),
#s360c-popup-root :is(h1, h2, h3, h4, h5, h6),
#s360c-advisor-popup-root :is(h1, h2, h3, h4, h5, h6),
#s360c-contact-popup-root :is(h1, h2, h3, h4, h5, h6),
.s360-wrap :is(h1, h2, h3, h4, h5, h6) {
  color: var(--s360-ink) !important;
  letter-spacing: -0.018em !important;
  font-weight: 640 !important;
}

/* Core glass surfaces */
#system360-app :is(
  .s360-shell, .s360-sidebar, .s360-topbar, .s360-panel, .s360-card, .s360-box, .s360-modal, .s360-dropdown,
  [class$="-card"], [class*="-card "], [class$="-panel"], [class*="-panel "], [class$="-box"], [class*="-box "],
  [class$="-shell"], [class*="-shell "], [class$="-modal"], [class*="-modal "], [class$="-dropdown"], [class*="-dropdown "]
),
#system360-client-portal :is(
  .s360c-wrap, .s360c-wrap-officev2, .s360c-card, .s360c-process-card, .s360c-status-box, .s360c-advisor-box,
  .s360c-office-card, .s360c-office-panel, .s360c-officev2-shell, .s360c-officev2-sidebar, .s360c-officev2-header,
  .s360c-officev2-card, .s360c-popup, .s360c-popup-body, .s360c-advisor-popup, .s360c-advisor-popup-body,
  .s360c-contact-popup, .s360c-contact-popup-body, .s360c-doc-preview-body, .s360c-nextflow-menu,
  [class$="-card"], [class*="-card "], [class$="-panel"], [class*="-panel "], [class$="-box"], [class*="-box "],
  [class$="-shell"], [class*="-shell "], [class$="-modal"], [class*="-modal "], [class$="-popup"], [class*="-popup "],
  [class$="-dropdown"], [class*="-dropdown "]
),
#s360c-popup-root :is(.s360c-popup, .s360c-popup-body, .s360c-pop-card, .s360c-upload-shell, .s360c-upload-drop, .s360c-upload-file),
#s360c-advisor-popup-root :is(.s360c-advisor-popup, .s360c-advisor-popup-body),
#s360c-contact-popup-root :is(.s360c-contact-popup, .s360c-contact-popup-body),
.s360-wrap :is(.s360-topbar, .s360-sidebar, .s360-card, .s360-box) {
  border: 1px solid var(--s360-line) !important;
  border-radius: var(--s360-radius-md) !important;
  background: linear-gradient(160deg, var(--s360-glass-strong), var(--s360-glass)) !important;
  box-shadow: var(--s360-shadow-soft) !important;
  backdrop-filter: blur(18px) saturate(145%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(145%) !important;
}

#system360-app :is(.s360-shell),
#system360-client-portal :is(.s360c-wrap, .s360c-wrap-officev2),
.s360-wrap {
  border-radius: var(--s360-radius-lg) !important;
  box-shadow: var(--s360-shadow) !important;
}

/* Remove heavy container-over-container effect */
#system360-app :is(.s360-panel, .s360-card, .s360-box, .s360-modal, .s360-dropdown, .s360-shell, .s360-sidebar) :is(
  .s360-panel, .s360-card, .s360-box, .s360-modal, .s360-dropdown,
  [class$="-card"], [class*="-card "], [class$="-panel"], [class*="-panel "], [class$="-box"], [class*="-box "]
),
#system360-client-portal :is(.s360c-card, .s360c-process-card, .s360c-office-card, .s360c-office-panel, .s360c-officev2-card, .s360c-popup, .s360c-popup-body, .s360c-wrap, .s360c-wrap-officev2) :is(
  .s360c-card, .s360c-process-card, .s360c-office-card, .s360c-office-panel, .s360c-officev2-card,
  .s360c-popup, .s360c-popup-body, [class$="-card"], [class*="-card "], [class$="-panel"], [class*="-panel "]
),
.s360-wrap :is(.s360-card, .s360-box, .s360-sidebar, .s360-topbar) :is(.s360-card, .s360-box) {
  background: var(--s360-glass-nested) !important;
  border-color: var(--s360-line-soft) !important;
  box-shadow: none !important;
  backdrop-filter: blur(10px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(120%) !important;
}

#system360-app :is(.s360-sidebar, .s360-topbar),
#system360-client-portal :is(.s360c-officev2-sidebar, .s360c-officev2-header),
.s360-wrap :is(.s360-sidebar, .s360-topbar) {
  border-radius: var(--s360-radius-lg) !important;
}

/* Buttons */
#system360-app :is(.s360-btn, .s360-icon-btn, .s360-chat-btn, .s360-drop-btn, .button, button),
#system360-client-portal :is(.s360c-btn, .s360c-btn-sec, .s360c-officev2-btn, .s360c-office-download, button),
#s360c-popup-root :is(.s360c-btn, .s360c-btn-sec, button),
#s360c-advisor-popup-root :is(.s360c-btn, .s360c-btn-sec, button),
#s360c-contact-popup-root :is(.s360c-btn, .s360c-btn-sec, button),
.s360-wrap :is(.button, button, input[type="button"], input[type="submit"]) {
  border: 1px solid rgba(109, 145, 196, 0.58) !important;
  border-radius: 13px !important;
  color: #123e70 !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.92), rgba(226, 238, 255, 0.84)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94), 0 5px 12px rgba(31, 96, 186, 0.16) !important;
}

#system360-app :is(.s360-btn.ok, .s360-quality-approve, #s360-confirm-ok),
#system360-client-portal :is(.s360c-nextflow-done, .s360c-officev2-btn:not(.s360c-officev2-btn-danger)) {
  color: #0e5732 !important;
  border-color: rgba(34, 162, 91, 0.52) !important;
  background: linear-gradient(160deg, rgba(243, 255, 248, 0.96), rgba(199, 242, 218, 0.9)) !important;
}

#system360-app :is(.s360-btn.warn),
#system360-client-portal :is(.s360c-btn-warn) {
  color: #7b4d03 !important;
  border-color: rgba(210, 138, 23, 0.5) !important;
  background: linear-gradient(160deg, rgba(255, 247, 232, 0.96), rgba(247, 223, 174, 0.9)) !important;
}

#system360-app :is(.s360-btn.danger, .s360-quality-reject, #s360-confirm-cancel),
#system360-client-portal :is(.s360c-officev2-btn-danger) {
  color: #89263a !important;
  border-color: rgba(204, 76, 98, 0.52) !important;
  background: linear-gradient(160deg, rgba(255, 241, 244, 0.96), rgba(246, 203, 213, 0.9)) !important;
}

/* Inputs */
#system360-app :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea),
#system360-client-portal :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea),
#s360c-popup-root :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea),
#s360c-advisor-popup-root :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea),
#s360c-contact-popup-root :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea),
.s360-wrap :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea) {
  border: 1px solid rgba(119, 156, 208, 0.54) !important;
  border-radius: 12px !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.94), rgba(240, 247, 255, 0.86)) !important;
  box-shadow: inset 0 1px 2px rgba(16, 40, 74, 0.05) !important;
  color: var(--s360-ink) !important;
}

#system360-app :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea):focus,
#system360-client-portal :is(input, select, textarea):focus,
#s360c-popup-root :is(input, select, textarea):focus,
#s360c-advisor-popup-root :is(input, select, textarea):focus,
#s360c-contact-popup-root :is(input, select, textarea):focus,
.s360-wrap :is(input, select, textarea):focus {
  outline: none !important;
  border-color: rgba(37, 115, 227, 0.84) !important;
  box-shadow: 0 0 0 3px rgba(37, 115, 227, 0.2), inset 0 1px 2px rgba(16, 40, 74, 0.06) !important;
}

#system360-app :is(input[type="checkbox"], input[type="radio"]),
#system360-client-portal :is(input[type="checkbox"], input[type="radio"]),
#s360c-popup-root :is(input[type="checkbox"], input[type="radio"]),
#s360c-advisor-popup-root :is(input[type="checkbox"], input[type="radio"]),
#s360c-contact-popup-root :is(input[type="checkbox"], input[type="radio"]),
.s360-wrap :is(input[type="checkbox"], input[type="radio"]) {
  accent-color: var(--s360-accent);
}

/* Tables */
#system360-app :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table),
#system360-client-portal :is(table, .s360c-officev2-table-wrap table),
#s360c-popup-root table,
#s360c-advisor-popup-root table,
#s360c-contact-popup-root table,
.s360-wrap :is(table, .widefat) {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid rgba(126, 161, 208, 0.48) !important;
  border-radius: 13px !important;
  background: rgba(255, 255, 255, 0.68) !important;
}

#system360-app :is(table th, table td, .s360-table th, .s360-table td, .s360-table-follow th, .s360-table-follow td, .s360-table-sales th, .s360-table-sales td),
#system360-client-portal :is(table th, table td, .s360c-officev2-table-wrap th, .s360c-officev2-table-wrap td),
#s360c-popup-root :is(table th, table td),
#s360c-advisor-popup-root :is(table th, table td),
#s360c-contact-popup-root :is(table th, table td),
.s360-wrap :is(table th, table td, .widefat th, .widefat td) {
  border-bottom: 1px solid rgba(152, 184, 224, 0.4) !important;
}

#system360-app :is(table th, .s360-table th, .s360-table-follow th, .s360-table-sales th),
#system360-client-portal :is(table th, .s360c-officev2-table-wrap th),
#s360c-popup-root table th,
#s360c-advisor-popup-root table th,
#s360c-contact-popup-root table th,
.s360-wrap :is(table th, .widefat th) {
  background: linear-gradient(180deg, rgba(247, 251, 255, 0.95), rgba(231, 243, 255, 0.84)) !important;
  color: #335677 !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 12px;
}

/* Modals, popups */
#system360-app :is(.s360-modal-bg, .s360-mod-editor-modal-bg),
#system360-client-portal :is(.s360c-popup-backdrop, .s360c-contact-popup-backdrop, .s360c-advisor-popup-backdrop, .s360c-doc-preview-backdrop),
#s360c-popup-root .s360c-popup-backdrop,
#s360c-advisor-popup-root .s360c-advisor-popup-backdrop,
#s360c-contact-popup-root .s360c-contact-popup-backdrop {
  background: var(--s360-overlay) !important;
  backdrop-filter: blur(11px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(11px) saturate(125%) !important;
}

#system360-app :is(.s360-modal, .s360-mod-editor-modal),
#system360-client-portal :is(.s360c-popup, .s360c-advisor-popup, .s360c-contact-popup, .s360c-doc-preview-body),
#s360c-popup-root .s360c-popup,
#s360c-advisor-popup-root .s360c-advisor-popup,
#s360c-contact-popup-root .s360c-contact-popup {
  border: 1px solid rgba(134, 169, 214, 0.52) !important;
  border-radius: var(--s360-radius-lg) !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.82), rgba(242, 249, 255, 0.74)) !important;
  box-shadow: 0 18px 36px rgba(11, 35, 66, 0.2) !important;
}

#system360-app :is(.s360-modal-head),
#system360-client-portal :is(.s360c-popup-head, .s360c-advisor-popup-head, .s360c-contact-popup-head),
#s360c-popup-root .s360c-popup-head,
#s360c-advisor-popup-root .s360c-advisor-popup-head,
#s360c-contact-popup-root .s360c-contact-popup-head {
  border-bottom: 1px solid rgba(147, 180, 221, 0.42) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(243, 250, 255, 0.74)) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-modal-head.s360-form360-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border-bottom: 1px solid rgba(66, 95, 143, 0.44) !important;
  background: transparent !important;
  padding: 20px 22px 12px !important;
  color: #f4f8ff !important;
  overflow: visible !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-head > div {
  min-width: 0 !important;
  max-width: calc(100% - 52px) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-head h3 {
  margin: 0 !important;
  color: #f4f8ff !important;
  font-size: 24px !important;
  line-height: 1.12 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-head p {
  margin: 6px 0 0 !important;
  color: #97b3db !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  max-width: 720px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-breadcrumb {
  color: #9a6cff !important;
  font-weight: 700 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-modal-close {
  flex: 0 0 34px !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #d8e6ff !important;
  background: rgba(18, 35, 64, 0.78) !important;
  border: 1px solid rgba(89, 120, 175, 0.4) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 24px rgba(2, 6, 23, 0.18) !important;
  font-size: 24px !important;
  line-height: 1 !important;
  padding: 0 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body {
  max-height: calc(94dvh - 128px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-input-grid input[type="file"].s360-input {
  width: 100% !important;
  min-height: 44px !important;
  border: 1px solid rgba(67, 97, 149, 0.58) !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, rgba(11, 23, 46, 0.92), rgba(8, 18, 37, 0.88)) !important;
  color: #c9d9f3 !important;
  padding: 7px 9px !important;
  box-shadow: inset 0 1px 0 rgba(142, 171, 226, 0.1) !important;
  color-scheme: dark !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-input-grid input[type="file"].s360-input::file-selector-button {
  min-height: 28px !important;
  margin-right: 10px !important;
  border: 1px solid rgba(128, 103, 255, 0.58) !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, rgba(98, 61, 238, 0.72), rgba(33, 49, 95, 0.72)) !important;
  color: #f4f0ff !important;
  font-weight: 750 !important;
  cursor: default !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-upload .s360-form360-policy-head {
  align-items: center !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-head-copy {
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-clinic-btn {
  min-height: 34px !important;
  border: 1px solid rgba(128, 103, 255, 0.58) !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  background: linear-gradient(135deg, rgba(98, 61, 238, 0.72), rgba(33, 49, 95, 0.72)) !important;
  color: #f4f0ff !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-clinic-btn:hover {
  border-color: rgba(165, 142, 255, 0.72) !important;
  background: linear-gradient(135deg, rgba(117, 76, 255, 0.84), rgba(42, 62, 116, 0.84)) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-clinic-btn .s360-svg-icon {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 auto !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="4"] .s360-alert.info {
  border: 1px solid rgba(67, 97, 149, 0.5) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(10, 22, 44, 0.92), rgba(7, 17, 35, 0.88)) !important;
  color: #a9bddc !important;
  box-shadow: inset 0 1px 0 rgba(128, 157, 214, 0.1) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-table .s360-seguimientos-wrap {
  border: 1px solid rgba(67, 97, 149, 0.5) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(8, 19, 39, 0.92), rgba(6, 15, 31, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(128, 157, 214, 0.1) !important;
  overflow: hidden !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-table .s360-seguimientos-wrap > .s360-table {
  width: 100% !important;
  min-width: 100% !important;
  table-layout: auto !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-table .s360-table th {
  background: rgba(13, 30, 58, 0.96) !important;
  color: #aecaef !important;
  border-bottom: 1px solid rgba(67, 97, 149, 0.5) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-table .s360-table td {
  background: rgba(7, 17, 35, 0.76) !important;
  color: #d9e6fb !important;
  border-bottom: 1px solid rgba(53, 80, 124, 0.38) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-card {
  border: 1px solid rgba(54, 83, 132, 0.62) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(7, 18, 38, 0.92), rgba(6, 15, 31, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(128, 157, 214, 0.09) !important;
  padding: 18px 20px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-head {
  gap: 10px !important;
  margin-bottom: 22px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-head h4 {
  color: #f2f7ff !important;
  font-size: 18px !important;
  font-weight: 800 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-head p {
  color: #9fb7dd !important;
  font-size: 12px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-section-icon {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  border-radius: 6px !important;
  color: #8f78ff !important;
  background: linear-gradient(180deg, rgba(98, 61, 238, 0.24), rgba(40, 56, 129, 0.18)) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
  margin-bottom: 22px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field + .s360-form360-policy-field {
  border-left: 1px solid rgba(68, 98, 151, 0.42) !important;
  padding-left: 18px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field > span:not(.s360-form360-policy-control) {
  color: #9fb4d8 !important;
  font-size: 12px !important;
  font-weight: 760 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field b {
  color: #ff4f75 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-control {
  position: relative !important;
  display: block !important;
  min-width: 0 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-control i {
  position: absolute !important;
  z-index: 2 !important;
  left: 12px !important;
  top: 50% !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 999px !important;
  transform: translateY(-50%) !important;
  display: inline-grid !important;
  place-items: center !important;
  pointer-events: none !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-control i.is-purple {
  color: #9b72ff !important;
  background: rgba(104, 71, 255, 0.16) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-control i.is-magenta {
  color: #d653ff !important;
  background: rgba(214, 83, 255, 0.13) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-control i.is-green {
  color: #2ee885 !important;
  background: rgba(18, 185, 103, 0.15) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-input,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-select {
  min-height: 42px !important;
  width: 100% !important;
  border-radius: 8px !important;
  border: 1px solid rgba(65, 96, 150, 0.62) !important;
  background: linear-gradient(180deg, rgba(8, 18, 36, 0.94), rgba(6, 14, 29, 0.9)) !important;
  color: #f0f6ff !important;
  box-shadow: inset 0 1px 0 rgba(131, 161, 218, 0.09) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding-left: 44px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field small {
  color: #94aacd !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field small.is-success {
  color: #30dd7a !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-inline-link {
  color: #9b5cff !important;
  font-size: 12px !important;
  font-weight: 760 !important;
  text-decoration: none !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-product-details {
  border: 1px solid rgba(71, 101, 154, 0.52) !important;
  border-radius: 12px !important;
  background: rgba(8, 19, 39, 0.42) !important;
  padding: 12px !important;
  margin-bottom: 20px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-product-details header strong {
  color: #eef5ff !important;
  font-size: 12px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-product-toggle {
  color: #d7e4fb !important;
  display: inline-flex !important;
  transform: rotate(-90deg) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-product-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-product-grid > div {
  border: 1px solid rgba(67, 97, 146, 0.48) !important;
  border-radius: 9px !important;
  background: linear-gradient(180deg, rgba(10, 22, 44, 0.72), rgba(7, 17, 35, 0.72)) !important;
  padding: 13px 12px !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 7px 8px !important;
  align-items: center !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-product-grid span {
  color: #7b61ff !important;
  display: inline-flex !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-product-grid small {
  color: #a4b9dc !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-product-grid strong {
  color: #ffffff !important;
  font-size: 14px !important;
  grid-column: 1 / -1 !important;
  text-align: center !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-important-note {
  border: 1px solid rgba(113, 72, 225, 0.56) !important;
  border-radius: 12px !important;
  background: linear-gradient(90deg, rgba(49, 28, 111, 0.58), rgba(22, 26, 69, 0.5)) !important;
  padding: 14px 16px !important;
  gap: 12px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-important-note > span {
  color: #bd52ff !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-important-note strong {
  color: #f5ecff !important;
  font-size: 16px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-important-note p {
  color: #c2d3f0 !important;
  font-size: 12px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 18px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions .s360-btn {
  min-height: 42px !important;
  border-radius: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions .s360-btn.ghost {
  border: 1px solid rgba(58, 86, 137, 0.78) !important;
  background: linear-gradient(180deg, rgba(9, 21, 42, 0.94), rgba(6, 15, 31, 0.9)) !important;
  color: #cbd9f0 !important;
  box-shadow: none !important;
  padding: 0 16px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions .s360-btn.ghost:hover {
  border-color: rgba(112, 139, 198, 0.82) !important;
  background: linear-gradient(180deg, rgba(13, 29, 56, 0.98), rgba(8, 18, 37, 0.94)) !important;
  color: #eef5ff !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions [data-wz-jump="1"] {
  min-width: 128px !important;
  justify-content: flex-start !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions [data-modal-cancel] {
  min-width: 82px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions .s360-btn.ok.sale {
  min-width: 246px !important;
  border: 1px solid rgba(255, 106, 132, 0.18) !important;
  background: linear-gradient(100deg, #5a35f4 0%, #7c2df1 42%, #c335bc 72%, #ee4555 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 28px rgba(94, 58, 237, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
  padding: 0 18px !important;
  white-space: nowrap !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions .s360-btn.ok.sale:hover {
  filter: brightness(1.07) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions .s360-form360-back-icon {
  display: inline-flex !important;
  transform: rotate(180deg) !important;
}

@media (max-width: 980px) {
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-grid,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-product-grid,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-actions {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field + .s360-form360-policy-field {
    border-left: 0 !important;
    padding-left: 0 !important;
  }
}

/* Final Form360 top stepper container: buttons only, no wrapper chrome. */
#system360-app #s360-modal.s360-modal-form360 .s360-form360-steps.s360-wizard-tabs,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-steps.s360-wizard-tabs,
#s360-modal.s360-modal-form360 .s360-form360-steps.s360-wizard-tabs {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  gap: 8px !important;
}

/* Badges and pills */
#system360-app :is(.s360-badge, .s360-chip, .s360-pill, .s360-icon-badge, .s360-task-chip, .s360-task-area-chip, .s360-call-top-pill),
#system360-client-portal :is(.s360c-office-pill, .s360c-step-state-badge, .s360c-upload-file-badge, .s360c-advisor-badge, .s360c-wf-feed-pill),
#s360c-popup-root :is(.s360c-upload-file-badge, .s360c-step-state-badge),
#s360c-advisor-popup-root :is(.s360c-rate-tag) {
  border: 1px solid rgba(130, 165, 210, 0.52) !important;
  border-radius: 999px !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.86), rgba(229, 242, 255, 0.76)) !important;
}

#system360-client-portal .s360c-step-state-badge.is-pending,
#s360c-popup-root .s360c-step-state-badge.is-pending {
  border: 2px solid #ffffff !important;
  background: linear-gradient(180deg, #ffd84d 0%, #ffc21a 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 5px 12px rgba(245, 158, 11, 0.35) !important;
}

#system360-client-portal .s360c-step-state-badge.is-pending svg,
#s360c-popup-root .s360c-step-state-badge.is-pending svg {
  width: 15px !important;
  height: 15px !important;
  color: #ffffff !important;
}

#system360-client-portal .s360c-steps-shell {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-client-portal .s360c-steps-row {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

#system360-client-portal .s360c-steps-row::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

#system360-client-portal .s360c-status-box {
  border: 0 !important;
  background: linear-gradient(180deg, rgba(247, 249, 252, 0.94), rgba(238, 243, 248, 0.88)) !important;
  box-shadow: none !important;
}

#system360-client-portal .s360c-process-card h2 {
  color: #2f4f8f !important;
  -webkit-text-fill-color: #2f4f8f !important;
}

#system360-client-portal .s360c-advisor-box {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  grid-template-areas:
    "badge badge"
    "photo info" !important;
  align-items: center !important;
  column-gap: 12px !important;
  row-gap: 7px !important;
  overflow: hidden !important;
  container-type: inline-size !important;
}

#system360-client-portal .s360c-advisor-badge {
  grid-area: badge !important;
  display: inline-flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  padding: 8px 9px !important;
  margin: 0 !important;
  justify-self: start !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

#system360-client-portal .s360c-advisor-info {
  grid-area: info !important;
  min-width: 0 !important;
  margin-top: 0 !important;
  display: grid !important;
  justify-items: start !important;
  align-content: start !important;
  overflow: hidden !important;
}

#system360-client-portal .s360c-advisor-box > img {
  grid-area: photo !important;
  margin-top: 0 !important;
}

#system360-client-portal .s360c-advisor-info h3 {
  margin-top: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

#system360-client-portal .s360c-advisor-box.is-advisor-compact {
  grid-template-columns: 1fr !important;
  grid-template-areas:
    "badge"
    "photo"
    "info" !important;
  justify-items: start !important;
  align-items: center !important;
  row-gap: 6px !important;
  column-gap: 0 !important;
  padding: 10px !important;
  text-align: left !important;
}

#system360-client-portal .s360c-advisor-box.is-advisor-compact .s360c-advisor-badge {
  grid-area: badge !important;
}

#system360-client-portal .s360c-advisor-box.is-advisor-compact > img {
  grid-area: photo !important;
  width: 56px !important;
  height: 56px !important;
  justify-self: start !important;
  margin: 0 !important;
}

#system360-client-portal .s360c-advisor-box.is-advisor-compact .s360c-advisor-info {
  grid-area: info !important;
  width: 100% !important;
  justify-items: start !important;
  text-align: left !important;
}

#system360-client-portal .s360c-advisor-box.is-advisor-compact .s360c-advisor-badge {
  justify-self: start !important;
  margin: 0 !important;
  padding: 4px 6px !important;
  font-size: 8px !important;
  letter-spacing: 0 !important;
}

#system360-client-portal .s360c-advisor-box.is-advisor-compact .s360c-advisor-info h3 {
  width: 100% !important;
  margin: 0 0 4px !important;
  font-size: 16px !important;
  line-height: 1.05 !important;
  text-align: left !important;
  white-space: normal !important;
}

#system360-client-portal .s360c-advisor-box.is-advisor-compact .s360c-advisor-info p {
  width: 100% !important;
  margin: 0 !important;
  font-size: 10px !important;
  line-height: 1.16 !important;
  text-align: left !important;
}

@container (max-width: 260px) {
  #system360-client-portal .s360c-advisor-badge {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 4px 6px !important;
    font-size: 8px !important;
    letter-spacing: 0 !important;
  }

  #system360-client-portal .s360c-advisor-box > img {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    width: 56px !important;
    height: 56px !important;
    margin: 0 !important;
  }

  #system360-client-portal .s360c-advisor-info {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    width: 100% !important;
    justify-items: start !important;
    text-align: left !important;
    overflow: hidden !important;
  }

  #system360-client-portal .s360c-advisor-info h3 {
    width: 100% !important;
    margin: 0 0 4px !important;
    font-size: 16px !important;
    line-height: 1.05 !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  #system360-client-portal .s360c-advisor-info p {
    width: 100% !important;
    margin: 0 !important;
    font-size: 10px !important;
    line-height: 1.16 !important;
    text-align: left !important;
    overflow-wrap: anywhere !important;
  }
}

#system360-client-portal button.s360c-wa-float {
  right: 18px !important;
  bottom: calc(18px + env(safe-area-inset-bottom)) !important;
  width: min(255px, calc(100vw - 28px)) !important;
  min-height: 54px !important;
  padding: 8px 11px 8px 9px !important;
  border: 1.7px solid #4385e6 !important;
  border-radius: 26px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: #113b77 !important;
  box-shadow: 0 14px 28px rgba(37, 99, 235, 0.14) !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  text-align: left !important;
  animation: s360-wa-pop .35s ease-out both, s360-wa-float-loop 3.2s ease-in-out .45s infinite !important;
}

#system360-client-portal button.s360c-wa-float:hover {
  transform: translateY(-2px) !important;
  border-color: #2f75df !important;
  box-shadow: 0 18px 34px rgba(37, 99, 235, 0.2) !important;
  filter: none !important;
}

#system360-client-portal .s360c-wa-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 999px !important;
  background: radial-gradient(circle at 50% 50%, #ffffff 0 58%, #ecfdf3 59% 100%) !important;
  color: #22c55e !important;
  box-shadow: 0 7px 16px rgba(34, 197, 94, 0.14), inset 0 0 0 1.5px rgba(34, 197, 94, 0.16) !important;
}

#system360-client-portal .s360c-wa-icon svg {
  width: 27px !important;
  height: 27px !important;
  color: #22c55e !important;
}

#system360-client-portal .s360c-wa-copy {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
  line-height: 1.08 !important;
}

#system360-client-portal .s360c-wa-copy strong {
  color: #0e3b78 !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
}

#system360-client-portal .s360c-wa-copy small {
  color: #5f7191 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  opacity: 1 !important;
}

#system360-client-portal .s360c-wa-arrow {
  width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  background: rgba(34, 197, 94, 0.1) !important;
  color: #22c55e !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
}

#system360-client-portal .s360c-wa-arrow svg {
  width: 15px !important;
  height: 15px !important;
  display: block !important;
}

@media (max-width: 1180px) {
  #system360-client-portal .s360c-customer-strip {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 720px) {
  #system360-client-portal .s360c-advisor-box {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "badge"
      "photo"
      "info" !important;
    justify-items: start !important;
    column-gap: 0 !important;
    row-gap: 8px !important;
    padding: 12px !important;
    align-items: center !important;
    min-height: auto !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-align: left !important;
  }

  #system360-client-portal .s360c-advisor-badge {
    grid-area: badge !important;
    justify-self: start !important;
    margin: 0 !important;
    padding: 4px 6px !important;
    font-size: 8px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    letter-spacing: 0 !important;
  }

  #system360-client-portal .s360c-advisor-box > img {
    width: 64px !important;
    height: 64px !important;
    border-radius: 12px !important;
    margin-top: 0 !important;
    justify-self: start !important;
  }

  #system360-client-portal .s360c-advisor-info {
    width: 100% !important;
    min-width: 0 !important;
    margin-top: 0 !important;
    align-self: center !important;
    justify-items: start !important;
    text-align: left !important;
    gap: 1px !important;
    overflow: hidden !important;
  }

  #system360-client-portal .s360c-advisor-info h3 {
    width: 100% !important;
    font-size: clamp(14px, 4.8vw, 18px) !important;
    line-height: 1.04 !important;
    margin: 0 0 4px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    text-wrap: balance !important;
    text-align: left !important;
  }

  #system360-client-portal .s360c-advisor-info p {
    font-size: 10px !important;
    line-height: 1.16 !important;
    margin: 0 !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    text-align: left !important;
  }
}

@media (max-width: 520px) {
  #system360-client-portal button.s360c-wa-float {
    width: min(238px, calc(100vw - 24px)) !important;
    min-height: 50px !important;
    padding: 7px 10px 7px 8px !important;
    border-radius: 24px !important;
    gap: 7px !important;
  }

  #system360-client-portal .s360c-wa-icon {
    width: 34px !important;
    height: 34px !important;
  }

  #system360-client-portal .s360c-wa-icon svg {
    width: 25px !important;
    height: 25px !important;
  }

  #system360-client-portal .s360c-wa-copy strong {
    font-size: 17px !important;
  }

  #system360-client-portal .s360c-wa-copy small {
    font-size: 11px !important;
  }

  #system360-client-portal .s360c-wa-arrow {
    width: 26px !important;
    height: 26px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #system360-client-portal button.s360c-wa-float {
    animation: none !important;
  }
}

/* Smooth iOS-like loading */
#system360-app :is(.is-loading, [aria-busy="true"]),
#system360-client-portal :is(.is-loading, [aria-busy="true"]),
#s360c-popup-root :is(.is-loading, [aria-busy="true"]),
#s360c-advisor-popup-root :is(.is-loading, [aria-busy="true"]),
#s360c-contact-popup-root :is(.is-loading, [aria-busy="true"]),
.s360-wrap :is(.is-loading, [aria-busy="true"]) {
  position: relative;
}

#system360-app :is(.is-loading, [aria-busy="true"])::before,
#system360-client-portal :is(.is-loading, [aria-busy="true"])::before,
#s360c-popup-root :is(.is-loading, [aria-busy="true"])::before,
#s360c-advisor-popup-root :is(.is-loading, [aria-busy="true"])::before,
#s360c-contact-popup-root :is(.is-loading, [aria-busy="true"])::before,
.s360-wrap :is(.is-loading, [aria-busy="true"])::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
  border-radius: 50%;
  border: 2px solid rgba(24, 87, 167, 0.18);
  border-top-color: rgba(24, 87, 167, 0.88);
  border-right-color: rgba(24, 87, 167, 0.56);
  animation: s360-loader-spin 0.85s linear infinite;
}

#system360-app :is(button.is-loading, .s360-btn.is-loading, .s360-icon-btn.is-loading),
#system360-client-portal :is(button.is-loading, .s360c-btn.is-loading, .s360c-btn-sec.is-loading),
#s360c-popup-root :is(button.is-loading, .s360c-btn.is-loading, .s360c-btn-sec.is-loading),
#s360c-advisor-popup-root :is(button.is-loading, .s360c-btn.is-loading, .s360c-btn-sec.is-loading),
#s360c-contact-popup-root :is(button.is-loading, .s360c-btn.is-loading, .s360c-btn-sec.is-loading),
.s360-wrap :is(button.is-loading, .button.is-loading) {
  color: transparent !important;
}

#system360-app :is(.s360-skeleton-card, .s360-skeleton-panel, .s360-clock-skeleton-card, [class*="skeleton"]),
#system360-client-portal :is([class*="skeleton"]),
.s360-wrap :is([class*="skeleton"]) {
  position: relative;
  overflow: hidden;
}

#system360-app :is(.s360-skeleton-card, .s360-skeleton-panel, .s360-clock-skeleton-card, [class*="skeleton"])::after,
#system360-client-portal :is([class*="skeleton"])::after,
.s360-wrap :is([class*="skeleton"])::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(108deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.56), rgba(255, 255, 255, 0));
  animation: s360-shimmer 1.3s linear infinite;
}

/* Animation policy: keep only enter/exit */
#system360-app *,
#system360-client-portal *,
#s360c-popup-root *,
#s360c-advisor-popup-root *,
#s360c-contact-popup-root *,
.s360-wrap * {
  transition-property: none !important;
}

#system360-app :is(.s360-modal, .s360-dropdown, .s360-toast),
#system360-client-portal :is(.s360c-popup, .s360c-advisor-popup, .s360c-contact-popup, .s360c-nextflow-menu),
#s360c-popup-root .s360c-popup,
#s360c-advisor-popup-root .s360c-advisor-popup,
#s360c-contact-popup-root .s360c-contact-popup {
  animation: s360-enter 0.22s var(--s360-ease) both !important;
}

#system360-app :is(.s360-modal.is-closing, .s360-dropdown.is-closing, .s360-toast.is-closing, .s360-modal.hide, .s360-dropdown.hide, .s360-toast.hide),
#system360-client-portal :is(.s360c-popup.is-closing, .s360c-advisor-popup.is-closing, .s360c-contact-popup.is-closing, .s360c-nextflow-menu.is-closing),
#s360c-popup-root .s360c-popup.is-closing,
#s360c-advisor-popup-root .s360c-advisor-popup.is-closing,
#s360c-contact-popup-root .s360c-contact-popup.is-closing {
  animation: s360-exit 0.18s var(--s360-ease) both !important;
}

/* Scrollbar */
#system360-app *::-webkit-scrollbar,
#system360-client-portal *::-webkit-scrollbar,
#s360c-popup-root *::-webkit-scrollbar,
#s360c-advisor-popup-root *::-webkit-scrollbar,
#s360c-contact-popup-root *::-webkit-scrollbar,
.s360-wrap *::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

#system360-app *::-webkit-scrollbar-track,
#system360-client-portal *::-webkit-scrollbar-track,
#s360c-popup-root *::-webkit-scrollbar-track,
#s360c-advisor-popup-root *::-webkit-scrollbar-track,
#s360c-contact-popup-root *::-webkit-scrollbar-track,
.s360-wrap *::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(210, 226, 244, 0.6);
}

#system360-app *::-webkit-scrollbar-thumb,
#system360-client-portal *::-webkit-scrollbar-thumb,
#s360c-popup-root *::-webkit-scrollbar-thumb,
#s360c-advisor-popup-root *::-webkit-scrollbar-thumb,
#s360c-contact-popup-root *::-webkit-scrollbar-thumb,
.s360-wrap *::-webkit-scrollbar-thumb {
  border: 2px solid rgba(238, 246, 255, 0.92);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(113, 146, 188, 0.86), rgba(80, 112, 153, 0.9));
}

/* Responsive cleanup */
@media (max-width: 980px) {
  #system360-app :is(.s360-table thead, table thead),
  #system360-client-portal table thead,
  #s360c-popup-root table thead,
  #s360c-advisor-popup-root table thead,
  #s360c-contact-popup-root table thead {
    display: none !important;
  }

  #system360-app :is(.s360-sidebar, .s360-topbar, .s360-card, .s360-panel, .s360-modal),
  #system360-client-portal :is(.s360c-card, .s360c-office-card, .s360c-office-panel, .s360c-officev2-card, .s360c-popup, .s360c-advisor-popup, .s360c-contact-popup),
  #s360c-popup-root .s360c-popup,
  #s360c-advisor-popup-root .s360c-advisor-popup,
  #s360c-contact-popup-root .s360c-contact-popup,
  .s360-wrap :is(.s360-topbar, .s360-sidebar, .s360-card, .s360-box) {
    border-radius: 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #system360-app *,
  #system360-client-portal *,
  #s360c-popup-root *,
  #s360c-advisor-popup-root *,
  #s360c-contact-popup-root *,
  .s360-wrap * {
    animation: none !important;
  }
}

/* Keep section shell transparency aligned with Inicio (UI V8 intent) */
#system360-app .s360-shell {
  background: rgba(255, 255, 255, 0.15) !important;
  background-color: rgba(255, 255, 255, 0.15) !important;
  background-image: none !important;
}

#system360-app .s360-main .s360-panel,
#system360-app .s360-main .s360-card,
#system360-app .s360-main .s360-box,
#system360-app .s360-main .s360-seguimientos-wrap {
  background: rgba(255, 255, 255, 0.15) !important;
  background-color: rgba(255, 255, 255, 0.15) !important;
  background-image: none !important;
}

#system360-app .s360-main .s360-flow-kpis .s360-card,
#system360-app .s360-main .s360-flow-viewport {
  background: rgba(255, 255, 255, 0.15) !important;
  background-color: rgba(255, 255, 255, 0.15) !important;
  background-image: none !important;
}

/* Left sidebar: 45% transparency */
#system360-app .s360-sidebar {
  background: rgba(255, 255, 255, 0.55) !important;
  background-color: rgba(255, 255, 255, 0.55) !important;
  background-image: none !important;
}

@keyframes s360-loader-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes s360-shimmer {
  100% {
    transform: translateX(100%);
  }
}

@keyframes s360-enter {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.988);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes s360-exit {
  from {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(6px) scale(0.988);
  }
}

/* iOS 26 / macOS-like premium visual layer */
#system360-app {
  --s360x-shell: rgba(255, 255, 255, 0.16);
  --s360x-surface: rgba(255, 255, 255, 0.2);
  --s360x-surface-strong: rgba(255, 255, 255, 0.3);
  --s360x-surface-soft: rgba(255, 255, 255, 0.12);
  --s360x-border: rgba(255, 255, 255, 0.55);
  --s360x-border-soft: rgba(128, 158, 196, 0.34);
  --s360x-ink: #10253d;
  --s360x-ink-soft: #4f6782;
  --s360x-accent: #0a84ff;
  --s360x-accent-soft: rgba(10, 132, 255, 0.2);
  --s360x-shadow-lg: 0 28px 64px rgba(9, 29, 53, 0.22);
  --s360x-shadow-md: 0 14px 34px rgba(10, 33, 61, 0.14);
}

#system360-app .s360-app.s360-app-system {
  background:
    radial-gradient(120% 95% at -15% -18%, rgba(110, 191, 255, 0.28), transparent 58%),
    radial-gradient(90% 85% at 116% 112%, rgba(130, 205, 168, 0.22), transparent 60%),
    linear-gradient(145deg, rgba(232, 241, 252, 0.38), rgba(210, 226, 246, 0.18)),
    url("https://static.wixstatic.com/media/ddf669_5cc977fd054b461688d04b2e7ca24e13~mv2.png") center center / cover no-repeat fixed !important;
}

#system360-app .s360-shell {
  border: 1px solid var(--s360x-border) !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.2), rgba(226, 239, 255, 0.1)) !important;
  box-shadow: var(--s360x-shadow-lg), inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
  backdrop-filter: blur(24px) saturate(162%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(162%) !important;
}

#system360-app .s360-topbar.s360-topbar-macos,
#system360-app .s360-topbar {
  border: 1px solid rgba(255, 255, 255, 0.64) !important;
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.4), rgba(230, 242, 255, 0.2)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), 0 10px 24px rgba(12, 36, 66, 0.16) !important;
  backdrop-filter: blur(20px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
}

#system360-app .s360-title-text {
  color: var(--s360x-ink) !important;
  letter-spacing: -0.022em !important;
  font-weight: 680 !important;
}

#system360-app .s360-sidebar {
  border: 1px solid rgba(255, 255, 255, 0.66) !important;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.58), rgba(228, 239, 252, 0.44)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76), 0 12px 30px rgba(11, 37, 66, 0.14) !important;
  backdrop-filter: blur(22px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(160%) !important;
}

#system360-app .s360-nav-item {
  border: 1px solid transparent !important;
  border-radius: 14px !important;
  color: var(--s360x-ink-soft) !important;
  background: rgba(255, 255, 255, 0) !important;
}

#system360-app .s360-nav-item:hover {
  border-color: rgba(139, 173, 213, 0.48) !important;
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.52), rgba(226, 238, 255, 0.32)) !important;
  color: #123a63 !important;
  box-shadow: 0 8px 18px rgba(18, 58, 99, 0.12) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-nav-item.active {
  border-color: rgba(87, 152, 255, 0.68) !important;
  background: linear-gradient(160deg, rgba(197, 226, 255, 0.76), rgba(162, 206, 255, 0.56)) !important;
  color: #0d3156 !important;
  box-shadow: 0 10px 22px rgba(10, 132, 255, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
}

#system360-app .s360-main .s360-panel,
#system360-app .s360-main .s360-card,
#system360-app .s360-main .s360-box,
#system360-app .s360-main .s360-seguimientos-wrap {
  border: 1px solid var(--s360x-border-soft) !important;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.23), rgba(233, 243, 255, 0.12)) !important;
  box-shadow: var(--s360x-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.66) !important;
  backdrop-filter: blur(15px) saturate(145%) !important;
  -webkit-backdrop-filter: blur(15px) saturate(145%) !important;
}

#system360-app .s360-main .s360-panel:hover,
#system360-app .s360-main .s360-card:hover {
  border-color: rgba(119, 170, 243, 0.55) !important;
  box-shadow: 0 16px 36px rgba(9, 34, 64, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.74) !important;
}

#system360-app :is(.s360-folder-tabs, .s360-home-tabs, .s360-time-tabs, .s360-alert-center-tabs) {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  align-items: stretch !important;
  gap: 2px !important;
  padding: 8px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(53, 93, 194, 0.46) !important;
  background: linear-gradient(180deg, rgba(5, 15, 45, 0.98) 0%, rgba(3, 11, 35, 0.98) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(124, 152, 235, 0.22),
    inset 0 0 0 1px rgba(10, 36, 96, 0.54),
    0 10px 24px rgba(2, 9, 31, 0.5) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin !important;
}

#system360-app :is(.s360-folder-tab, .s360-home-tab-btn, .s360-time-tab, .s360-alert-center-tabs .s360-btn) {
  position: relative !important;
  flex: 0 0 auto !important;
  min-width: 120px !important;
  min-height: 54px !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  background: linear-gradient(180deg, rgba(9, 19, 54, 0.68) 0%, rgba(6, 14, 40, 0.7) 100%) !important;
  color: #93a8d4 !important;
  box-shadow: none !important;
}

#system360-app :is(.s360-folder-tab, .s360-home-tab-btn, .s360-time-tab, .s360-alert-center-tabs .s360-btn):not(:first-child)::before {
  content: "" !important;
  position: absolute !important;
  left: -1px !important;
  top: 20% !important;
  bottom: 20% !important;
  width: 1px !important;
  background: linear-gradient(180deg, rgba(87, 110, 168, 0), rgba(87, 110, 168, 0.42), rgba(87, 110, 168, 0)) !important;
  pointer-events: none !important;
}

#system360-app :is(.s360-folder-tab, .s360-home-tab-btn, .s360-time-tab, .s360-alert-center-tabs .s360-btn)::after {
  content: "" !important;
  position: absolute !important;
  left: 32% !important;
  right: 32% !important;
  bottom: 6px !important;
  height: 3px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #5ea5ff 0%, #a75bff 50%, #f053b8 100%) !important;
  opacity: 0 !important;
  transform: scaleX(0.4) !important;
  transition: opacity 0.24s ease, transform 0.24s ease !important;
  pointer-events: none !important;
}

#system360-app :is(.s360-folder-tab:hover, .s360-home-tab-btn:hover, .s360-time-tab:hover, .s360-alert-center-tabs .s360-btn:hover) {
  color: #d7e4ff !important;
  border-color: rgba(81, 118, 215, 0.56) !important;
  background: linear-gradient(180deg, rgba(16, 30, 74, 0.9) 0%, rgba(9, 21, 55, 0.9) 100%) !important;
  box-shadow: inset 0 1px 0 rgba(157, 184, 255, 0.18) !important;
}

#system360-app :is(.s360-folder-tab:hover, .s360-home-tab-btn:hover, .s360-time-tab:hover, .s360-alert-center-tabs .s360-btn:hover)::after {
  opacity: 0.7 !important;
  transform: scaleX(0.82) !important;
}

#system360-app :is(.s360-folder-tab.active, .s360-home-tab-btn.active, .s360-time-tab.active, .s360-alert-center-tabs .s360-btn.is-active) {
  border-color: rgba(103, 152, 255, 0.95) !important;
  color: #ffffff !important;
  background: linear-gradient(112deg, rgba(45, 102, 242, 0.95) 0%, rgba(108, 74, 212, 0.94) 52%, rgba(201, 60, 177, 0.92) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    0 8px 20px rgba(37, 61, 153, 0.54),
    0 0 18px rgba(74, 105, 255, 0.34) !important;
}

#system360-app :is(.s360-folder-tab.active, .s360-home-tab-btn.active, .s360-time-tab.active, .s360-alert-center-tabs .s360-btn.is-active)::before {
  display: none !important;
}

#system360-app :is(.s360-folder-tab.active, .s360-home-tab-btn.active, .s360-time-tab.active, .s360-alert-center-tabs .s360-btn.is-active)::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}

#system360-app :is(.s360-btn, .s360-icon-btn, .s360-chat-btn, .s360-drop-btn, .button) {
  border: 1px solid rgba(98, 149, 218, 0.58) !important;
  color: #184770 !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.94), rgba(223, 237, 255, 0.82)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 6px 14px rgba(20, 64, 113, 0.16) !important;
}

#system360-app :is(.s360-btn.sec) {
  border-color: rgba(125, 163, 212, 0.52) !important;
  color: #335372 !important;
  background: linear-gradient(160deg, rgba(251, 254, 255, 0.86), rgba(235, 244, 255, 0.66)) !important;
}

#system360-app .s360-modal-form360 .s360-group-member-tabs {
  margin: 0 0 14px !important;
  padding: 7px !important;
  border-radius: 12px !important;
}

#system360-app .s360-modal-form360 .s360-group-member-tab {
  min-width: 150px !important;
  min-height: 48px !important;
  justify-content: flex-start !important;
  padding: 10px 14px !important;
}

#system360-app .s360-modal-form360 .s360-group-member-tab > span {
  width: 24px !important;
  height: 24px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  background: rgba(93, 142, 255, 0.18) !important;
  color: #cfe0ff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

#system360-app .s360-modal-form360 .s360-group-member-tab > strong {
  min-width: 0 !important;
  max-width: 180px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: inherit !important;
  font: inherit !important;
}

#system360-app .s360-modal-form360 .s360-group-member-pane[hidden] {
  display: none !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control > :is([data-group-policy-field], [data-group-policy-price], .s360-select, .s360-input, select, input),
#system360-app #s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control > :is([data-group-policy-field], [data-group-policy-price], .s360-select, .s360-input, select, input),
#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control > :is([data-group-policy-field], [data-group-policy-price], .s360-select, .s360-input, select, input) {
  height: 42px !important;
  min-height: 42px !important;
  border: 1px solid rgba(56, 82, 132, 0.78) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #081224 0%, #050d1c 100%) !important;
  background-color: #071225 !important;
  background-image: linear-gradient(180deg, #081224 0%, #050d1c 100%) !important;
  color: #edf5ff !important;
  -webkit-text-fill-color: #edf5ff !important;
  box-shadow: inset 0 1px 0 rgba(128, 157, 214, 0.08) !important;
  opacity: 1 !important;
  color-scheme: dark !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control > select option,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control > select option,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control > select option {
  background: #071225 !important;
  color: #edf5ff !important;
}

#system360-app :is(.s360-btn.warn) {
  border-color: rgba(217, 144, 31, 0.56) !important;
  color: #714404 !important;
  background: linear-gradient(160deg, rgba(255, 248, 234, 0.97), rgba(252, 229, 185, 0.86)) !important;
}

#system360-app :is(.s360-btn.danger) {
  border-color: rgba(221, 95, 107, 0.56) !important;
  color: #7e2132 !important;
  background: linear-gradient(160deg, rgba(255, 243, 246, 0.97), rgba(248, 210, 218, 0.86)) !important;
}

#system360-app :is(.s360-btn.ok, .s360-quality-approve) {
  border-color: rgba(55, 169, 108, 0.56) !important;
  color: #0f5735 !important;
  background: linear-gradient(160deg, rgba(243, 255, 248, 0.97), rgba(202, 243, 219, 0.88)) !important;
}

#system360-app :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border: 1px solid rgba(120, 164, 221, 0.5) !important;
  color: #153a60 !important;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.86), rgba(232, 243, 255, 0.68)) !important;
  box-shadow: inset 0 1px 2px rgba(14, 41, 73, 0.08) !important;
}

#system360-app :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea):focus {
  border-color: rgba(55, 133, 244, 0.86) !important;
  box-shadow: 0 0 0 3px rgba(10, 132, 255, 0.2), inset 0 1px 2px rgba(14, 41, 73, 0.08) !important;
}

#system360-app :is(.s360-table, .s360-table-follow, .s360-table-sales, table) {
  border: 1px solid rgba(130, 169, 220, 0.5) !important;
  background: rgba(255, 255, 255, 0.3) !important;
}

#system360-app :is(.s360-table th, .s360-table-follow th, .s360-table-sales th, table th) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(232, 244, 255, 0.72)) !important;
  color: #33597d !important;
}

#system360-app :is(.s360-table td, .s360-table-follow td, .s360-table-sales td, table td) {
  background: rgba(255, 255, 255, 0.12) !important;
}

#system360-app :is(.s360-modal, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown) {
  border: 1px solid rgba(255, 255, 255, 0.7) !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.84), rgba(230, 242, 255, 0.72)) !important;
  box-shadow: 0 22px 44px rgba(8, 30, 55, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: blur(20px) saturate(155%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(155%) !important;
}

#system360-app :is(.s360-nav-item, .s360-btn, .s360-icon-btn, .s360-folder-tab, .s360-home-tab-btn, .s360-time-tab, .s360-card, .s360-panel, .s360-modal, .s360-dropdown) {
  transition:
    background-color 200ms cubic-bezier(0.22, 0.61, 0.36, 1),
    border-color 200ms cubic-bezier(0.22, 0.61, 0.36, 1),
    box-shadow 200ms cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 200ms cubic-bezier(0.22, 0.61, 0.36, 1),
    color 180ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}

#system360-app :is(.s360-btn:hover, .s360-icon-btn:hover) {
  transform: translateY(-1px) !important;
}

/* Prevent tab crowding in long/inline groups */
#system360-app .s360-folder-tabs-inline,
#system360-app .s360-folder-tabs,
#system360-app .s360-time-tabs,
#system360-app .s360-home-tabs,
#system360-app .s360-alert-center-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  min-width: 0 !important;
  scrollbar-gutter: stable both-edges !important;
}

/* ATC section tabs: keep clean spacing with refresh action */
#system360-app .s360-atc-shell .s360-atc-section-actions {
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
}

#system360-app .s360-atc-shell .s360-atc-section-tabs {
  width: min(100%, calc(100% - 132px)) !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 1 1 560px !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
  align-self: center !important;
}

#system360-app .s360-atc-shell .s360-atc-section-tabs .s360-folder-tab {
  flex: 0 0 auto !important;
  min-width: max-content !important;
}

#system360-app .s360-atc-shell .s360-atc-section-actions #s360-atc-refresh {
  flex: 0 0 auto !important;
  margin: 0 !important;
  align-self: center !important;
}

@media (max-width: 980px) {
  #system360-app .s360-shell {
    border-radius: 20px !important;
    backdrop-filter: blur(18px) saturate(148%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(148%) !important;
  }

  #system360-app .s360-topbar,
  #system360-app .s360-sidebar,
  #system360-app .s360-main .s360-panel,
  #system360-app .s360-main .s360-card {
    border-radius: 14px !important;
  }

  #system360-app .s360-atc-shell .s360-atc-section-tabs {
    width: 100% !important;
    flex-basis: 100% !important;
  }
}

/* Sidebar redesign: iOS 26 / macOS modern navigation */
#system360-app .s360-sidebar {
  position: relative !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  gap: 12px !important;
  padding: 12px !important;
  border-radius: 26px !important;
  border: 1px solid rgba(255, 255, 255, 0.68) !important;
  background:
    radial-gradient(120% 60% at 10% -10%, rgba(165, 215, 255, 0.36), transparent 62%),
    linear-gradient(165deg, rgba(255, 255, 255, 0.6), rgba(228, 239, 253, 0.4)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    0 16px 34px rgba(10, 37, 70, 0.18) !important;
  backdrop-filter: blur(24px) saturate(164%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(164%) !important;
  overflow: hidden !important;
}

#system360-app .s360-sidebar::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0)) !important;
}

#system360-app .s360-sidebar-head {
  position: relative !important;
  z-index: 1 !important;
  min-height: 56px !important;
  padding: 2px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

#system360-app .s360-brand {
  min-width: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 10px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(160, 190, 227, 0.42) !important;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.72), rgba(235, 245, 255, 0.5)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}

#system360-app .s360-brand-full {
  font-size: 21px !important;
  font-weight: 760 !important;
  letter-spacing: -0.024em !important;
  color: #123155 !important;
}

#system360-app .s360-brand-short {
  font-size: 18px !important;
  font-weight: 760 !important;
  color: #123155 !important;
}

#system360-app .s360-side-toggle {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(149, 183, 224, 0.58) !important;
  color: #2d4c6e !important;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.86), rgba(225, 239, 255, 0.72)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 6px 14px rgba(20, 63, 111, 0.14) !important;
}

#system360-app .s360-nav {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 2px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

#system360-app .s360-nav-section-label {
  margin: 8px 4px 2px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(154, 186, 224, 0.36) !important;
  background: rgba(255, 255, 255, 0.34) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.11em !important;
  color: #577190 !important;
}

#system360-app .s360-nav-item {
  position: relative !important;
  width: 100% !important;
  min-height: 46px !important;
  border-radius: 14px !important;
  border: 1px solid transparent !important;
  background: rgba(255, 255, 255, 0.2) !important;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  color: #355473 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55) !important;
}

#system360-app .s360-nav-item .s360-nav-icon {
  width: 22px !important;
  height: 22px !important;
  display: grid !important;
  place-items: center !important;
  color: #3f5f82 !important;
}

#system360-app .s360-nav-item .s360-nav-icon .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
}

#system360-app .s360-nav-item .s360-nav-label {
  min-width: 0 !important;
  max-width: 100% !important;
  font-size: 13.5px !important;
  font-weight: 620 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-nav-item .s360-nav-meta {
  color: #5a7695 !important;
}

#system360-app .s360-nav-item .s360-chevron {
  display: inline-grid !important;
  place-items: center !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.36) !important;
  border: 1px solid rgba(154, 186, 224, 0.45) !important;
}

#system360-app .s360-nav-item:hover {
  border-color: rgba(131, 173, 220, 0.52) !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.7), rgba(228, 240, 255, 0.46)) !important;
  color: #173b62 !important;
  box-shadow: 0 8px 18px rgba(16, 54, 98, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-nav-item.active {
  border-color: rgba(82, 151, 240, 0.72) !important;
  background: linear-gradient(160deg, rgba(194, 224, 255, 0.88), rgba(159, 204, 255, 0.66)) !important;
  color: #0f365f !important;
  box-shadow:
    0 10px 22px rgba(10, 132, 255, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}

#system360-app .s360-nav-item.active::before {
  content: "" !important;
  position: absolute !important;
  left: 4px !important;
  top: 9px !important;
  bottom: 9px !important;
  width: 3px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #0a84ff, #67b4ff) !important;
  box-shadow: 0 0 10px rgba(10, 132, 255, 0.52) !important;
}

#system360-app .s360-submenu-wrap {
  margin: 0 0 2px 10px !important;
  padding: 4px 0 2px 12px !important;
  border-left: 1px solid rgba(147, 180, 220, 0.48) !important;
  display: grid !important;
  gap: 6px !important;
}

#system360-app .s360-nav-item.s360-sub-item {
  min-height: 40px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.24) !important;
}

#system360-app .s360-sidebar-foot {
  position: relative !important;
  z-index: 1 !important;
  padding-top: 8px !important;
}

#system360-app .s360-side-userchip {
  width: 100% !important;
  min-height: 52px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(154, 186, 224, 0.5) !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.72), rgba(227, 239, 255, 0.5)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 8px 16px rgba(12, 41, 74, 0.12) !important;
  padding: 8px 10px !important;
  gap: 10px !important;
}

#system360-app .s360-side-user-avatar {
  width: 34px !important;
  height: 34px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(133, 170, 216, 0.56) !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.92), rgba(214, 232, 255, 0.78)) !important;
  color: #214a75 !important;
  font-weight: 700 !important;
}

#system360-app .s360-side-user-meta strong {
  color: #153a60 !important;
  font-size: 13px !important;
  line-height: 1.15 !important;
}

#system360-app .s360-side-user-meta small {
  color: #5b7491 !important;
  font-size: 11px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar {
  padding: 10px 8px !important;
  gap: 10px !important;
  border-radius: 22px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar-head {
  justify-content: center !important;
  min-height: auto !important;
}

#system360-app .s360-shell.collapsed .s360-brand {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border-radius: 13px !important;
  margin: 0 auto !important;
  overflow: hidden !important;
}

#system360-app .s360-shell.collapsed .s360-nav {
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
}

#system360-app .s360-shell.collapsed .s360-nav-section-label {
  width: 30px !important;
  height: 6px !important;
  min-height: 6px !important;
  padding: 0 !important;
  margin: 6px 0 !important;
  border-radius: 999px !important;
  border: 0 !important;
  background: rgba(118, 151, 191, 0.4) !important;
  color: transparent !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-shell.collapsed .s360-nav-item {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border-radius: 13px !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  justify-items: center !important;
  background: rgba(255, 255, 255, 0.34) !important;
}

#system360-app .s360-shell.collapsed .s360-nav-item .s360-nav-meta {
  display: none !important;
}

#system360-app .s360-shell.collapsed .s360-nav-item.active::before {
  left: 50% !important;
  top: auto !important;
  bottom: -3px !important;
  transform: translateX(-50%) !important;
  width: 18px !important;
  height: 3px !important;
}

#system360-app .s360-shell.collapsed .s360-submenu-wrap {
  display: none !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar-foot {
  padding-top: 2px !important;
}

#system360-app .s360-shell.collapsed .s360-side-userchip {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border-radius: 13px !important;
  justify-content: center !important;
}

#system360-app .s360-shell.collapsed .s360-side-user-avatar {
  width: 28px !important;
  height: 28px !important;
  border-radius: 9px !important;
}

@media (max-width: 980px) {
  #system360-app .s360-sidebar {
    border-radius: 18px !important;
    padding: 10px !important;
  }

  #system360-app .s360-nav-item {
    min-height: 42px !important;
    padding: 8px 10px !important;
  }
}

/* Sidebar submenu chevron: prevent clipping and improve clarity */
#system360-app .s360-shell:not(.collapsed) .s360-nav-item > .s360-nav-meta {
  min-width: 24px !important;
  width: 24px !important;
  max-width: 24px !important;
  flex: 0 0 24px !important;
  opacity: 1 !important;
  transform: none !important;
  overflow: visible !important;
  justify-content: flex-end !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-nav-item .s360-chevron {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  border-radius: 999px !important;
  overflow: visible !important;
  border: 1px solid rgba(150, 184, 225, 0.52) !important;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.74), rgba(228, 240, 255, 0.48)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-nav-item .s360-chevron .s360-svg-icon {
  width: 12px !important;
  height: 12px !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  overflow: visible !important;
  transform: translateX(0.4px) !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-nav-item .s360-chevron.open {
  transform: rotate(90deg) !important;
}

/* Sidebar motion polish + submenu animation */
#system360-app .s360-workarea,
#system360-app .s360-sidebar,
#system360-app .s360-side-toggle,
#system360-app .s360-nav-item,
#system360-app .s360-nav-label,
#system360-app .s360-nav-meta,
#system360-app .s360-side-userchip,
#system360-app .s360-side-user-meta,
#system360-app .s360-brand-full,
#system360-app .s360-brand-short {
  transition:
    opacity 220ms cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 280ms cubic-bezier(0.22, 0.61, 0.36, 1),
    max-width 280ms cubic-bezier(0.22, 0.61, 0.36, 1),
    background-color 220ms cubic-bezier(0.22, 0.61, 0.36, 1),
    border-color 220ms cubic-bezier(0.22, 0.61, 0.36, 1),
    box-shadow 240ms cubic-bezier(0.22, 0.61, 0.36, 1),
    padding 260ms cubic-bezier(0.22, 0.61, 0.36, 1),
    border-radius 260ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-nav-label,
#system360-app .s360-shell:not(.collapsed) .s360-nav-meta,
#system360-app .s360-shell:not(.collapsed) .s360-side-user-meta,
#system360-app .s360-shell:not(.collapsed) .s360-brand-full {
  display: inline-flex !important;
  opacity: 1 !important;
  transform: translateX(0) !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-brand-short {
  display: inline-flex !important;
  opacity: 0 !important;
  transform: translateY(-3px) scale(0.96) !important;
}

#system360-app .s360-shell.collapsed .s360-nav-label,
#system360-app .s360-shell.collapsed .s360-nav-meta,
#system360-app .s360-shell.collapsed .s360-side-user-meta,
#system360-app .s360-shell.collapsed .s360-brand-full {
  display: inline-flex !important;
  opacity: 0 !important;
  transform: translateX(6px) !important;
  max-width: 0 !important;
}

#system360-app .s360-shell.collapsed .s360-brand-short {
  display: inline-flex !important;
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
}

#system360-app .s360-submenu-wrap {
  max-height: 0 !important;
  opacity: 0 !important;
  transform: translateY(-8px) !important;
  overflow: hidden !important;
  pointer-events: none !important;
  border-left-color: rgba(147, 180, 220, 0) !important;
  transition:
    max-height 320ms cubic-bezier(0.22, 0.61, 0.36, 1),
    opacity 220ms cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 260ms cubic-bezier(0.22, 0.61, 0.36, 1),
    margin 260ms cubic-bezier(0.22, 0.61, 0.36, 1),
    padding 260ms cubic-bezier(0.22, 0.61, 0.36, 1),
    border-color 220ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}

#system360-app .s360-submenu-wrap.open {
  max-height: 420px !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
  border-left-color: rgba(147, 180, 220, 0.48) !important;
  display: grid !important;
  visibility: visible !important;
  overflow: visible !important;
}

#system360-app .s360-sidebar .s360-submenu-wrap.open .s360-sub-item {
  display: grid !important;
  opacity: 1 !important;
  transform: none !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-nav-item > .s360-nav-meta {
  pointer-events: auto !important;
  line-height: 0 !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-nav-item .s360-chevron,
#system360-app .s360-shell:not(.collapsed) .s360-nav-item .s360-chevron .s360-svg-icon {
  pointer-events: auto !important;
}

/* ===== Collapsed sidebar brand hard-fix: always show "360" ===== */
#system360-app .s360-shell.collapsed .s360-sidebar-head {
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  align-items: start !important;
  gap: 8px !important;
}

#system360-app .s360-shell.collapsed .s360-brand {
  position: relative !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
}

#system360-app .s360-shell.collapsed .s360-brand::before {
  content: "360" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #123155 !important;
  font-size: 20px !important;
  font-weight: 780 !important;
  letter-spacing: -0.02em !important;
  line-height: 1 !important;
}

#system360-app .s360-shell.collapsed .s360-brand-full,
#system360-app .s360-shell.collapsed .s360-brand-short {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-brand::before {
  content: none !important;
}

/* ===== Brand cleanup: no background/border around CRM 360 / 360 ===== */
#system360-app .s360-brand,
#system360-app .s360-shell.collapsed .s360-brand {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* ===== Sidebar collapse: smoother close/open motion ===== */
#system360-app .s360-workarea {
  transition: gap 360ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}

#system360-app .s360-sidebar {
  transition:
    width 380ms cubic-bezier(0.22, 0.61, 0.36, 1),
    min-width 380ms cubic-bezier(0.22, 0.61, 0.36, 1),
    flex-basis 380ms cubic-bezier(0.22, 0.61, 0.36, 1),
    padding 320ms cubic-bezier(0.22, 0.61, 0.36, 1),
    border-radius 320ms cubic-bezier(0.22, 0.61, 0.36, 1),
    box-shadow 320ms cubic-bezier(0.22, 0.61, 0.36, 1),
    background-color 320ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}

#system360-app .s360-sidebar-head,
#system360-app .s360-nav,
#system360-app .s360-sidebar-foot {
  transition:
    padding 300ms cubic-bezier(0.22, 0.61, 0.36, 1),
    gap 300ms cubic-bezier(0.22, 0.61, 0.36, 1),
    opacity 220ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}

#system360-app .s360-nav-item {
  transition:
    width 320ms cubic-bezier(0.22, 0.61, 0.36, 1),
    min-width 320ms cubic-bezier(0.22, 0.61, 0.36, 1),
    min-height 320ms cubic-bezier(0.22, 0.61, 0.36, 1),
    padding 300ms cubic-bezier(0.22, 0.61, 0.36, 1),
    border-radius 300ms cubic-bezier(0.22, 0.61, 0.36, 1),
    background-color 220ms cubic-bezier(0.22, 0.61, 0.36, 1),
    border-color 220ms cubic-bezier(0.22, 0.61, 0.36, 1),
    box-shadow 260ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}

#system360-app .s360-nav-item > span,
#system360-app .s360-nav-label,
#system360-app .s360-nav-meta,
#system360-app .s360-side-user-meta,
#system360-app .s360-nav-section-label {
  transition:
    opacity 220ms cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 280ms cubic-bezier(0.22, 0.61, 0.36, 1),
    max-width 280ms cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}

/* Avoid hard cut in collapsed state */
#system360-app .s360-shell.collapsed .s360-nav-item .s360-nav-meta {
  display: inline-flex !important;
  opacity: 0 !important;
  max-width: 0 !important;
  overflow: hidden !important;
  transform: translateX(6px) scale(0.94) !important;
  pointer-events: none !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-nav-item .s360-nav-meta {
  display: inline-flex !important;
  opacity: 1 !important;
  max-width: 28px !important;
  overflow: visible !important;
  transform: translateX(0) scale(1) !important;
}

#system360-app .s360-shell.collapsed .s360-submenu-wrap {
  display: grid !important;
  max-height: 0 !important;
  opacity: 0 !important;
  transform: translateY(-6px) !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* Keep same layout model to avoid jump when collapsing */
#system360-app .s360-shell.collapsed .s360-sidebar-head {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 8px !important;
}

/* ===== Collapsed profile chip centering fix ===== */
#system360-app .s360-shell.collapsed .s360-sidebar-foot {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

#system360-app .s360-shell.collapsed .s360-side-userchip {
  display: grid !important;
  grid-template-columns: 1fr !important;
  place-items: center !important;
  justify-items: center !important;
  align-items: center !important;
  gap: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

#system360-app .s360-shell.collapsed .s360-side-user-meta {
  display: none !important;
}

#system360-app .s360-shell.collapsed .s360-side-user-avatar {
  margin: 0 auto !important;
  display: grid !important;
  place-items: center !important;
  flex: none !important;
}

/* ===== macOS-like Notification Center refresh ===== */
#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown {
  width: min(470px, calc(100vw - 20px)) !important;
  padding: 14px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(177, 202, 233, 0.56) !important;
  background: linear-gradient(165deg, rgba(251, 254, 255, 0.94), rgba(237, 245, 255, 0.84)) !important;
  box-shadow: 0 24px 48px rgba(9, 34, 64, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
  backdrop-filter: blur(22px) saturate(165%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(165%) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown-head {
  margin-bottom: 10px !important;
  padding: 2px 2px 8px !important;
  border-bottom: 1px solid rgba(166, 190, 221, 0.34) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-panel,
#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-stack {
  display: grid !important;
  gap: 10px !important;
  max-height: min(60vh, 510px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-card {
  border-radius: 18px !important;
  border: 1px solid rgba(168, 194, 228, 0.46) !important;
  background: linear-gradient(170deg, rgba(255, 255, 255, 0.9), rgba(239, 247, 255, 0.76)) !important;
  box-shadow: 0 10px 20px rgba(17, 45, 79, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
  padding: 12px !important;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-card:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 14px 24px rgba(17, 45, 79, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-card.s360-notif-card-danger {
  border-color: rgba(244, 63, 94, 0.35) !important;
  background: linear-gradient(165deg, rgba(255, 251, 252, 0.94), rgba(255, 240, 242, 0.82)) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-card.s360-notif-card-warn {
  border-color: rgba(245, 158, 11, 0.34) !important;
  background: linear-gradient(165deg, rgba(255, 253, 247, 0.94), rgba(255, 246, 230, 0.82)) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-head {
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  gap: 9px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-icon {
  width: 34px !important;
  height: 34px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(159, 187, 222, 0.52) !important;
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.92), rgba(231, 242, 255, 0.8)) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-title {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #102744 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-desc {
  font-size: 12.5px !important;
  line-height: 1.32 !important;
  color: #506b8a !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-meta {
  margin: 4px 0 0 42px !important;
  gap: 6px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-meta span {
  border-radius: 999px !important;
  border: 1px solid rgba(166, 190, 221, 0.42) !important;
  background: rgba(248, 251, 255, 0.78) !important;
  color: #5a7594 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-footer {
  margin-left: 42px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-primary {
  min-height: 34px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(112, 164, 233, 0.54) !important;
  background: linear-gradient(160deg, rgba(242, 248, 255, 0.94), rgba(224, 239, 255, 0.86)) !important;
  color: #1b4f83 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-head-right {
  position: relative !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-menu {
  --s360-notif-menu-bg: rgba(247, 251, 255, 0.96);
  top: calc(100% + 8px) !important;
  right: 0 !important;
  width: min(244px, calc(100vw - 44px)) !important;
  padding: 8px !important;
  border-radius: 15px !important;
  border: 1px solid rgba(166, 190, 221, 0.52) !important;
  background: var(--s360-notif-menu-bg) !important;
  box-shadow: 0 16px 30px rgba(16, 43, 78, 0.2) !important;
  backdrop-filter: blur(16px) saturate(155%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(155%) !important;
  transform-origin: top right !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-menu::before {
  content: "" !important;
  position: absolute !important;
  top: -6px !important;
  right: 12px !important;
  width: 12px !important;
  height: 12px !important;
  border-left: 1px solid rgba(166, 190, 221, 0.52) !important;
  border-top: 1px solid rgba(166, 190, 221, 0.52) !important;
  background: var(--s360-notif-menu-bg) !important;
  transform: rotate(45deg) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-menu.is-menu-up {
  top: auto !important;
  bottom: calc(100% + 8px) !important;
  transform-origin: bottom right !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-menu.is-menu-up::before {
  top: auto !important;
  bottom: -7px !important;
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 1px solid rgba(166, 190, 221, 0.52) !important;
  border-bottom: 1px solid rgba(166, 190, 221, 0.52) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-menu .s360-notif-read {
  border-radius: 10px !important;
  font-size: 12.5px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-history-wrap {
  margin-top: 10px !important;
  padding-top: 10px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster {
  display: grid !important;
  gap: 6px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 0 2px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #587493 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-label strong {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-label small {
  min-width: 20px !important;
  height: 20px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(166, 190, 221, 0.45) !important;
  background: rgba(255, 255, 255, 0.8) !important;
  color: #466585 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  text-align: center !important;
  padding: 0 6px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 999px !important;
  background: #4c90d8 !important;
  box-shadow: 0 0 0 3px rgba(76, 144, 216, 0.16) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-danger .s360-notif-cluster-dot {
  background: #ef4444 !important;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-warn .s360-notif-cluster-dot {
  background: #f59e0b !important;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.16) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-toggle {
  width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(164, 190, 223, 0.52) !important;
  background: rgba(255, 255, 255, 0.84) !important;
  color: #4f6f91 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-toggle .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-toggle.is-open {
  transform: rotate(90deg) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-stack {
  position: relative !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-list {
  display: grid !important;
  gap: 9px !important;
  position: relative !important;
  z-index: 3 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-stack.is-collapsed {
  padding-bottom: 16px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-stack.is-collapsed .s360-notif-cluster-list {
  gap: 0 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-stack.is-collapsed .s360-notif-card {
  margin: 0 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-ghost {
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(164, 190, 223, 0.42) !important;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.82), rgba(235, 244, 255, 0.68)) !important;
  box-shadow: 0 8px 16px rgba(20, 52, 91, 0.12) !important;
  pointer-events: none !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-ghost-1 {
  top: 9px !important;
  height: 72% !important;
  opacity: 0.88 !important;
  transform: scale(0.985) !important;
  z-index: 2 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-ghost-2 {
  top: 17px !important;
  height: 64% !important;
  opacity: 0.68 !important;
  transform: scale(0.97) !important;
  z-index: 1 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-danger .s360-notif-ghost {
  border-color: rgba(239, 68, 68, 0.36) !important;
  background: linear-gradient(165deg, rgba(255, 251, 252, 0.86), rgba(255, 239, 242, 0.7)) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-warn .s360-notif-ghost {
  border-color: rgba(245, 158, 11, 0.36) !important;
  background: linear-gradient(165deg, rgba(255, 252, 246, 0.86), rgba(255, 245, 226, 0.72)) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown .s360-notif-cluster-summary {
  position: absolute !important;
  right: 10px !important;
  bottom: 0 !important;
  z-index: 4 !important;
  border-radius: 999px !important;
  border: 1px solid rgba(164, 190, 223, 0.52) !important;
  background: rgba(247, 252, 255, 0.92) !important;
  color: #53718f !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
}

/* ===== Floating notifications to top-left + iOS 26 style ===== */
#system360-app .s360-toast-stack {
  left: 14px !important;
  top: 14px !important;
  right: auto !important;
  bottom: auto !important;
  width: min(410px, calc(100vw - 24px)) !important;
  align-items: flex-start !important;
  gap: 10px !important;
}

#system360-app .s360-toast {
  --s360-toast-accent: #66c5ff;
  --s360-toast-title: #f8fbff;
  --s360-toast-text: rgba(238, 246, 255, 0.97);
  --s360-toast-border: rgba(131, 195, 255, 0.44);
  --s360-toast-bg-a: rgba(19, 118, 206, 0.94);
  --s360-toast-bg-b: rgba(6, 74, 148, 0.92);
  margin-top: 0 !important;
  border-radius: 18px !important;
  border: 1px solid var(--s360-toast-border) !important;
  background: linear-gradient(164deg, var(--s360-toast-bg-a), var(--s360-toast-bg-b)) !important;
  color: var(--s360-toast-title) !important;
  box-shadow:
    0 16px 34px rgba(10, 41, 76, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    inset 0 0 0 1px rgba(255, 255, 255, 0.38) !important;
  backdrop-filter: blur(18px) saturate(170%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(170%) !important;
  padding: 13px 40px 13px 14px !important;
  transform: translateY(calc(var(--s360-toast-index, 0) * 2px)) scale(calc(1 - (var(--s360-toast-index, 0) * 0.014))) !important;
  opacity: calc(1 - (var(--s360-toast-index, 0) * 0.055)) !important;
}

#system360-app .s360-toast::before {
  content: "" !important;
  position: absolute !important;
  left: 10px !important;
  top: 10px !important;
  bottom: 10px !important;
  width: 3px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--s360-toast-accent) 88%, white), color-mix(in srgb, var(--s360-toast-accent) 68%, #02162c)) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--s360-toast-accent) 30%, transparent) !important;
}

#system360-app .s360-toast::after {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  border-radius: 17px !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0) 46%) !important;
}

#system360-app .s360-toast > header {
  margin: 0 0 4px 10px !important;
  font-size: 14px !important;
  font-weight: 760 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.2 !important;
  color: var(--s360-toast-title) !important;
  text-shadow: 0 1px 8px rgba(3, 22, 44, 0.35) !important;
}

#system360-app .s360-toast > p {
  margin: 0 0 0 10px !important;
  font-size: 12.6px !important;
  line-height: 1.42 !important;
  color: var(--s360-toast-text) !important;
  text-wrap: pretty !important;
  text-shadow: 0 1px 6px rgba(3, 22, 44, 0.26) !important;
}

#system360-app .s360-toast.is-hiding {
  transform: translateY(-10px) scale(0.97) !important;
  opacity: 0 !important;
}

#system360-app .s360-toast-close {
  right: 9px !important;
  top: 9px !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 999px !important;
  border: 1px solid color-mix(in srgb, var(--s360-toast-accent) 30%, rgba(164, 190, 223, 0.5)) !important;
  background: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

#system360-app .s360-toast-close:hover {
  background: rgba(255, 255, 255, 0.3) !important;
}

#system360-app .s360-toast.s360-toast-danger,
#system360-app .s360-toast.s360-toast-late {
  --s360-toast-accent: #ff8fa2;
  --s360-toast-title: #fff6f8;
  --s360-toast-text: rgba(255, 236, 241, 0.97);
  --s360-toast-border: rgba(243, 119, 138, 0.5);
  --s360-toast-bg-a: rgba(183, 58, 79, 0.95);
  --s360-toast-bg-b: rgba(131, 31, 52, 0.92);
}

#system360-app .s360-toast.s360-toast-warn {
  --s360-toast-accent: #ffd088;
  --s360-toast-title: #fff9ef;
  --s360-toast-text: rgba(255, 245, 223, 0.97);
  --s360-toast-border: rgba(240, 187, 97, 0.54);
  --s360-toast-bg-a: rgba(188, 114, 31, 0.95);
  --s360-toast-bg-b: rgba(136, 79, 14, 0.92);
}

#system360-app .s360-toast.s360-toast-success,
#system360-app .s360-toast.s360-toast-ok {
  --s360-toast-accent: #88f0c5;
  --s360-toast-title: #f2fff9;
  --s360-toast-text: rgba(229, 255, 244, 0.97);
  --s360-toast-border: rgba(116, 214, 173, 0.52);
  --s360-toast-bg-a: rgba(20, 131, 89, 0.94);
  --s360-toast-bg-b: rgba(11, 96, 64, 0.92);
}

#system360-app .s360-toast.s360-toast-suggestion {
  --s360-toast-accent: #99ecff;
  --s360-toast-title: #f2fdff;
  --s360-toast-text: rgba(228, 252, 255, 0.97);
  --s360-toast-border: rgba(120, 206, 228, 0.5);
  --s360-toast-bg-a: rgba(16, 119, 168, 0.94);
  --s360-toast-bg-b: rgba(9, 84, 128, 0.92);
}

/* Reduce perceived "reload flash" on render */
#system360-app .s360-app-system,
#system360-app .s360-shell,
#system360-app .s360-workarea,
#system360-app .s360-sidebar,
#system360-app .s360-main,
#system360-app .s360-content-scroll,
#system360-app .s360-panel,
#system360-app .s360-card,
#system360-app .s360-box,
#system360-app .s360-seguimientos-wrap,
#system360-app .s360-nav-item,
#system360-app .s360-submenu-wrap {
  animation: none !important;
  transition: none !important;
}

#system360-app :is(.s360-modal, .s360-dropdown, .s360-toast) {
  animation: none !important;
}

@media (max-width: 760px) {
  #system360-app .s360-toast-stack {
    left: 8px !important;
    top: 8px !important;
    right: 8px !important;
    width: auto !important;
  }
}

/* ===== Topbar final override: 100% transparente (sin fondo/contorno/sombra) ===== */
#system360-app .s360-topbar,
#system360-app .s360-topbar.s360-topbar-macos,
#system360-app .s360-topbar.s360-topbar-global {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-app .s360-topbar::before,
#system360-app .s360-topbar::after,
#system360-app .s360-topbar.s360-topbar-macos::before,
#system360-app .s360-topbar.s360-topbar-macos::after,
#system360-app .s360-topbar.s360-topbar-global::before,
#system360-app .s360-topbar.s360-topbar-global::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-group,
#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-group-tools,
#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-group-status,
#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-group-meta,
#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-group-actions {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ===== Topbar objects: iOS-style layout, circles and no clipping ===== */
#system360-app .s360-topbar.s360-topbar-macos {
  overflow: visible !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-right {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-group {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  overflow: visible !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-group-tools,
#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-group-status {
  flex: 0 0 auto !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-icon-wrap {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-icon-btn {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  border: 1px solid rgba(168, 183, 204, 0.62) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(241, 246, 253, 0.88)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.98), 0 6px 14px rgba(17, 40, 73, 0.18) !important;
  transform: none !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-icon-btn:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(150, 170, 198, 0.74) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(233, 241, 251, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1), 0 9px 18px rgba(17, 40, 73, 0.22) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-icon-btn .s360-svg-icon {
  width: 18px !important;
  height: 18px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-icon-badge {
  top: -4px !important;
  right: -4px !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  line-height: 1 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-live-time,
#system360-app .s360-topbar.s360-topbar-macos .s360-live-datetime,
#system360-app .s360-topbar.s360-topbar-macos .s360-badge,
#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-user,
#system360-app .s360-topbar.s360-topbar-macos .s360-call-top-pill {
  min-height: 38px !important;
  height: 38px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(168, 183, 204, 0.56) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(242, 247, 253, 0.86)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.98), 0 4px 10px rgba(17, 40, 73, 0.12) !important;
  white-space: nowrap !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-live-datetime {
  min-width: 210px !important;
  max-width: none !important;
  padding: 0 16px !important;
  justify-content: center !important;
  text-align: center !important;
  overflow: visible !important;
  text-overflow: clip !important;
  font-variant-numeric: tabular-nums !important;
}

/* ===== Topbar action icons: refresh neutral + logout red ===== */
#system360-app .s360-topbar.s360-topbar-macos .s360-topbar-group-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  overflow: visible !important;
}

#system360-app .s360-topbar.s360-topbar-macos #s360-refresh,
#system360-app .s360-topbar.s360-topbar-macos #s360-logout {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

#system360-app .s360-topbar.s360-topbar-macos #s360-refresh .s360-svg-icon,
#system360-app .s360-topbar.s360-topbar-macos #s360-logout .s360-svg-icon {
  width: 18px !important;
  height: 18px !important;
}

#system360-app .s360-topbar.s360-topbar-macos #s360-refresh {
  border: 1px solid rgba(162, 178, 202, 0.72) !important;
  color: #475569 !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(238, 244, 251, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1), 0 7px 15px rgba(15, 23, 42, 0.16) !important;
}

#system360-app .s360-topbar.s360-topbar-macos #s360-refresh:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(142, 161, 191, 0.82) !important;
  color: #334155 !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(230, 238, 248, 0.94)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1), 0 10px 20px rgba(15, 23, 42, 0.2) !important;
}

#system360-app .s360-topbar.s360-topbar-macos #s360-logout {
  border: 1px solid rgba(239, 68, 68, 0.62) !important;
  color: #b91c1c !important;
  background: linear-gradient(180deg, rgba(254, 242, 242, 0.98), rgba(254, 226, 226, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 7px 16px rgba(185, 28, 28, 0.2) !important;
}

#system360-app .s360-topbar.s360-topbar-macos #s360-logout:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(220, 38, 38, 0.74) !important;
  color: #991b1b !important;
  background: linear-gradient(180deg, rgba(254, 226, 226, 0.99), rgba(252, 165, 165, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94), 0 10px 20px rgba(185, 28, 28, 0.26) !important;
}

/* ===== Notification Center (iOS/macOS modern clean) ===== */
#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern {
  top: calc(100% + 12px) !important;
  right: 0 !important;
  width: min(470px, calc(100vw - 22px)) !important;
  padding: 14px 14px 12px !important;
  border-radius: 28px !important;
  border: 1px solid rgba(176, 198, 227, 0.62) !important;
  background: linear-gradient(170deg, rgba(250, 253, 255, 0.95), rgba(235, 243, 255, 0.85)) !important;
  box-shadow: 0 28px 58px rgba(13, 34, 61, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
  backdrop-filter: blur(24px) saturate(1.26) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.26) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 4px 4px 12px !important;
  border-bottom: 1px solid rgba(176, 198, 227, 0.38) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head h4 {
  margin: 0 !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: #102744 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head .s360-badge {
  min-height: 34px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(168, 189, 219, 0.56) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(242, 247, 253, 0.84)) !important;
  color: #5a7594 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel,
#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack {
  margin-top: 12px !important;
  max-height: min(62vh, 560px) !important;
  padding-right: 4px !important;
  display: grid !important;
  gap: 14px !important;
  overflow: auto !important;
  scrollbar-gutter: stable !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel::-webkit-scrollbar,
#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack::-webkit-scrollbar {
  width: 9px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel::-webkit-scrollbar-thumb,
#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  border: 2px solid rgba(238, 245, 255, 0.94) !important;
  background: rgba(116, 148, 189, 0.58) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-cluster {
  padding: 2px 2px 0 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-cluster-head {
  margin: 0 0 8px !important;
  padding: 0 2px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-cluster-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-cluster-label strong {
  font-size: 23px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  color: #35597d !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-cluster-label small {
  min-width: 24px !important;
  height: 24px !important;
  padding: 0 7px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(162, 186, 218, 0.52) !important;
  background: rgba(245, 250, 255, 0.88) !important;
  color: #5f7d9f !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-cluster-toggle {
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(166, 190, 221, 0.56) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(238, 245, 255, 0.82)) !important;
  color: #5a7696 !important;
  box-shadow: 0 6px 12px rgba(19, 45, 79, 0.14) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-cluster-stack {
  gap: 9px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-ghost {
  display: none !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-cluster-summary {
  position: static !important;
  margin: 6px 0 0 auto !important;
  width: fit-content !important;
  border-radius: 999px !important;
  border: 1px solid rgba(166, 190, 221, 0.52) !important;
  background: rgba(247, 252, 255, 0.9) !important;
  color: #5a7594 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 2px 9px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card {
  border-radius: 20px !important;
  border: 1px solid rgba(174, 197, 227, 0.52) !important;
  background: linear-gradient(170deg, rgba(255, 255, 255, 0.93), rgba(238, 246, 255, 0.8)) !important;
  box-shadow: 0 12px 24px rgba(16, 40, 72, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
  padding: 12px 12px 10px !important;
  margin: 0 !important;
  cursor: pointer !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 16px 28px rgba(16, 40, 72, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card.s360-notif-card-danger {
  border-color: rgba(244, 114, 126, 0.5) !important;
  background: linear-gradient(170deg, rgba(255, 252, 252, 0.95), rgba(255, 241, 243, 0.84)) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card.s360-notif-card-warn {
  border-color: rgba(245, 176, 68, 0.54) !important;
  background: linear-gradient(170deg, rgba(255, 253, 248, 0.95), rgba(255, 245, 228, 0.84)) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card.s360-notif-card-ok {
  border-color: rgba(147, 187, 231, 0.52) !important;
  background: linear-gradient(170deg, rgba(252, 254, 255, 0.95), rgba(239, 247, 255, 0.84)) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: start !important;
  margin-bottom: 8px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(162, 190, 224, 0.58) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(238, 246, 255, 0.82)) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title {
  font-size: 17px !important;
  line-height: 1.24 !important;
  font-weight: 700 !important;
  color: #132f50 !important;
  margin: 0 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-desc {
  margin-top: 3px !important;
  font-size: 14px !important;
  line-height: 1.32 !important;
  color: #4f6b8b !important;
  white-space: normal !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-right {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-more {
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(172, 195, 225, 0.56) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(239, 246, 255, 0.84)) !important;
  color: #617c9b !important;
  box-shadow: 0 6px 12px rgba(18, 44, 79, 0.14) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-meta {
  margin: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-meta span {
  min-height: 24px !important;
  padding: 0 9px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(171, 195, 224, 0.48) !important;
  background: rgba(248, 252, 255, 0.82) !important;
  color: #5a7594 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer,
#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-primary {
  display: none !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-menu {
  border-radius: 14px !important;
  border: 1px solid rgba(177, 199, 227, 0.62) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(241, 248, 255, 0.9)) !important;
  box-shadow: 0 16px 30px rgba(15, 35, 61, 0.22) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-menu .s360-notif-read {
  min-height: 34px !important;
  border-radius: 10px !important;
  border: 0 !important;
  background: transparent !important;
  color: #375473 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-menu .s360-notif-read:hover {
  background: rgba(227, 239, 255, 0.74) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-history-wrap {
  margin-top: 14px !important;
  padding-top: 11px !important;
  border-top: 1px solid rgba(176, 198, 227, 0.38) !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-history-wrap h5 {
  margin: 0 0 8px !important;
  font-size: 12px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #6a84a4 !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-history-list {
  display: grid !important;
  gap: 7px !important;
}

#system360-app .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-history-item {
  border-radius: 12px !important;
  border: 1px solid rgba(182, 202, 230, 0.46) !important;
  background: rgba(247, 251, 255, 0.78) !important;
  padding: 8px 10px !important;
}

/* ===== Inicio tabs: remove square background wrappers (productividad/rendimiento/eficiencia/alertas) ===== */
#system360-app .s360-home-main-column > .s360-dash-section.s360-home-tab-panel.s360-sec-productividad.s360-productivity-hub-section,
#system360-app .s360-home-main-column > .s360-dash-section.s360-home-tab-panel.s360-sec-rendimiento.s360-weekly-strategy-section,
#system360-app .s360-home-main-column > .s360-dash-section.s360-home-tab-panel.s360-sec-eficiencia.s360-efficiency-hub,
#system360-app .s360-home-main-column > .s360-dash-section.s360-home-tab-panel.s360-sec-alertas.s360-alert-center-panel {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ===== Home right calendar redesign (iOS/macOS style) ===== */
#system360-app .s360-home-sidebar-card.s360-home-calendar-card {
  border-radius: 18px !important;
  border: 1px solid rgba(162, 188, 220, 0.44) !important;
  background: linear-gradient(180deg, rgba(237, 246, 255, 0.74), rgba(216, 233, 249, 0.64)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 14px 26px rgba(14, 42, 76, 0.13) !important;
  backdrop-filter: blur(9px) saturate(1.04) !important;
  -webkit-backdrop-filter: blur(9px) saturate(1.04) !important;
  padding: 12px 10px 10px !important;
}

#system360-app .s360-home-calendar-card .s360-panel-headline {
  margin: 0 0 10px !important;
  align-items: center !important;
}

#system360-app .s360-home-calendar-card .s360-panel-headline h3 {
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
  color: #102a48 !important;
}

#system360-app .s360-home-cal-nav {
  gap: 9px !important;
}

#system360-app .s360-home-cal-nav .s360-home-cal-nav-btn {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(161, 184, 216, 0.62) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(236, 244, 254, 0.86)) !important;
  color: #3f5e83 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1), 0 8px 16px rgba(16, 41, 74, 0.17) !important;
}

#system360-app .s360-home-cal-nav .s360-home-cal-nav-btn.is-prev .s360-svg-icon {
  transform: rotate(180deg) !important;
}

#system360-app .s360-home-cal-nav .s360-home-cal-nav-btn .s360-svg-icon {
  width: 16px !important;
  height: 16px !important;
}

#system360-app .s360-home-cal-month {
  margin: 0 0 12px !important;
  padding-left: 2px !important;
  font-size: 17px !important;
  line-height: 1.08 !important;
  letter-spacing: -0.012em !important;
  font-weight: 670 !important;
  color: #204265 !important;
  text-transform: lowercase !important;
}

#system360-app .s360-home-cal-weekdays {
  gap: 6px !important;
  margin-bottom: 8px !important;
}

#system360-app .s360-home-cal-weekdays > span {
  font-size: 13px !important;
  font-weight: 650 !important;
  letter-spacing: 0.02em !important;
  color: #7f95ae !important;
}

#system360-app .s360-home-cal-grid {
  gap: 7px !important;
  margin-bottom: 14px !important;
}

#system360-app .s360-home-cal-day {
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 9px !important;
  border: 1px solid rgba(152, 182, 221, 0.56) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(236, 245, 255, 0.78)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 8px 14px rgba(20, 48, 83, 0.1) !important;
  padding: 4px 2px !important;
  gap: 2px !important;
  overflow: hidden !important;
}

#system360-app .s360-home-cal-day.is-empty {
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
}

#system360-app .s360-home-cal-day:hover:not(.is-empty) {
  border-color: rgba(112, 153, 207, 0.78) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(223, 237, 254, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.98), 0 11px 18px rgba(20, 48, 83, 0.16) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-home-cal-day.is-selected {
  border-color: rgba(74, 129, 201, 0.84) !important;
  background: linear-gradient(180deg, rgba(232, 244, 255, 0.98), rgba(209, 229, 252, 0.92)) !important;
  box-shadow: inset 0 0 0 1px rgba(58, 117, 196, 0.18), 0 10px 17px rgba(20, 48, 83, 0.18) !important;
}

#system360-app .s360-home-cal-day.is-today {
  border-color: rgba(59, 130, 246, 0.76) !important;
}

#system360-app .s360-home-cal-day.is-today .s360-home-cal-num {
  color: #0f5ec6 !important;
}

#system360-app .s360-home-cal-num {
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  color: #1d4f85 !important;
}

#system360-app .s360-home-cal-meta {
  min-height: 19px !important;
  gap: 1px !important;
}

#system360-app .s360-home-cal-meta > small {
  min-height: 13px !important;
  border-radius: 999px !important;
  padding: 0 4px !important;
  font-size: 9px !important;
  line-height: 1.12 !important;
  font-weight: 650 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#system360-app .s360-home-cal-meta > small.agenda {
  color: #1d5dac !important;
  background: rgba(221, 237, 255, 0.9) !important;
}

#system360-app .s360-home-cal-meta > small.worked {
  color: #2f8a4b !important;
  background: rgba(215, 249, 225, 0.9) !important;
}

#system360-app .s360-home-cal-selected {
  border-radius: 16px !important;
  border: 1px solid rgba(170, 194, 225, 0.54) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(241, 248, 255, 0.84)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
  padding: 10px !important;
  gap: 8px !important;
}

#system360-app .s360-home-cal-selected-head {
  min-width: 0 !important;
  gap: 8px !important;
}

#system360-app .s360-home-cal-selected-head strong {
  font-size: 14px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
  color: #102a48 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#system360-app .s360-home-cal-selected-head span {
  font-size: 12px !important;
  font-weight: 560 !important;
  color: #6e85a1 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#system360-app .s360-home-cal-selected-metrics {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

#system360-app .s360-home-cal-selected-metrics > div {
  border-radius: 12px !important;
  border: 1px solid rgba(176, 198, 227, 0.52) !important;
  background: rgba(255, 255, 255, 0.85) !important;
  padding: 6px 7px !important;
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}

#system360-app .s360-home-cal-selected-metrics > div > span {
  font-size: 10px !important;
  color: #7a90ab !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#system360-app .s360-home-cal-selected-metrics > div > strong {
  font-size: 12px !important;
  color: #183a5e !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#system360-app .s360-home-cal-agenda-list {
  gap: 6px !important;
}

#system360-app .s360-home-cal-agenda-item {
  border-radius: 12px !important;
  border: 1px solid rgba(176, 198, 227, 0.5) !important;
  background: rgba(252, 254, 255, 0.86) !important;
  padding: 6px 7px !important;
  min-width: 0 !important;
}

#system360-app .s360-home-cal-agenda-item > strong {
  display: block !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  color: #204265 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#system360-app .s360-home-cal-agenda-item > span {
  display: block !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  color: #6f86a1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#system360-app .s360-home-cal-selected .s360-muted {
  font-size: 11px !important;
  line-height: 1.25 !important;
}

/* ===== ATC subsections: remove panel chrome ===== */
#system360-app .s360-atc-shell.is-subsection-clean,
#system360-app .s360-atc-shell.is-subsection-clean .s360-panel {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-seguimientos-wrap {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-seguimientos-wrap > .s360-table,
#system360-app .s360-atc-shell.is-subsection-clean .s360-seguimientos-wrap > .s360-table-follow,
#system360-app .s360-atc-shell.is-subsection-clean .s360-seguimientos-wrap > .s360-table-sales,
#system360-app .s360-atc-shell.is-subsection-clean .s360-seguimientos-wrap > table {
  border: 1px solid rgba(160, 188, 224, 0.62) !important;
  border-radius: 12px !important;
  background: #f7fbff !important;
  background-image: none !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

#system360-app .s360-atc-shell.is-subsection-clean :is(.s360-table thead th:first-child, .s360-table-follow thead th:first-child, .s360-table-sales thead th:first-child, table thead th:first-child) {
  border-top-left-radius: 12px !important;
}

#system360-app .s360-atc-shell.is-subsection-clean :is(.s360-table thead th:last-child, .s360-table-follow thead th:last-child, .s360-table-sales thead th:last-child, table thead th:last-child) {
  border-top-right-radius: 12px !important;
}

#system360-app .s360-atc-shell.is-subsection-clean :is(.s360-table th, .s360-table-follow th, .s360-table-sales th, table th) {
  background: #edf4ff !important;
}

#system360-app .s360-atc-shell.is-subsection-clean :is(.s360-table td, .s360-table-follow td, .s360-table-sales td, table td) {
  background: #f7fbff !important;
}

#system360-app .s360-atc-shell.is-subsection-clean :is(.s360-table tbody tr:hover td, .s360-table-follow tbody tr:hover td, .s360-table-sales tbody tr:hover td, table tbody tr:hover td) {
  background: #edf5ff !important;
}

/* ===== ATC top section tabs: compact and organized ===== */
#system360-app .s360-atc-shell .s360-atc-section-actions {
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
}

#system360-app .s360-atc-shell .s360-atc-section-tabs {
  width: min(100%, calc(100% - 132px)) !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 1 1 560px !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
  align-self: center !important;
}

#system360-app .s360-atc-shell .s360-atc-section-tabs .s360-folder-tab {
  flex: 0 0 auto !important;
  min-width: max-content !important;
}

#system360-app .s360-atc-shell .s360-atc-section-actions #s360-atc-refresh {
  flex: 0 0 auto !important;
  margin: 0 !important;
  align-self: center !important;
}

@media (max-width: 1100px) {
  #system360-app .s360-atc-shell .s360-atc-section-tabs {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: 100% !important;
  }
}

/* ===== ATC bases: paging + row index ===== */
#system360-app :is(.s360-atc-shell.is-subsection-clean, .s360-quality-shell, .s360-cobranza-shell, .s360-backoffice-board, .s360-bases-panel) :is(.s360-atc-indexed-table thead th:first-child) {
  width: 56px !important;
  text-align: center !important;
}

#system360-app :is(.s360-atc-shell.is-subsection-clean, .s360-quality-shell, .s360-cobranza-shell, .s360-backoffice-board, .s360-bases-panel) :is(.s360-atc-indexed-table tbody td:first-child) {
  text-align: center !important;
  font-weight: 700 !important;
  color: #2b557f !important;
  white-space: nowrap !important;
}

#system360-app .s360-atcdb-pager {
  margin-top: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

#system360-app .s360-atcdb-pager-center {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 12px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(158, 183, 218, 0.55) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(240, 248, 255, 0.5)) !important;
  box-shadow: 0 8px 20px rgba(44, 84, 124, 0.12) !important;
  backdrop-filter: blur(9px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(9px) saturate(120%) !important;
}

#system360-app .s360-atcdb-page-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 124px !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(143, 172, 211, 0.62) !important;
  background: rgba(248, 252, 255, 0.96) !important;
  color: #244d74 !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  line-height: 1 !important;
}

#system360-app .s360-atcdb-page-meta {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #5d7b99 !important;
  letter-spacing: 0.01em !important;
  white-space: nowrap !important;
}

#system360-app .s360-atcdb-pager-btn {
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border-radius: 11px !important;
  border: 1px solid rgba(145, 174, 212, 0.64) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(234, 245, 255, 0.86)) !important;
  color: #2e5a86 !important;
  font-size: 20px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 8px 18px rgba(41, 79, 117, 0.16) !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease !important;
}

#system360-app .s360-atcdb-pager-btn:hover:not(:disabled) {
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 20px rgba(36, 75, 113, 0.22) !important;
}

#system360-app .s360-atcdb-pager-btn:disabled {
  opacity: 0.45 !important;
  cursor: default !important;
  box-shadow: none !important;
}

#system360-app .s360-db-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 10px !important;
}

#system360-app .s360-db-toolbar > label {
  min-width: 180px !important;
}

#system360-app .s360-db-toolbar :is(.s360-input, .s360-select) {
  width: 100% !important;
}

@media (max-width: 980px) {
  #system360-app .s360-db-toolbar > label {
    width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 100% !important;
  }
}

#system360-app :is([data-atc-val-col-menu], [data-atc-db-col-menu], [data-lead-base-col-menu], [data-quality-main-col-menu], [data-quality-perf-col-menu]) {
  z-index: 3500 !important;
}

#system360-app .s360-atc-horizontal-wrap {
  overflow-x: auto !important;
  overflow-y: visible !important;
}

/* ===== ATC bases: strict horizontal mode (no wrap rows) ===== */
#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
  scrollbar-gutter: stable both-edges !important;
  padding-bottom: 6px !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(117, 154, 198, 0.8) rgba(228, 239, 252, 0.66) !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap::-webkit-scrollbar {
  width: 10px !important;
  height: 10px !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap::-webkit-scrollbar-track {
  background: rgba(228, 239, 252, 0.66) !important;
  border-radius: 999px !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(137, 170, 211, 0.95), rgba(112, 150, 194, 0.9)) !important;
  border-radius: 999px !important;
  border: 1px solid rgba(236, 244, 254, 0.94) !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap > .s360-atc-indexed-table {
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  table-layout: auto !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap > table {
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  table-layout: auto !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap :is(.s360-atc-indexed-table th, .s360-atc-indexed-table td) {
  white-space: nowrap !important;
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap .s360-atcdb-trace {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  max-width: 100% !important;
  padding-bottom: 2px !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap .s360-atcdb-trace > * {
  flex: 0 0 auto !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap :is(.s360-atc-indexed-table td .s360-flex, table td .s360-flex) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  width: max-content !important;
}

#system360-app .s360-atc-shell.is-subsection-clean .s360-atc-horizontal-wrap :is(.s360-atc-indexed-table td .s360-btn, table td .s360-btn) {
  flex: 0 0 auto !important;
}

#system360-app .s360-atc-shell .s360-atc-validation-table th:nth-child(3),
#system360-app .s360-atc-shell .s360-atc-validation-table td:nth-child(3) {
  min-width: 220px !important;
}

#system360-app .s360-atc-shell .s360-atc-validation-table th:nth-child(4),
#system360-app .s360-atc-shell .s360-atc-validation-table td:nth-child(4) {
  min-width: 145px !important;
}

#system360-app .s360-atc-shell .s360-atc-validation-table th:nth-child(8),
#system360-app .s360-atc-shell .s360-atc-validation-table td:nth-child(8) {
  min-width: 190px !important;
}

#system360-app .s360-atc-shell .s360-atc-validation-table th:nth-child(10),
#system360-app .s360-atc-shell .s360-atc-validation-table td:nth-child(10) {
  min-width: 178px !important;
}

#system360-app .s360-atc-shell .s360-atc-validation-table th:nth-child(11),
#system360-app .s360-atc-shell .s360-atc-validation-table td:nth-child(11) {
  min-width: 166px !important;
}

#system360-app .s360-atc-shell .s360-atc-validation-table th:nth-child(12),
#system360-app .s360-atc-shell .s360-atc-validation-table td:nth-child(12) {
  min-width: 92px !important;
  text-align: center !important;
}

#system360-app .s360-atc-shell .s360-atc-validation-table th:nth-child(13),
#system360-app .s360-atc-shell .s360-atc-validation-table td:nth-child(13) {
  min-width: 154px !important;
}

#system360-app .s360-atc-shell .s360-atc-action-row {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
}

#system360-app .s360-atc-shell .s360-atc-icon-btn {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  border: 1px solid rgba(145, 176, 214, 0.62) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(233, 245, 255, 0.84)) !important;
  color: #2f5d88 !important;
  box-shadow: 0 8px 16px rgba(31, 64, 98, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease !important;
}

#system360-app .s360-atc-shell .s360-atc-icon-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 18px rgba(28, 62, 96, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

#system360-app .s360-atc-shell .s360-atc-icon-btn .s360-svg-icon {
  width: 15px !important;
  height: 15px !important;
}

#system360-app .s360-atc-shell .s360-atc-icon-btn.is-history {
  border-color: rgba(117, 166, 228, 0.6) !important;
}

#system360-app .s360-atc-shell .s360-atc-icon-btn.is-transition {
  border-color: rgba(127, 170, 224, 0.62) !important;
  color: #2f5b84 !important;
}

#system360-app .s360-atc-shell .s360-atc-icon-btn.is-edit {
  border-color: rgba(114, 176, 153, 0.62) !important;
  color: #1f6b54 !important;
}

#system360-app .s360-atc-shell .s360-atc-icon-btn.is-flow {
  border-color: rgba(137, 160, 228, 0.62) !important;
  color: #325894 !important;
}

#system360-app .s360-atc-shell .s360-atc-sign-ttl {
  display: inline-grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 2px !important;
  width: 168px !important;
  min-width: 168px !important;
  min-height: 52px !important;
  padding: 5px 8px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(140, 177, 221, 0.56) !important;
  background: linear-gradient(180deg, rgba(248, 252, 255, 0.95), rgba(233, 244, 255, 0.84)) !important;
  align-content: center !important;
}

#system360-app .s360-atc-shell .s360-atc-sign-ttl-label {
  font-size: 10px !important;
  line-height: 1.1 !important;
  color: #5f7d9c !important;
  font-weight: 600 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

#system360-app .s360-atc-shell .s360-atc-sign-ttl-time {
  display: block !important;
  font-size: 15px !important;
  line-height: 1.1 !important;
  color: #28567f !important;
  font-weight: 760 !important;
  letter-spacing: 0.01em !important;
  text-align: center !important;
  min-width: 10ch !important;
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" 1, "lnum" 1 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
}

#system360-app .s360-atc-shell .s360-atc-sign-ttl.is-overdue {
  border-color: rgba(231, 104, 116, 0.56) !important;
  background: linear-gradient(180deg, rgba(255, 247, 248, 0.96), rgba(255, 235, 238, 0.9)) !important;
}

#system360-app .s360-atc-shell .s360-atc-sign-ttl.is-overdue .s360-atc-sign-ttl-time {
  color: #b42336 !important;
}

#system360-app .s360-atc-shell .s360-atc-sign-ttl.is-done {
  border-color: rgba(104, 196, 146, 0.62) !important;
  background: linear-gradient(180deg, rgba(246, 255, 250, 0.96), rgba(231, 248, 238, 0.9)) !important;
}

#system360-app .s360-atc-shell .s360-atc-sign-ttl.is-done .s360-atc-sign-ttl-time {
  color: #1f7a4f !important;
}

#system360-app .s360-atc-shell .s360-atc-take-countdown {
  --s360-atc-take-hue: 136;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 94px !important;
  min-width: 94px !important;
  height: 32px !important;
  padding: 0 8px !important;
  border: 1px solid hsl(var(--s360-atc-take-hue), 68%, 31%) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, hsl(var(--s360-atc-take-hue), 72%, 42%), hsl(var(--s360-atc-take-hue), 76%, 33%)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 6px 12px rgba(20, 45, 36, 0.12) !important;
  color: #fff !important;
  cursor: default !important;
  opacity: 1 !important;
  white-space: nowrap !important;
}

#system360-app .s360-atc-shell .s360-atc-take-countdown-time {
  display: block !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" 1, "lnum" 1 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
}

#system360-app .s360-atc-shell .s360-atc-take-countdown.is-overdue {
  --s360-atc-take-hue: 0;
  border-color: #991b1b !important;
  background: linear-gradient(180deg, #dc2626, #991b1b) !important;
}

#system360-app .s360-atc-flow-modal {
  display: block !important;
}

#system360-app .s360-modal.s360-modal-atc-flow {
  width: min(1620px, 98.5vw) !important;
  max-height: 94vh !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-modal-body {
  max-height: calc(94vh - 72px) !important;
  padding: 16px 20px 20px !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-kpis .s360-card {
  min-height: 112px !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-kpis .s360-card .k {
  font-size: 14px !important;
  line-height: 1.25 !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-kpis .s360-card .v {
  font-size: clamp(24px, 1.85vw, 32px) !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-kpis .s360-card.is-updated .v {
  font-size: clamp(20px, 1.4vw, 26px) !important;
  font-variant-numeric: tabular-nums !important;
}

#system360-app .s360-atc-flow-modal .s360-grid-2 {
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr) !important;
  align-items: start !important;
}

#system360-app .s360-atc-flow-timeline {
  max-height: min(66vh, 620px) !important;
  overflow: auto !important;
  display: grid !important;
  gap: 10px !important;
  padding-right: 4px !important;
}

#system360-app .s360-atc-flow-item {
  display: grid !important;
  grid-template-columns: 12px minmax(0, 1fr) !important;
  gap: 10px !important;
}

#system360-app .s360-atc-flow-item .dot {
  width: 10px !important;
  height: 10px !important;
  border-radius: 999px !important;
  margin-top: 6px !important;
  background: linear-gradient(180deg, #4d84c7, #35679d) !important;
  box-shadow: 0 0 0 4px rgba(64, 115, 180, 0.16) !important;
}

#system360-app .s360-atc-flow-item .body {
  border: 1px solid rgba(151, 181, 216, 0.46) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(240, 248, 255, 0.76)) !important;
  padding: 9px 10px !important;
}

#system360-app .s360-atc-flow-item .top {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

#system360-app .s360-atc-flow-item .top > strong {
  font-size: 12px !important;
  color: #173a61 !important;
}

#system360-app .s360-atc-flow-item .top > span,
#system360-app .s360-atc-flow-item .meta {
  font-size: 11px !important;
  color: #637f9d !important;
}

#system360-app .s360-atc-flow-item .body p {
  margin: 6px 0 0 !important;
  color: #2d4867 !important;
  font-size: 12px !important;
}

#system360-app .s360-atc-flow-thread-list {
  max-height: min(44vh, 450px) !important;
  overflow: auto !important;
  display: grid !important;
  gap: 8px !important;
  margin-bottom: 10px !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-modal .s360-grid-2 > .s360-panel:last-child {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-content: start !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-modal .s360-grid-2 > .s360-panel:last-child > h3 {
  grid-column: 1 / -1 !important;
  margin-bottom: 2px !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-modal .s360-grid-2 > .s360-panel:last-child > .s360-atc-flow-thread-list {
  grid-column: 1 / -1 !important;
  margin-bottom: 2px !important;
}

#system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-modal .s360-grid-2 > .s360-panel:last-child > .s360-atc-flow-editor {
  margin-top: 0 !important;
}

#system360-app .s360-atc-thread {
  border: 1px solid rgba(153, 181, 214, 0.44) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.9), rgba(237, 247, 255, 0.78)) !important;
  padding: 8px 9px !important;
}

#system360-app .s360-atc-thread .head {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

#system360-app .s360-atc-thread .head strong {
  color: #1a3f66 !important;
  font-size: 12px !important;
}

#system360-app .s360-atc-thread-messages {
  margin-top: 6px !important;
  display: grid !important;
  gap: 6px !important;
}

#system360-app .s360-atc-thread-messages .msg {
  border-radius: 10px !important;
  border: 1px solid rgba(170, 193, 222, 0.38) !important;
  background: rgba(249, 253, 255, 0.86) !important;
  padding: 6px 8px !important;
}

#system360-app .s360-atc-thread-messages .msg-top {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

#system360-app .s360-atc-thread-messages .msg-top strong {
  font-size: 11px !important;
  color: #204a72 !important;
}

#system360-app .s360-atc-thread-messages .msg-top span,
#system360-app .s360-atc-thread-messages .msg p {
  font-size: 11px !important;
  color: #6683a2 !important;
  margin: 2px 0 0 !important;
}

#system360-app .s360-atc-flow-editor {
  margin-top: 10px !important;
  display: grid !important;
  gap: 6px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(163, 188, 216, 0.4) !important;
}

@media (max-width: 1180px) {
  #system360-app .s360-modal.s360-modal-atc-flow {
    width: min(98vw, 1180px) !important;
  }

  #system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #system360-app .s360-atc-flow-modal .s360-grid-2 {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-modal .s360-grid-2 > .s360-panel:last-child {
    grid-template-columns: 1fr !important;
  }
}

/* Alert center: remove legacy light blocks and align with CRM 360 dark glass */
#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-list {
  display: grid !important;
  gap: 14px !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-card {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(80, 113, 184, .62) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(59, 130, 246, .12), transparent 34%),
    radial-gradient(circle at 92% 8%, rgba(236, 72, 153, .10), transparent 30%),
    linear-gradient(180deg, rgba(13, 24, 48, .96), rgba(6, 13, 28, .97)) !important;
  color: #edf5ff !important;
  box-shadow: 0 18px 46px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 0 auto !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(96, 165, 250, .55), rgba(236, 72, 153, .35), transparent) !important;
  pointer-events: none !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-card.is-sla-breached {
  border-color: rgba(244, 63, 94, .56) !important;
  box-shadow: 0 18px 46px rgba(0, 0, 0, .30), 0 0 0 1px rgba(244, 63, 94, .08), inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-card-head {
  position: relative !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin-bottom: 12px !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-card h3,
#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-card-head h3 {
  color: #f8fbff !important;
  letter-spacing: -.025em !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-desc {
  margin: 0 0 12px !important;
  color: #c4d3f2 !important;
  font-weight: 700 !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-meta {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 12px 0 !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-meta > div {
  min-width: 0 !important;
  border: 1px solid rgba(85, 120, 188, .46) !important;
  border-radius: 13px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(96, 165, 250, .11), transparent 48%),
    linear-gradient(145deg, rgba(18, 31, 58, .88), rgba(8, 16, 33, .94)) !important;
  color: #ecf4ff !important;
  padding: 12px 14px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045), 0 10px 22px rgba(0, 0, 0, .16) !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-meta > div span {
  display: block !important;
  margin-bottom: 6px !important;
  color: #8fa6d2 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  letter-spacing: .035em !important;
  text-transform: uppercase !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-meta > div strong {
  display: block !important;
  color: #f8fbff !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-actions {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

#system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-actions .s360-btn:not(.primary):not(.danger):not(.success) {
  border-color: rgba(120, 151, 214, .62) !important;
  background: rgba(10, 20, 40, .72) !important;
  color: #eaf1ff !important;
}

@media (max-width: 820px) {
  #system360-app :is(.s360-time-content, .s360-alert-center-panel, .s360-home-right-sidebar) .s360-alert-center-meta {
    grid-template-columns: 1fr !important;
  }
}

/* 360 CRM premium popup system */
body.s360-modal-open {
  overflow: hidden !important;
}

#system360-app #s360-modal-bg.s360-modal-bg,
#system360-app .s360-modal-bg,
#system360-app .s360-mod-editor-modal-bg {
  position: fixed !important;
  inset: 0 !important;
  z-index: 12000 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(14px, 3vw, 34px) !important;
  background:
    radial-gradient(circle at 22% 18%, rgba(56, 130, 246, .16), transparent 32%),
    radial-gradient(circle at 78% 12%, rgba(236, 72, 153, .12), transparent 30%),
    rgba(4, 8, 18, .74) !important;
  backdrop-filter: blur(18px) saturate(138%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(138%) !important;
  opacity: 0 !important;
}

#system360-app #s360-modal-bg.s360-modal-bg.show,
#system360-app .s360-modal-bg.show,
#system360-app .s360-mod-editor-modal-bg.show {
  display: flex !important;
  opacity: 1 !important;
  animation: s360-popup-backdrop-in .18s ease-out both !important;
}

#system360-app .s360-mod-editor-modal-bg {
  display: flex !important;
  opacity: 1 !important;
  animation: s360-popup-backdrop-in .18s ease-out both !important;
}

#system360-app #s360-modal.s360-modal,
#system360-app .s360-modal,
#system360-app .s360-mod-editor-modal {
  --s360-modal-accent: #7c3aed;
  --s360-modal-accent-2: #ec4899;
  --s360-modal-accent-soft: rgba(124, 58, 237, .18);
  width: min(720px, calc(100vw - 30px)) !important;
  max-width: min(720px, calc(100vw - 30px)) !important;
  max-height: min(88vh, 820px) !important;
  overflow: hidden !important;
  position: relative !important;
  color: #f8fbff !important;
  border: 1px solid rgba(121, 152, 207, .34) !important;
  border-radius: 18px !important;
  background:
    linear-gradient(145deg, rgba(21, 24, 33, .94), rgba(10, 16, 30, .92)),
    radial-gradient(circle at 0 0, var(--s360-modal-accent-soft), transparent 42%) !important;
  box-shadow:
    0 26px 80px rgba(0, 0, 0, .48),
    0 0 0 1px rgba(255, 255, 255, .04) inset,
    0 0 46px color-mix(in srgb, var(--s360-modal-accent) 18%, transparent) !important;
  transform-origin: center !important;
  animation: s360-popup-card-in .24s cubic-bezier(.2, .86, .2, 1.06) both !important;
}

#system360-app #s360-modal.s360-modal::before,
#system360-app .s360-modal::before,
#system360-app .s360-mod-editor-modal::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 0 auto !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, var(--s360-modal-accent), var(--s360-modal-accent-2), transparent) !important;
  opacity: .95 !important;
  pointer-events: none !important;
}

#system360-app #s360-modal.s360-modal-size-sm {
  width: min(450px, calc(100vw - 30px)) !important;
  max-width: min(450px, calc(100vw - 30px)) !important;
}

#system360-app #s360-modal.s360-modal-size-md {
  width: min(760px, calc(100vw - 30px)) !important;
  max-width: min(760px, calc(100vw - 30px)) !important;
}

#system360-app #s360-modal.s360-modal-size-lg,
#system360-app #s360-modal:is(.s360-modal-workflow, .s360-modal-quality, .s360-modal-backoffice, .s360-modal-atc-flow, .s360-modal-drive),
#system360-app .s360-mod-editor-modal {
  width: min(1080px, calc(100vw - 26px)) !important;
  max-width: min(1080px, calc(100vw - 26px)) !important;
}

#system360-app #s360-modal:is(.s360-modal-form360, .s360-modal-atc-flow) {
  max-height: min(94vh, 980px) !important;
}

#system360-app #s360-modal.s360-modal-intent-info {
  --s360-modal-accent: #3b82f6;
  --s360-modal-accent-2: #60a5fa;
  --s360-modal-accent-soft: rgba(59, 130, 246, .18);
}

#system360-app #s360-modal.s360-modal-intent-success {
  --s360-modal-accent: #22c55e;
  --s360-modal-accent-2: #16a34a;
  --s360-modal-accent-soft: rgba(34, 197, 94, .18);
}

#system360-app #s360-modal.s360-modal-intent-warning {
  --s360-modal-accent: #f59e0b;
  --s360-modal-accent-2: #fb923c;
  --s360-modal-accent-soft: rgba(245, 158, 11, .18);
}

#system360-app #s360-modal.s360-modal-intent-danger {
  --s360-modal-accent: #f43f5e;
  --s360-modal-accent-2: #ec4899;
  --s360-modal-accent-soft: rgba(244, 63, 94, .2);
}

#system360-app #s360-modal.s360-modal-intent-system {
  --s360-modal-accent: #8b5cf6;
  --s360-modal-accent-2: #ec4899;
  --s360-modal-accent-soft: rgba(139, 92, 246, .18);
}

#system360-app .s360-modal-head,
#system360-app .s360-mod-editor-modal > header,
#system360-app .s360-mod-editor-modal .s360-mod-editor-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 22px 24px 16px !important;
  border-bottom: 1px solid rgba(129, 160, 213, .2) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .015)),
    radial-gradient(circle at 16px 0, var(--s360-modal-accent-soft), transparent 40%) !important;
}

#system360-app .s360-modal-titlebar {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  min-width: 0 !important;
}

#system360-app .s360-modal-head h3,
#system360-app .s360-modal-head h2,
#system360-app .s360-mod-editor-modal h3 {
  margin: 0 !important;
  color: #f9fbff !important;
  font-size: clamp(18px, 2.2vw, 24px) !important;
  line-height: 1.12 !important;
  font-weight: 850 !important;
  letter-spacing: -.03em !important;
}

#system360-app .s360-modal-head p,
#system360-app .s360-mod-editor-modal header p,
#system360-app .s360-modal-head small {
  margin: 7px 0 0 !important;
  color: #aebde0 !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

#system360-app .s360-modal-intent-icon {
  width: 46px !important;
  height: 46px !important;
  flex: 0 0 46px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 14px !important;
  color: #fff !important;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--s360-modal-accent) 92%, #fff 8%), var(--s360-modal-accent-2)),
    rgba(255, 255, 255, .08) !important;
  box-shadow:
    0 12px 30px color-mix(in srgb, var(--s360-modal-accent) 34%, transparent),
    0 0 0 1px rgba(255, 255, 255, .14) inset !important;
}

#system360-app .s360-modal-intent-icon :is(svg, .material-symbols-rounded, .material-icons) {
  width: 22px !important;
  height: 22px !important;
  font-size: 22px !important;
}

#system360-app .s360-modal-close,
#system360-app #s360-modal-close,
#system360-app .s360-mod-editor-modal [aria-label="Cerrar"] {
  width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(153, 178, 223, .28) !important;
  background: rgba(12, 18, 32, .72) !important;
  color: #b8c7e8 !important;
  font-size: 22px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: transform .18s ease, color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease !important;
}

#system360-app .s360-modal-close:hover,
#system360-app #s360-modal-close:hover,
#system360-app .s360-mod-editor-modal [aria-label="Cerrar"]:hover {
  transform: translateY(-1px) !important;
  color: #fff !important;
  border-color: color-mix(in srgb, var(--s360-modal-accent) 54%, transparent) !important;
  background: rgba(24, 32, 52, .92) !important;
  box-shadow: 0 0 22px color-mix(in srgb, var(--s360-modal-accent) 22%, transparent) !important;
}

#system360-app .s360-modal-body {
  padding: 20px 24px 24px !important;
  color: #d9e3f7 !important;
  overflow: auto !important;
  max-height: calc(min(88vh, 820px) - 84px) !important;
  scrollbar-color: rgba(139, 92, 246, .65) rgba(15, 23, 42, .45) !important;
}

#system360-app .s360-modal-action-body {
  text-align: center !important;
  padding: 24px 28px 26px !important;
}

#system360-app .s360-modal-message {
  margin: 0 auto 18px !important;
  max-width: 560px !important;
  color: #c9d5ee !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}

#system360-app .s360-modal-danger-box {
  margin: 18px 0 20px !important;
  padding: 16px 18px !important;
  text-align: left !important;
  border-radius: 16px !important;
  border: 1px solid color-mix(in srgb, var(--s360-modal-accent) 38%, transparent) !important;
  background: linear-gradient(145deg, color-mix(in srgb, var(--s360-modal-accent) 14%, transparent), rgba(15, 23, 42, .58)) !important;
  color: #ffd6df !important;
}

#system360-app .s360-modal-danger-box strong {
  display: block !important;
  margin-bottom: 8px !important;
  color: #fff !important;
}

#system360-app .s360-modal-danger-box ul {
  margin: 0 !important;
  padding-left: 18px !important;
}

#system360-app .s360-modal-danger-box li {
  margin: 5px 0 !important;
}

#system360-app .s360-modal-actions,
#system360-app .s360-modal-action-body .s360-flex,
#system360-app .s360-modal-body > .s360-flex:last-child {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin-top: 18px !important;
}

#system360-app .s360-modal-action-body .s360-modal-actions,
#system360-app .s360-modal-action-body .s360-flex {
  justify-content: center !important;
}

#system360-app .s360-modal :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea):not([type="checkbox"]):not([type="radio"]) {
  border-radius: 12px !important;
  border: 1px solid rgba(133, 162, 216, .28) !important;
  background: rgba(7, 12, 24, .58) !important;
  color: #f8fbff !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .025) inset !important;
}

#system360-app .s360-modal :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea):focus {
  outline: none !important;
  border-color: color-mix(in srgb, var(--s360-modal-accent) 70%, #fff 8%) !important;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--s360-modal-accent) 20%, transparent),
    0 0 24px color-mix(in srgb, var(--s360-modal-accent) 14%, transparent) !important;
}

#system360-app .s360-modal .s360-label {
  color: #eef4ff !important;
  font-weight: 750 !important;
}

#system360-app .s360-modal :is(.s360-card, .s360-panel, .s360-box, .s360-alert, .s360-modal-note) {
  border-color: rgba(132, 164, 218, .24) !important;
  background: linear-gradient(145deg, rgba(20, 27, 45, .72), rgba(9, 14, 27, .58)) !important;
}

#system360-app .s360-modal .s360-btn,
#system360-app .s360-mod-editor-modal .s360-btn {
  min-height: 38px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(149, 174, 217, .26) !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}

#system360-app .s360-modal .s360-btn:hover,
#system360-app .s360-mod-editor-modal .s360-btn:hover {
  transform: translateY(-1px) !important;
}

#system360-app .s360-modal .s360-btn.sec {
  background: rgba(13, 20, 36, .72) !important;
  color: #dce7fb !important;
}

#system360-app .s360-modal .s360-btn.primary,
#system360-app .s360-modal .s360-btn.ok,
#system360-app .s360-modal .s360-btn:not(.sec):not(.danger):not(.warn):not(.ghost) {
  color: #fff !important;
  border-color: color-mix(in srgb, var(--s360-modal-accent) 48%, transparent) !important;
  background: linear-gradient(135deg, #3862f6, #8b5cf6 54%, #ec4899) !important;
  box-shadow: 0 12px 30px rgba(124, 58, 237, .28) !important;
}

#system360-app .s360-modal .s360-btn.ok {
  background: linear-gradient(135deg, #16a34a, #22c55e) !important;
  box-shadow: 0 12px 28px rgba(34, 197, 94, .22) !important;
}

#system360-app .s360-modal .s360-btn.warn {
  color: #fff !important;
  border-color: rgba(245, 158, 11, .46) !important;
  background: linear-gradient(135deg, #b45309, #f59e0b) !important;
  box-shadow: 0 12px 28px rgba(245, 158, 11, .22) !important;
}

#system360-app .s360-modal .s360-btn.danger {
  color: #fff !important;
  border-color: rgba(244, 63, 94, .52) !important;
  background: linear-gradient(135deg, #be123c, #f43f5e 55%, #ec4899) !important;
  box-shadow: 0 12px 30px rgba(244, 63, 94, .28) !important;
}

#system360-app #s360-modal.s360-modal-nudge {
  animation: s360-modal-nudge .24s ease both !important;
}

@keyframes s360-popup-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes s360-popup-card-in {
  from {
    opacity: 0;
    transform: translateY(18px) scale(.965);
    filter: blur(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

@keyframes s360-modal-nudge {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-7px); }
  55% { transform: translateX(7px); }
  80% { transform: translateX(-3px); }
}

@media (max-width: 760px) {
  #system360-app #s360-modal-bg.s360-modal-bg,
  #system360-app .s360-modal-bg {
    align-items: flex-end !important;
    padding: 10px !important;
  }

  #system360-app #s360-modal.s360-modal,
  #system360-app .s360-modal,
  #system360-app .s360-mod-editor-modal {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 92vh !important;
    border-radius: 20px 20px 14px 14px !important;
  }

  #system360-app .s360-modal-head {
    padding: 18px 18px 13px !important;
  }

  #system360-app .s360-modal-body {
    padding: 17px 18px 20px !important;
    max-height: calc(92vh - 76px) !important;
  }

  #system360-app .s360-modal-titlebar {
    align-items: flex-start !important;
  }

  #system360-app .s360-modal-intent-icon {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
    border-radius: 12px !important;
  }

  #system360-app .s360-modal-actions,
  #system360-app .s360-modal-action-body .s360-flex,
  #system360-app .s360-modal-body > .s360-flex:last-child {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-modal-actions .s360-btn,
  #system360-app .s360-modal-action-body .s360-flex .s360-btn,
  #system360-app .s360-modal-body > .s360-flex:last-child .s360-btn {
    width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #system360-app #s360-modal-bg.show,
  #system360-app #s360-modal.s360-modal,
  #system360-app .s360-modal {
    animation: none !important;
  }
}

/* Login micro loader: keep motion enabled after global animation hard-stop */
#system360-app .s360-login-loading .s360-loading-orb.is-compact {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 26px !important;
}

#system360-app .s360-login-loading .s360-login-micro-loader {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  display: inline-block !important;
  border-radius: 999px !important;
  border: 2px solid rgba(113, 143, 205, .32) !important;
  border-top-color: #7c3aed !important;
  border-right-color: #38bdf8 !important;
  box-shadow: 0 0 14px rgba(124, 58, 237, .24) !important;
  animation: s360-login-micro-spin .72s linear infinite !important;
  transform-origin: 50% 50% !important;
}

#system360-app .s360-login-loading .s360-login-loading-text {
  color: #6f80a5 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  animation: s360-login-loading-pulse 1.45s ease-in-out infinite !important;
}

@keyframes s360-login-micro-spin {
  to { transform: rotate(360deg); }
}

@keyframes s360-login-loading-pulse {
  0%, 100% { opacity: .72; }
  50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  #system360-app .s360-login-loading .s360-login-micro-loader,
  #system360-app .s360-login-loading .s360-login-loading-text {
    animation-duration: 1.8s !important;
  }
}

@media (max-width: 980px) {
  #system360-app .s360-modal.s360-modal-atc-flow {
    width: min(98vw, 980px) !important;
    max-height: 92vh !important;
  }

  #system360-app .s360-modal.s360-modal-atc-flow .s360-modal-body {
    max-height: calc(92vh - 72px) !important;
    padding: 14px 14px 16px !important;
  }

  #system360-app .s360-modal.s360-modal-atc-flow .s360-atc-flow-kpis {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  }

  #system360-app .s360-atc-flow-modal .s360-grid-2 {
    grid-template-columns: 1fr !important;
  }
}

/* Stability hard-stop: avoid visual blinking on rerenders */
html,
body,
#system360-app,
#system360-app * {
  scroll-behavior: auto !important;
}

#system360-app *,
#system360-app *::before,
#system360-app *::after {
  animation: none !important;
  transition: none !important;
}

/* Keep loader motion alive (login + global overlay) */
#system360-app .s360-loader360-ring {
  animation: s360LogoLoaderSpin 1.18s linear infinite !important;
}

#system360-app .s360-loader360-core {
  animation: s360LogoLoaderCore 1.9s ease-in-out infinite !important;
}

#system360-app .s360-login-loading .s360-login-micro-loader {
  animation: s360-login-micro-spin .72s linear infinite !important;
}

#system360-app .s360-login-loading .s360-login-loading-text {
  animation: s360-login-loading-pulse 1.45s ease-in-out infinite !important;
}

/* Modern loading animation (manual/real data refresh only) */
#system360-app .s360-app-system .s360-loading-layer {
  position: absolute !important;
  inset: 0 !important;
  z-index: 85 !important;
  border-radius: 24px !important;
  display: grid !important;
  place-items: center !important;
  gap: 12px !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background:
    radial-gradient(120% 100% at 50% -14%, rgba(54, 86, 170, 0.34), transparent 56%),
    linear-gradient(180deg, rgba(2, 7, 20, 0.95), rgba(2, 7, 18, 0.97)) !important;
  backdrop-filter: blur(8px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(120%) !important;
  animation: s360-load-modern-fade 180ms ease-out both !important;
}

#system360-app .s360-app-system .s360-loading-layer::before {
  content: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-orb,
#system360-app .s360-app-system .s360-loading-layer .s360-loading-main {
  width: min(720px, 92%) !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-grid {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  min-height: 0 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-state-panel {
  display: none !important;
}

#system360-app .s360-app-system .s360-loading-layer::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0) 38%),
    radial-gradient(circle at 50% 55%, rgba(77, 171, 247, 0.2), rgba(77, 171, 247, 0) 58%) !important;
  animation: s360-load-modern-glow 2.2s ease-in-out infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360 {
  position: relative !important;
  --s360-loader-size: 314px !important;
  --s360-loader-thickness: 3px !important;
  width: var(--s360-loader-size) !important;
  height: var(--s360-loader-size) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-core {
  inset: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 24px !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-text {
  position: relative !important;
  z-index: 1 !important;
  margin-top: 6px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #d7e2f7 !important;
  background: none !important;
  animation: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-text::after {
  content: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-headline,
#system360-app .s360-app-system .s360-loading-layer .s360-loading-phase-note {
  display: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-percent {
  margin-top: 8px !important;
  color: #8c68ff !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  text-shadow: 0 0 14px rgba(140, 104, 255, 0.54) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress {
  width: min(570px, 92%) !important;
  height: 6px !important;
  border: 0 !important;
  background: rgba(23, 34, 72, 0.82) !important;
  box-shadow: inset 0 0 10px rgba(18, 31, 76, 0.92), 0 0 16px rgba(42, 102, 255, 0.18) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress > span {
  box-shadow: 0 0 10px rgba(31, 196, 255, 0.82), 0 0 18px rgba(122, 79, 255, 0.68), 0 0 22px rgba(255, 87, 184, 0.48) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-subtext {
  margin-top: 6px !important;
  font-size: 13px !important;
  color: #93a5c8 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-logo {
  width: min(190px, 68%) !important;
  max-height: 135px !important;
  object-fit: contain !important;
  filter: brightness(1.08) drop-shadow(0 0 18px rgba(126, 98, 255, 0.32)) drop-shadow(0 7px 18px rgba(1, 8, 24, 0.5)) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-core-text {
  max-width: 190px !important;
  color: #f2f6ff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  text-shadow: 0 0 12px rgba(92, 126, 255, 0.34) !important;
}

@keyframes s360-load-modern-fade {
  from { opacity: 0; transform: scale(0.995); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes s360-load-modern-bar {
  0% { left: -35%; opacity: 0.25; }
  45% { opacity: 1; }
  100% { left: 100%; opacity: 0.2; }
}

@keyframes s360-load-modern-glow {
  0%, 100% { opacity: 0.6; }
  50% { opacity: 1; }
}

@keyframes s360-load-modern-orbit {
  to { transform: rotate(360deg); }
}

@keyframes s360-load-modern-orbit-reverse {
  to { transform: rotate(-360deg); }
}

@keyframes s360-load-modern-text {
  from { background-position: 0% 50%; }
  to { background-position: 220% 50%; }
}

@keyframes s360-load-modern-dots {
  0% { opacity: 0.25; }
  25% { opacity: 0.55; }
  50% { opacity: 0.8; }
  75%, 100% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  #system360-app .s360-loader360-ring,
  #system360-app .s360-loader360-core,
  #system360-app .s360-app-system .s360-loading-layer,
  #system360-app .s360-app-system .s360-loading-layer::before,
  #system360-app .s360-app-system .s360-loading-layer::after,
  #system360-app .s360-app-system .s360-loading-layer .s360-loader360,
  #system360-app .s360-app-system .s360-loading-layer .s360-loading-text,
  #system360-app .s360-app-system .s360-loading-layer .s360-loading-text::after {
    animation: none !important;
  }
}

/* ===== System 360 brand logos (CRM 360) ===== */
#system360-app .s360-brand::before {
  content: none !important;
}

#system360-app .s360-brand-logo {
  display: block !important;
  height: auto !important;
  object-fit: contain !important;
  pointer-events: none !important;
}

#system360-app .s360-brand-logo-full {
  width: min(152px, 100%) !important;
}

#system360-app .s360-brand-logo-short {
  width: 34px !important;
  max-width: 34px !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-brand-full {
  opacity: 1 !important;
  transform: translateX(0) !important;
  max-width: 152px !important;
  visibility: visible !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-brand-short {
  opacity: 0 !important;
  transform: translateY(-3px) scale(0.96) !important;
  max-width: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

#system360-app .s360-shell.collapsed .s360-brand {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  justify-content: center !important;
}

#system360-app .s360-shell.collapsed .s360-brand-full {
  opacity: 0 !important;
  transform: translateX(6px) !important;
  max-width: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

#system360-app .s360-shell.collapsed .s360-brand-short {
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
  max-width: 34px !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

#system360-app .s360-login-brand {
  display: grid !important;
  gap: 10px !important;
}

#system360-app .s360-login-logo {
  display: block !important;
  width: min(270px, 90%) !important;
  max-width: 100% !important;
  height: auto !important;
  filter: drop-shadow(0 10px 22px rgba(0, 20, 46, 0.28)) !important;
}

/* ===== Login redesign (reference replica) ===== */
#system360-app .s360-app-login {
  min-height: 100dvh !important;
  padding: 24px 20px 14px !important;
  background:
    radial-gradient(120% 96% at 10% 10%, rgba(199, 216, 243, 0.82), rgba(199, 216, 243, 0) 58%),
    linear-gradient(180deg, #e1e8f3 0%, #d9e2ee 100%) !important;
  display: grid !important;
  align-content: center !important;
  gap: 16px !important;
}

#system360-app .s360-login-shell {
  width: min(1460px, calc(100vw - 56px)) !important;
  min-height: min(860px, calc(100dvh - 104px)) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 0.96fr 1.04fr !important;
  border-radius: 30px !important;
  overflow: hidden !important;
  border: 1px solid rgba(177, 191, 216, 0.45) !important;
  background: #f4f6fa !important;
  box-shadow: 0 30px 68px rgba(20, 36, 66, 0.16) !important;
}

#system360-app .s360-login-shell::before,
#system360-app .s360-login-shell::after {
  content: none !important;
  display: none !important;
}

#system360-app .s360-login-hero {
  position: relative !important;
  overflow: hidden !important;
  padding: 26px 30px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  color: #f8fbff !important;
  background: #02040d url("https://static.wixstatic.com/media/ddf669_9a0d40364a3a4523abb48a54b0c48027~mv2.png") center center / cover no-repeat !important;
}

#system360-app .s360-login-hero::before,
#system360-app .s360-login-hero::after {
  content: none !important;
  display: none !important;
}

#system360-app .s360-login-brand,
#system360-app .s360-login-hero-copy,
#system360-app .s360-login-feature-list {
  position: relative !important;
  z-index: 1 !important;
}

#system360-app .s360-login-logo {
  width: clamp(132px, 11.3vw, 162px) !important;
  height: auto !important;
  filter: none !important;
}

#system360-app .s360-login-hero-copy {
  margin-top: 8px !important;
}

#system360-app .s360-login-hero-copy h2 {
  margin: 0 0 8px !important;
  font-size: clamp(26px, 2.05vw, 40px) !important;
  line-height: 1.14 !important;
  letter-spacing: -0.02em !important;
  font-weight: 680 !important;
  color: #f7fbff !important;
}

#system360-app .s360-login-hero-copy h2 span {
  background: linear-gradient(90deg, #2f7cff, #8e4aff, #ff4c9f) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

#system360-app .s360-login-hero-copy p {
  margin: 0 !important;
  width: min(90%, 470px) !important;
  font-size: clamp(12.6px, 0.82vw, 14.4px) !important;
  line-height: 1.46 !important;
  color: rgba(223, 235, 255, 0.9) !important;
}

#system360-app .s360-login-feature-list {
  display: grid !important;
  gap: 10px !important;
  margin-top: auto !important;
}

#system360-app .s360-login-feature-item {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 9px !important;
}

#system360-app .s360-login-feature-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 11px !important;
  display: grid !important;
  place-items: center !important;
  color: #95bafc !important;
  background: linear-gradient(150deg, rgba(16, 31, 58, 0.9), rgba(10, 18, 34, 0.74)) !important;
  border: 1px solid rgba(157, 176, 211, 0.3) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 8px 16px rgba(4, 9, 21, 0.36) !important;
}

#system360-app .s360-login-feature-icon .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
}

#system360-app .s360-login-feature-item strong {
  display: block !important;
  font-size: clamp(13.5px, 0.84vw, 15.8px) !important;
  color: #fff !important;
}

#system360-app .s360-login-feature-item small {
  display: block !important;
  margin-top: 2px !important;
  font-size: clamp(11.2px, 0.72vw, 12.6px) !important;
  color: rgba(211, 226, 246, 0.9) !important;
}

#system360-app .s360-login-feature-item:nth-child(1) .s360-login-feature-icon { color: #8d6cff !important; }
#system360-app .s360-login-feature-item:nth-child(2) .s360-login-feature-icon { color: #23d18b !important; }
#system360-app .s360-login-feature-item:nth-child(3) .s360-login-feature-icon { color: #ffb02e !important; }

#system360-app .s360-login-form-wrap {
  background: #f4f5f9 !important;
  padding: 38px 52px 30px !important;
  display: grid !important;
  align-content: start !important;
}

#system360-app .s360-login-locale {
  justify-self: end !important;
  min-height: 42px !important;
  padding: 0 13px !important;
  border-radius: 11px !important;
  border: 1px solid #d5dbe7 !important;
  background: #fff !important;
  color: #4f5d72 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

#system360-app .s360-login-locale-icon .s360-svg-icon {
  width: 16px !important;
  height: 16px !important;
}

#system360-app .s360-login-locale-caret {
  display: inline-flex !important;
  transform: rotate(90deg) !important;
  opacity: 0.72 !important;
}

#system360-app .s360-login-locale-caret .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
}

#system360-app .s360-login-form-card {
  width: 100% !important;
  max-width: 600px !important;
  margin: 30px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-login-form-card h3 {
  margin: 0 0 6px !important;
  color: #0f1f3f !important;
  font-size: clamp(29px, 2.05vw, 40px) !important;
  line-height: 1.14 !important;
  letter-spacing: -0.02em !important;
}

#system360-app .s360-login-form-card h3 span {
  font-size: 0.78em !important;
  vertical-align: baseline !important;
}

#system360-app .s360-login-form-card > p {
  margin: 0 0 24px !important;
  color: #627089 !important;
  font-size: clamp(13px, 0.84vw, 15px) !important;
}

#system360-app .s360-login-form-card label {
  margin: 0 0 9px !important;
  display: block !important;
  color: #2d3748 !important;
  font-size: clamp(13.4px, 0.8vw, 15px) !important;
  font-weight: 640 !important;
}

#system360-app .s360-login-form-card label[for="s360-p"] {
  margin-top: 24px !important;
}

#system360-app .s360-login-input-wrap {
  min-height: 54px !important;
  border-radius: 13px !important;
  border: 1px solid #d5dcea !important;
  background: #fff !important;
  display: grid !important;
  grid-template-columns: 20px minmax(0, 1fr) 20px !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 14px !important;
  margin: 0 0 16px !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}

#system360-app .s360-login-input-wrap:focus-within {
  border-color: #7ca2ff !important;
  box-shadow: 0 0 0 3px rgba(74, 133, 255, 0.16) !important;
}

#system360-app .s360-login-input-wrap #s360-u,
#system360-app .s360-login-input-wrap #s360-p,
#system360-app .s360-login-input-wrap input {
  width: 100% !important;
  height: 32px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  color: #111827 !important;
  font-size: clamp(14px, 0.86vw, 16px) !important;
  line-height: 1.2 !important;
  transform: none !important;
  outline: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

#system360-app .s360-login-input-wrap input:focus,
#system360-app .s360-login-input-wrap input:active,
#system360-app .s360-login-input-wrap input:focus-visible {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
}

#system360-app .s360-login-input-wrap input::placeholder {
  color: #9aa4b4 !important;
}

#system360-app .s360-login-input-wrap input::selection {
  background: rgba(58, 109, 255, 0.14) !important;
  color: #111827 !important;
}

#system360-app .s360-login-input-wrap input:-webkit-autofill,
#system360-app .s360-login-input-wrap input:-webkit-autofill:hover,
#system360-app .s360-login-input-wrap input:-webkit-autofill:focus {
  -webkit-text-fill-color: #111827 !important;
  background-color: #ffffff !important;
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
  box-shadow: 0 0 0 1000px #ffffff inset !important;
  background-clip: padding-box !important;
  transition: background-color 9999s ease-out 0s !important;
  caret-color: #111827 !important;
  border-radius: 0 !important;
}

#system360-app .s360-login-input-icon,
#system360-app .s360-login-eye-btn {
  color: #7b8799 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#system360-app .s360-login-input-icon .s360-svg-icon,
#system360-app .s360-login-eye-btn .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
}

#system360-app .s360-login-eye-btn {
  width: 20px !important;
  height: 20px !important;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
  padding: 0 !important;
}

#system360-app .s360-login-meta-row {
  margin-top: 2px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

#system360-app .s360-login-check {
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #566377 !important;
  font-size: clamp(13px, 0.78vw, 14.4px) !important;
  font-weight: 520 !important;
}

#system360-app .s360-login-check input {
  width: 16px !important;
  height: 16px !important;
  accent-color: #3a6dff !important;
}

#system360-app .s360-login-link-btn {
  all: unset !important;
  display: inline-block !important;
  color: #2e63ff !important;
  padding: 0 !important;
  font-size: clamp(13px, 0.78vw, 14.4px) !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transform: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  outline: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

#system360-app .s360-login-link-btn:hover,
#system360-app .s360-login-link-btn:focus,
#system360-app .s360-login-link-btn:focus-visible,
#system360-app .s360-login-link-btn:active {
  background: transparent !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  outline: none !important;
}

#system360-app .s360-login-primary-btn {
  margin-top: 14px !important;
  min-height: 56px !important;
  width: 100% !important;
  border-radius: 13px !important;
  border: 0 !important;
  background: linear-gradient(90deg, #2f63ff 0%, #7b43ef 48%, #e83f95 100%) !important;
  color: #fff !important;
  font-size: clamp(16px, 0.96vw, 18.5px) !important;
  font-weight: 680 !important;
  letter-spacing: 0.01em !important;
  box-shadow: 0 12px 24px rgba(105, 81, 236, 0.26) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

#system360-app .s360-login-primary-btn span .s360-svg-icon {
  width: 18px !important;
  height: 18px !important;
}

#system360-app .s360-login-loading {
  margin-top: 10px !important;
}

#system360-app .s360-login-status {
  margin-top: 10px !important;
  min-height: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #6d7687 !important;
  font-size: 11px !important;
}

#system360-app .s360-login-status:empty {
  display: none !important;
}

#system360-app .s360-login-divider {
  margin: 22px 0 14px !important;
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  gap: 10px !important;
  color: #768196 !important;
  font-size: 11.5px !important;
}

#system360-app .s360-login-divider::before,
#system360-app .s360-login-divider::after {
  content: "" !important;
  height: 1px !important;
  background: #d7dde8 !important;
}

#system360-app .s360-login-social-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

#system360-app .s360-login-social-btn {
  min-height: 48px !important;
  border-radius: 11px !important;
  border: 1px solid #d8dee9 !important;
  background: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  color: #253246 !important;
  font-size: clamp(12.4px, 0.74vw, 14px) !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

#system360-app .s360-login-social-icon {
  width: 18px !important;
  height: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

#system360-app .s360-login-social-icon.is-google {
  color: #ea4335 !important;
}

#system360-app .s360-login-social-icon.is-microsoft {
  color: transparent !important;
  font-size: 0 !important;
  border-radius: 2px !important;
  background: conic-gradient(from 90deg, #f25022 0 25%, #7fba00 0 50%, #00a4ef 0 75%, #ffb900 0 100%) !important;
}

#system360-app .s360-login-social-icon.is-apple {
  color: transparent !important;
  font-size: 0 !important;
  position: relative !important;
}

#system360-app .s360-login-social-icon.is-apple::before {
  content: "" !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  background: #111827 !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M16.73 3.23c0 1.02-.39 1.98-1.02 2.66-.68.7-1.79 1.24-2.74 1.16-.12-.98.39-2.02 1.02-2.68.7-.73 1.89-1.26 2.74-1.14Zm2.58 14.33c-.46 1.08-.67 1.56-1.26 2.55-.83 1.4-1.98 3.12-3.43 3.14-1.28.02-1.62-.86-3.36-.85-1.74.01-2.11.87-3.39.85-1.44-.02-2.54-1.58-3.37-2.97-2.31-3.9-2.55-8.49-1.13-10.73 1.01-1.59 2.62-2.54 4.12-2.54 1.54 0 2.5.86 3.76.86 1.22 0 1.98-.86 3.75-.86 1.35 0 2.77.75 3.78 2.06-3.33 1.87-2.79 6.77.53 7.49Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M16.73 3.23c0 1.02-.39 1.98-1.02 2.66-.68.7-1.79 1.24-2.74 1.16-.12-.98.39-2.02 1.02-2.68.7-.73 1.89-1.26 2.74-1.14Zm2.58 14.33c-.46 1.08-.67 1.56-1.26 2.55-.83 1.4-1.98 3.12-3.43 3.14-1.28.02-1.62-.86-3.36-.85-1.74.01-2.11.87-3.39.85-1.44-.02-2.54-1.58-3.37-2.97-2.31-3.9-2.55-8.49-1.13-10.73 1.01-1.59 2.62-2.54 4.12-2.54 1.54 0 2.5.86 3.76.86 1.22 0 1.98-.86 3.75-.86 1.35 0 2.77.75 3.78 2.06-3.33 1.87-2.79 6.77.53 7.49Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

#system360-app .s360-login-create-account {
  margin-top: 16px !important;
  text-align: center !important;
  color: #637086 !important;
  font-size: 11.5px !important;
}

#system360-app .s360-login-create-account .s360-login-link-btn {
  font-size: inherit !important;
}

#system360-app .s360-login-version {
  margin-top: 7px !important;
  text-align: center !important;
  color: #99a2b2 !important;
  font-size: 10.5px !important;
}

#system360-app .s360-login-footer {
  width: min(1460px, calc(100vw - 56px)) !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  color: #5f6a80 !important;
  font-size: 11px !important;
}

@media (max-width: 1180px) {
  #system360-app .s360-app-login {
    padding: 16px 12px 12px !important;
  }

  #system360-app .s360-login-shell,
  #system360-app .s360-login-footer {
    width: min(1460px, calc(100vw - 24px)) !important;
  }

  #system360-app .s360-login-shell {
    min-height: auto !important;
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-login-hero {
    min-height: 390px !important;
    padding: 24px 22px 20px !important;
  }

  #system360-app .s360-login-hero-copy h2 {
    font-size: clamp(28px, 5.8vw, 38px) !important;
  }

  #system360-app .s360-login-feature-list {
    gap: 10px !important;
  }

  #system360-app .s360-login-form-wrap {
    padding: 20px 18px 18px !important;
  }

  #system360-app .s360-login-form-card {
    max-width: 100% !important;
  }
}

@media (max-width: 820px) {
  #system360-app .s360-login-hero {
    min-height: auto !important;
  }

  #system360-app .s360-login-feature-list {
    display: none !important;
  }

  #system360-app .s360-login-social-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ===== 360 CRM Sidebar Premium V2 ===== */
#system360-app .s360-app-system {
  --s360-side-bg: #0b0b0f;
  --s360-side-card: #1c1c1e;
  --s360-side-border: #2a2a30;
  --s360-side-text: #f4f4f7;
  --s360-side-muted: #9b9ba6;
  --s360-side-accent-a: #2e63ff;
  --s360-side-accent-b: #7f43f0;
  --s360-side-accent-c: #ea3f95;
}

#system360-app .s360-app-system .s360-top-left {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

#system360-app .s360-app-system .s360-mobile-side-trigger {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  background: rgba(12, 12, 16, 0.88) !important;
  color: #d8d8e0 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}

#system360-app .s360-app-system .s360-mobile-side-trigger .s360-svg-icon {
  width: 18px !important;
  height: 18px !important;
}

#system360-app .s360-app-system .s360-sidebar {
  width: 312px !important;
  min-width: 312px !important;
  flex: 0 0 312px !important;
  border-radius: 18px !important;
  border: 1px solid #2c2f45 !important;
  background: linear-gradient(180deg, #080a15 0%, #090b17 100%) !important;
  box-shadow: 0 20px 48px rgba(1, 2, 7, 0.58), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  padding: 14px 13px 12px !important;
  gap: 8px !important;
  overflow: hidden !important;
  transition: width 300ms ease-in-out, min-width 300ms ease-in-out, transform 300ms ease-in-out, box-shadow 240ms ease-in-out !important;
}

#system360-app .s360-app-system .s360-sidebar::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background:
    radial-gradient(86% 54% at 0% 0%, rgba(46, 99, 255, 0.12) 0%, rgba(46, 99, 255, 0) 66%),
    radial-gradient(78% 44% at 100% 100%, rgba(234, 63, 149, 0.08) 0%, rgba(234, 63, 149, 0) 66%) !important;
}

#system360-app .s360-app-system .s360-sidebar-head {
  min-height: 58px !important;
  padding: 2px 6px 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

#system360-app .s360-app-system .s360-brand {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}

#system360-app .s360-app-system .s360-brand-logo-full {
  width: min(116px, 100%) !important;
}

#system360-app .s360-app-system .s360-brand-logo-short {
  width: 34px !important;
  max-width: 34px !important;
}

#system360-app .s360-app-system .s360-side-toggle {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.11) !important;
  background: rgba(30, 30, 36, 0.92) !important;
  color: #e6e6ef !important;
  box-shadow: none !important;
}

#system360-app .s360-app-system .s360-side-toggle:hover {
  border-color: rgba(126, 95, 255, 0.6) !important;
  box-shadow: 0 0 0 1px rgba(126, 95, 255, 0.36), 0 0 16px rgba(126, 95, 255, 0.3) !important;
}

#system360-app .s360-app-system .s360-nav {
  gap: 6px !important;
  padding: 2px 2px 4px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

#system360-app .s360-app-system .s360-nav-section-label {
  display: none !important;
}

#system360-app .s360-app-system .s360-nav-item {
  min-height: 40px !important;
  border-radius: 12px !important;
  border: 1px solid transparent !important;
  background: rgba(255, 255, 255, 0.008) !important;
  color: var(--s360-side-text) !important;
  grid-template-columns: 18px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  padding: 9px 11px !important;
  font-family: "Inter", "SF Pro Display", "Segoe UI", sans-serif !important;
  transition: background 260ms ease-in-out, border-color 240ms ease-in-out, box-shadow 240ms ease-in-out, transform 220ms ease-in-out !important;
}

#system360-app .s360-app-system .s360-nav-item .s360-nav-icon {
  color: #d4d4de !important;
}

#system360-app .s360-app-system .s360-nav-item .s360-nav-icon .s360-svg-icon {
  width: 16px !important;
  height: 16px !important;
}

#system360-app .s360-app-system .s360-nav-item .s360-nav-label {
  color: var(--s360-side-text) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
}

#system360-app .s360-app-system .s360-nav-item .s360-nav-meta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  color: #a9a9b5 !important;
}

#system360-app .s360-app-system .s360-nav-badge {
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 6px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(177, 131, 255, 0.42) !important;
  background: linear-gradient(90deg, rgba(67, 61, 226, 0.84), rgba(150, 61, 241, 0.84)) !important;
  color: #ddd3ff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 16px !important;
  text-align: center !important;
}

#system360-app .s360-app-system .s360-nav-item .s360-chevron {
  width: 16px !important;
  height: 16px !important;
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  display: inline-grid !important;
  place-items: center !important;
  transition: transform 280ms ease-in-out, border-color 220ms ease-in-out, background 220ms ease-in-out !important;
}

#system360-app .s360-app-system .s360-nav-item .s360-chevron .s360-svg-icon {
  width: 13px !important;
  height: 13px !important;
}

#system360-app .s360-app-system .s360-nav-item .s360-chevron.open {
  transform: rotate(90deg) !important;
}

#system360-app .s360-app-system .s360-nav-item:hover {
  border-color: rgba(114, 124, 162, 0.28) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  box-shadow: 0 0 0 1px rgba(99, 107, 149, 0.18), 0 0 14px rgba(95, 79, 170, 0.2) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-app-system .s360-nav-item.active {
  border-color: rgba(127, 67, 240, 0.62) !important;
  background: linear-gradient(90deg, rgba(46, 99, 255, 0.5) 0%, rgba(127, 67, 240, 0.5) 56%, rgba(146, 55, 219, 0.5) 100%) !important;
  box-shadow: 0 10px 22px rgba(43, 38, 90, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

#system360-app .s360-app-system .s360-nav-item.active::before {
  display: none !important;
}

#system360-app .s360-app-system .s360-submenu-wrap {
  margin: 1px 0 4px 12px !important;
  padding: 2px 0 2px 10px !important;
  border-left: 1px solid rgba(255, 255, 255, 0.09) !important;
  max-height: 0 !important;
  opacity: 0 !important;
  transform: translateY(-7px) !important;
  overflow: hidden !important;
  pointer-events: none !important;
  transition: max-height 300ms ease-in-out, opacity 220ms ease-in-out, transform 260ms ease-in-out !important;
}

#system360-app .s360-app-system .s360-submenu-wrap.open {
  max-height: 500px !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}

#system360-app .s360-app-system .s360-nav-item.s360-sub-item {
  min-height: 32px !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #c5c7d8 !important;
  font-size: 12.5px !important;
  padding: 6px 10px !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
}

#system360-app .s360-app-system .s360-nav-item.s360-sub-item .s360-nav-icon {
  display: none !important;
}

#system360-app .s360-app-system .s360-nav-item.s360-sub-item .s360-nav-label {
  position: relative !important;
  padding-left: 12px !important;
  font-size: 12.5px !important;
  font-weight: 450 !important;
}

#system360-app .s360-app-system .s360-nav-item.s360-sub-item .s360-nav-label::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 999px !important;
  background: rgba(146, 155, 186, 0.7) !important;
  transform: translateY(-50%) !important;
}

#system360-app .s360-app-system .s360-nav-item.s360-sub-item.active {
  border-color: rgba(127, 67, 240, 0.28) !important;
  background: rgba(127, 67, 240, 0.12) !important;
  box-shadow: none !important;
}

#system360-app .s360-app-system .s360-nav-item.s360-sub-item.active .s360-nav-label::before {
  background: linear-gradient(180deg, #2e63ff 0%, #b146ee 100%) !important;
}

#system360-app .s360-app-system .s360-sidebar-foot {
  padding: 10px 4px 2px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
}

#system360-app .s360-app-system .s360-side-userchip {
  border-radius: 11px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  background: #1c1c22 !important;
  box-shadow: none !important;
  min-height: 58px !important;
  padding: 9px 10px !important;
  gap: 10px !important;
}

#system360-app .s360-app-system .s360-side-user-avatar-wrap {
  position: relative !important;
  width: 34px !important;
  height: 34px !important;
  display: inline-grid !important;
  place-items: center !important;
}

#system360-app .s360-app-system .s360-side-user-avatar {
  width: 34px !important;
  height: 34px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  background: #292933 !important;
  color: #f4f4f7 !important;
}

#system360-app .s360-app-system .s360-side-user-status {
  position: absolute !important;
  right: -1px !important;
  bottom: -1px !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 999px !important;
  background: #22c55e !important;
  border: 2px solid #16161c !important;
}

#system360-app .s360-app-system .s360-side-user-meta strong {
  color: #f4f4f7 !important;
  font-size: 13.5px !important;
}

#system360-app .s360-app-system .s360-side-user-meta small {
  color: var(--s360-side-muted) !important;
}

#system360-app .s360-app-system .s360-side-user-menu-toggle {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  background: #1e1e26 !important;
  color: #cfcfe0 !important;
  display: inline-grid !important;
  place-items: center !important;
  align-self: center !important;
  cursor: pointer !important;
}

#system360-app .s360-app-system .s360-side-user-menu-toggle .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
  transition: transform 260ms ease-in-out !important;
}

#system360-app .s360-app-system .s360-sidebar-foot.is-open .s360-side-user-menu-toggle .s360-svg-icon {
  transform: rotate(90deg) !important;
}

#system360-app .s360-app-system .s360-side-user-menu {
  position: absolute !important;
  right: 4px !important;
  bottom: 62px !important;
  width: min(252px, calc(100% - 8px)) !important;
  border-radius: 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  background: #15151b !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.52) !important;
  padding: 8px !important;
  display: grid !important;
  gap: 4px !important;
  opacity: 0 !important;
  transform: translateY(8px) !important;
  pointer-events: none !important;
  transition: opacity 200ms ease-in-out, transform 220ms ease-in-out !important;
  z-index: 50 !important;
}

#system360-app .s360-app-system .s360-sidebar-foot.is-open .s360-side-user-menu {
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}

#system360-app .s360-app-system .s360-side-user-menu-item {
  width: 100% !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #ececf4 !important;
  min-height: 34px !important;
  border-radius: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 9px !important;
  cursor: pointer !important;
}

#system360-app .s360-app-system .s360-side-user-menu-item .s360-svg-icon {
  width: 15px !important;
  height: 15px !important;
}

#system360-app .s360-app-system .s360-side-user-menu-item:hover {
  border-color: rgba(255, 255, 255, 0.14) !important;
  background: rgba(255, 255, 255, 0.06) !important;
}

#system360-app .s360-app-system .s360-side-user-menu-item.is-logout {
  color: #ffb6cf !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar {
  width: 88px !important;
  min-width: 88px !important;
  flex: 0 0 88px !important;
}

#system360-app .s360-shell.collapsed .s360-nav {
  align-items: center !important;
}

#system360-app .s360-shell.collapsed .s360-nav-section-label,
#system360-app .s360-shell.collapsed .s360-nav-label,
#system360-app .s360-shell.collapsed .s360-side-user-meta,
#system360-app .s360-shell.collapsed .s360-side-user-menu-toggle,
#system360-app .s360-shell.collapsed .s360-side-user-menu {
  opacity: 0 !important;
  max-width: 0 !important;
  pointer-events: none !important;
  display: none !important;
}

#system360-app .s360-shell.collapsed .s360-nav-item {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  border-radius: 13px !important;
  grid-template-columns: 1fr !important;
  place-items: center !important;
}

#system360-app .s360-shell.collapsed .s360-nav-item .s360-nav-meta {
  display: none !important;
}

#system360-app .s360-shell.collapsed .s360-submenu-wrap {
  display: none !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar-foot {
  display: flex !important;
  justify-content: center !important;
  border-top-color: rgba(255, 255, 255, 0.07) !important;
}

#system360-app .s360-shell.collapsed .s360-side-userchip {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  justify-content: center !important;
}

#system360-app .s360-shell.collapsed .s360-side-user-avatar-wrap {
  width: 30px !important;
  height: 30px !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar {
  width: 312px !important;
  min-width: 312px !important;
  flex: 0 0 312px !important;
  box-shadow: 0 26px 56px rgba(2, 2, 6, 0.62), 0 0 0 1px rgba(127, 67, 240, 0.2) !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-nav-label,
#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-side-user-meta,
#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-side-user-menu-toggle {
  opacity: 1 !important;
  max-width: 320px !important;
  pointer-events: auto !important;
  display: inline-flex !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-nav-item {
  width: 100% !important;
  min-width: 100% !important;
  height: auto !important;
  min-height: 42px !important;
  padding: 10px 12px !important;
  grid-template-columns: 18px minmax(0, 1fr) auto !important;
  justify-items: stretch !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-nav-item .s360-nav-meta {
  display: inline-flex !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-submenu-wrap {
  display: grid !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-side-user-menu {
  max-width: none !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar-foot.is-open .s360-side-user-menu {
  opacity: 1 !important;
  pointer-events: auto !important;
}

#system360-app .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav-item[data-tip]::after {
  content: attr(data-tip) !important;
  position: absolute !important;
  left: calc(100% + 10px) !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  padding: 6px 10px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  background: rgba(12, 12, 18, 0.96) !important;
  color: #e9e9f4 !important;
  font-size: 12px !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 180ms ease-in-out !important;
  z-index: 999 !important;
}

#system360-app .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav-item:hover::after,
#system360-app .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav-item:focus-visible::after {
  opacity: 1 !important;
}

#system360-app .s360-app-system .s360-nav-item:focus-visible,
#system360-app .s360-app-system .s360-side-toggle:focus-visible,
#system360-app .s360-app-system .s360-side-userchip:focus-visible,
#system360-app .s360-app-system .s360-side-user-menu-toggle:focus-visible,
#system360-app .s360-app-system .s360-side-user-menu-item:focus-visible,
#system360-app .s360-app-system .s360-mobile-side-trigger:focus-visible {
  outline: 2px solid rgba(112, 141, 255, 0.9) !important;
  outline-offset: 2px !important;
}

@media (max-width: 980px) {
  #system360-app .s360-app-system .s360-mobile-side-trigger {
    display: inline-grid !important;
  }

  #system360-app .s360-app-system .s360-shell .s360-sidebar {
    position: fixed !important;
    top: 10px !important;
    left: 10px !important;
    bottom: 10px !important;
    width: min(320px, calc(100vw - 20px)) !important;
    min-width: min(320px, calc(100vw - 20px)) !important;
    transform: translateX(calc(-100% - 18px)) !important;
    z-index: 1200 !important;
    pointer-events: none !important;
  }

  #system360-app .s360-app-system .s360-shell.is-sidebar-mobile-open .s360-sidebar {
    transform: translateX(0) !important;
    pointer-events: auto !important;
  }

  #system360-app .s360-app-system .s360-shell::after {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.42) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 220ms ease-in-out !important;
    z-index: 1190 !important;
  }

  #system360-app .s360-app-system .s360-shell.is-sidebar-mobile-open::after {
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  #system360-app .s360-app-system .s360-shell.collapsed .s360-sidebar {
    width: min(320px, calc(100vw - 20px)) !important;
    min-width: min(320px, calc(100vw - 20px)) !important;
    flex: 0 0 min(320px, calc(100vw - 20px)) !important;
  }
}

/* ===== Sidebar Reference Replica Fix (stability + closer visual match) ===== */
#system360-app .s360-workarea {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}

#system360-app .s360-main {
  min-width: 0 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium {
  position: relative !important;
  width: 308px !important;
  min-width: 308px !important;
  flex: 0 0 308px !important;
  border-radius: 16px !important;
  border: 1px solid #2b2e44 !important;
  background: radial-gradient(110% 80% at 0% 0%, rgba(44, 79, 196, 0.14), transparent 54%), #090b17 !important;
  box-shadow: 0 18px 40px rgba(1, 3, 10, 0.56), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
  padding: 14px 12px 12px !important;
  gap: 8px !important;
  overflow: hidden !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  position: relative !important;
  min-height: 56px !important;
  padding: 4px 4px 8px !important;
  display: block !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 !important;
  margin: 0 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 112px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  position: absolute !important;
  right: 2px !important;
  top: 2px !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  background: rgba(24, 28, 46, 0.92) !important;
  color: #e9ebfb !important;
  z-index: 3 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav {
  gap: 6px !important;
  padding: 0 2px 2px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-section-label {
  display: none !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item {
  min-height: 39px !important;
  border-radius: 11px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  grid-template-columns: 17px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  padding: 8px 10px !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-nav-icon .s360-svg-icon {
  width: 15px !important;
  height: 15px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-nav-label {
  font-size: 12.9px !important;
  font-weight: 500 !important;
  color: #eef0ff !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-chevron {
  width: 14px !important;
  height: 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-chevron .s360-svg-icon {
  width: 13px !important;
  height: 13px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item:hover {
  border-color: rgba(121, 128, 165, 0.24) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  transform: none !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.active {
  border-color: rgba(127, 67, 240, 0.56) !important;
  background: linear-gradient(90deg, rgba(46, 99, 255, 0.52), rgba(127, 67, 240, 0.52), rgba(205, 61, 173, 0.52)) !important;
  box-shadow: 0 8px 20px rgba(42, 35, 92, 0.46) !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap {
  margin: 0 0 2px 10px !important;
  padding: 1px 0 1px 9px !important;
  border-left: 1px solid rgba(255, 255, 255, 0.09) !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item {
  min-height: 31px !important;
  border-radius: 8px !important;
  background: transparent !important;
  padding: 5px 9px !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item .s360-nav-icon {
  display: none !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item .s360-nav-label {
  position: relative !important;
  padding-left: 11px !important;
  font-size: 12.4px !important;
  color: #c7cbe4 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item .s360-nav-label::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  width: 4px !important;
  height: 4px !important;
  border-radius: 999px !important;
  background: rgba(145, 153, 186, 0.72) !important;
  transform: translateY(-50%) !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item.active {
  border-color: rgba(127, 67, 240, 0.24) !important;
  background: rgba(127, 67, 240, 0.12) !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item.active .s360-nav-label::before {
  background: linear-gradient(180deg, #2e63ff, #a74aef) !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-sidebar-foot {
  padding-top: 10px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-userchip {
  min-height: 56px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-avatar {
  border-radius: 999px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium {
  width: 86px !important;
  min-width: 86px !important;
  flex: 0 0 86px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-nav-item {
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  grid-template-columns: 1fr !important;
  place-items: center !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-nav-label,
#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-nav-meta,
#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-user-meta,
#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-user-menu-toggle,
#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-user-menu {
  display: none !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap {
  display: none !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium {
  width: 308px !important;
  min-width: 308px !important;
  flex: 0 0 308px !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-nav-item {
  width: 100% !important;
  min-width: 100% !important;
  height: auto !important;
  min-height: 39px !important;
  padding: 8px 10px !important;
  grid-template-columns: 17px minmax(0, 1fr) auto !important;
  justify-items: stretch !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-nav-label,
#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-nav-meta,
#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-side-user-meta,
#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-side-user-menu-toggle {
  display: inline-flex !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap {
  display: grid !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-nav-item[data-tip]::after {
  display: none !important;
}

@media (max-width: 980px) {
  #system360-app .s360-app-system .s360-mobile-side-trigger {
    display: none !important;
  }

  #system360-app .s360-app-system .s360-shell .s360-sidebar.s360-sidebar-premium {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    pointer-events: auto !important;
    z-index: auto !important;
  }

  #system360-app .s360-app-system .s360-shell::after {
    display: none !important;
  }
}

/* Inicio: override final para quitar paneles blancos del centro de alertas */
#system360-app .s360-app.s360-app-system .s360-alert-center-overview,
#system360-app .s360-app.s360-app-system .s360-alert-rules-panel,
#system360-app .s360-app.s360-app-system .s360-alert-center-list {
  border-color: rgba(73, 105, 171, 0.58) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(59, 130, 246, 0.13), transparent 34%),
    radial-gradient(circle at 92% 0%, rgba(139, 92, 246, 0.12), transparent 32%),
    linear-gradient(180deg, rgba(8, 18, 39, 0.96), rgba(5, 12, 27, 0.98)) !important;
  color: #eaf2ff !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis {
  border: 1px solid rgba(89, 121, 191, 0.62) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(34, 197, 94, 0.10), transparent 38%),
    linear-gradient(180deg, rgba(10, 25, 48, 0.96), rgba(6, 16, 34, 0.98)) !important;
  color: #dce8ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 12px 22px rgba(1, 8, 20, 0.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis h4,
#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis p strong,
#system360-app .s360-app.s360-app-system .s360-alert-center-kpis .s360-card .v {
  color: #f5f8ff !important;
  -webkit-text-fill-color: #f5f8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis p,
#system360-app .s360-app.s360-app-system .s360-alert-center-kpis .s360-card .k {
  color: #b9c9eb !important;
  -webkit-text-fill-color: #b9c9eb !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-kpis .s360-card {
  border-color: rgba(87, 116, 182, 0.58) !important;
  background: linear-gradient(180deg, rgba(12, 23, 48, 0.94), rgba(7, 15, 34, 0.98)) !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-reco-list .s360-alert.ok {
  border: 1px solid rgba(34, 197, 94, 0.36) !important;
  border-left: 3px solid rgba(48, 231, 139, 0.88) !important;
  background: linear-gradient(90deg, rgba(10, 84, 56, 0.72), rgba(8, 46, 42, 0.88)) !important;
  color: #d7ffed !important;
  -webkit-text-fill-color: #d7ffed !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-tabs {
  border: 1px solid rgba(73, 105, 171, 0.54) !important;
  border-radius: 12px !important;
  background: rgba(4, 12, 29, 0.76) !important;
  padding: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-tabs .s360-btn {
  border-color: rgba(92, 123, 190, 0.62) !important;
  background: linear-gradient(180deg, rgba(12, 23, 48, 0.9), rgba(7, 15, 34, 0.96)) !important;
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-tabs .s360-btn.is-active {
  border-color: rgba(163, 112, 255, 0.88) !important;
  background: linear-gradient(135deg, rgba(79, 63, 232, 0.72), rgba(146, 70, 225, 0.64)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Inicio: final right sidebar polish */
#system360-app .s360-app.s360-app-system .s360-home-layout-shell {
  grid-template-columns: minmax(0, 1fr) 320px !important;
  gap: 18px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
  grid-template-columns: minmax(0, 1fr) 92px !important;
}

/* Inicio: final right sidebar polish */
#system360-app .s360-app.s360-app-system .s360-home-layout-shell {
  grid-template-columns: minmax(0, 1fr) 320px !important;
  gap: 18px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
  grid-template-columns: minmax(0, 1fr) 92px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar {
  box-sizing: border-box !important;
  position: sticky !important;
  top: 0 !important;
  align-self: start !important;
  height: auto !important;
  max-height: calc(100dvh - 120px) !important;
  gap: 14px !important;
  padding: 0 0 18px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  scrollbar-gutter: stable !important;
}

#system360-app .s360-app.s360-app-system .s360-home-layout-shell {
  grid-template-columns: minmax(0, 1fr) 320px !important;
  gap: 18px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
  grid-template-columns: minmax(0, 1fr) 92px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card,
#system360-app .s360-app.s360-app-system .s360-home-sidebar-card.s360-home-calendar-card {
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  border: 1px solid rgba(73, 105, 171, 0.62) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(56, 102, 214, 0.16), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 39, 0.96), rgba(5, 12, 27, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 14px 28px rgba(1, 8, 20, 0.36) !important;
  padding: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card-head,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card .s360-panel-headline h3,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline h3 {
  margin: 0 !important;
  color: #f1f6ff !important;
  -webkit-text-fill-color: #f1f6ff !important;
  font-size: 16px !important;
  line-height: 1.15 !important;
  font-weight: 780 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-toggle,
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed .s360-home-sidebar-toggle {
  width: auto !important;
  min-width: 62px !important;
  height: 32px !important;
  min-height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(72, 98, 156, 0.68) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(30, 45, 82, 0.96), rgba(21, 33, 65, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 18px rgba(1, 8, 20, 0.28) !important;
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  padding: 0 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed .s360-home-sidebar-toggle {
  min-width: 74px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-nav .s360-home-cal-nav-btn {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  border-radius: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-month {
  margin: 0 0 10px !important;
  padding-left: 0 !important;
  color: #f1f6ff !important;
  -webkit-text-fill-color: #f1f6ff !important;
  font-size: 13px !important;
  line-height: 1.15 !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

@media (max-width: 1100px) {
  #system360-app .s360-app.s360-app-system .s360-home-layout-shell,
  #system360-app .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-app.s360-app-system .s360-home-right-sidebar {
    grid-template-columns: 1fr !important;
    position: static !important;
    top: auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card,
#system360-app .s360-app.s360-app-system .s360-home-sidebar-card.s360-home-calendar-card {
  border: 1px solid rgba(73, 105, 171, 0.62) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(56, 102, 214, 0.16), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 39, 0.96), rgba(5, 12, 27, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 14px 28px rgba(1, 8, 20, 0.36) !important;
  padding: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card-head,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card .s360-panel-headline h3,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline h3 {
  margin: 0 !important;
  color: #f1f6ff !important;
  -webkit-text-fill-color: #f1f6ff !important;
  font-size: 16px !important;
  line-height: 1.15 !important;
  font-weight: 780 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-toggle,
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed .s360-home-sidebar-toggle {
  width: auto !important;
  min-width: 62px !important;
  height: 32px !important;
  min-height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(72, 98, 156, 0.68) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(30, 45, 82, 0.96), rgba(21, 33, 65, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 18px rgba(1, 8, 20, 0.28) !important;
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  padding: 0 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed .s360-home-sidebar-toggle {
  min-width: 74px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-nav .s360-home-cal-nav-btn {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  border-radius: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-month {
  margin: 0 0 10px !important;
  padding-left: 0 !important;
  color: #f1f6ff !important;
  -webkit-text-fill-color: #f1f6ff !important;
  font-size: 13px !important;
  line-height: 1.15 !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

@media (max-width: 1100px) {
  #system360-app .s360-app.s360-app-system .s360-home-layout-shell,
  #system360-app .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-app.s360-app-system .s360-home-right-sidebar {
    grid-template-columns: 1fr !important;
    position: static !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* Inicio: final correction for fixed right sidebar height */
@media (min-width: 1101px) {
  #system360-app .s360-app.s360-app-system .s360-home-right-sidebar {
    position: sticky !important;
    top: 0 !important;
    height: auto !important;
    max-height: calc(100dvh - 120px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding-bottom: 18px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-home-sidebar-card,
  #system360-app .s360-app.s360-app-system .s360-home-sidebar-card.s360-home-calendar-card {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* Mis ventas: cliente como texto, sin etiqueta/fondo claro */
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td .s360-linklike,
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td button.s360-linklike {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #dbe7ff !important;
  -webkit-text-fill-color: #dbe7ff !important;
  font: inherit !important;
  font-weight: 650 !important;
  line-height: inherit !important;
  text-align: left !important;
  text-decoration: none !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td .s360-linklike:hover,
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td .s360-linklike:focus-visible {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Mis ventas: evitar corte de las columnas finales */
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-sales-table-wrap {
  box-sizing: border-box !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding-right: 40px !important;
  padding-bottom: 14px !important;
  scrollbar-gutter: stable both-edges !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-sales-table-wrap > .s360-table-sales {
  table-layout: fixed !important;
  width: max-content !important;
  min-width: 3040px !important;
  max-width: none !important;
  margin-right: 40px !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales th:nth-last-child(2),
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td:nth-last-child(2) {
  width: 180px !important;
  min-width: 180px !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales th:last-child,
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td:last-child {
  width: 260px !important;
  min-width: 260px !important;
  max-width: 260px !important;
  padding-right: 28px !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales .s360-sale-actions {
  width: max-content !important;
  min-width: 164px !important;
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 8px !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales .s360-sale-icon-btn {
  flex: 0 0 34px !important;
}

/* Bases DB360: toolbar compacta en una sola hilera */
#system360-app .s360-db360-toolbar {
  display: flex !important;
  align-items: flex-end !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 10px 12px !important;
  scrollbar-gutter: stable !important;
}

#system360-app .s360-db360-toolbar-main,
#system360-app .s360-db360-toolbar-bulk {
  display: contents !important;
}

#system360-app .s360-db360-toolbar-main > label {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

#system360-app .s360-db360-toolbar-main > label:nth-child(1) {
  flex-basis: 360px !important;
  width: 360px !important;
  max-width: 360px !important;
}

#system360-app .s360-db360-toolbar-main > label:nth-child(2) {
  width: 112px !important;
}

#system360-app .s360-db360-toolbar-main > label:nth-child(3) {
  width: 160px !important;
}

#system360-app .s360-db360-toolbar-main > label :is(.s360-input, .s360-select) {
  width: 100% !important;
  height: 38px !important;
}

#system360-app .s360-db360-view-switch {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  height: 38px !important;
}

#system360-app .s360-db360-actions,
#system360-app .s360-db360-toolbar-bulk {
  flex: 0 0 auto !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  align-items: center !important;
  width: auto !important;
}

#system360-app .s360-db360-actions {
  display: inline-flex !important;
}

#system360-app .s360-db360-toolbar-bulk > span {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 6px !important;
  white-space: nowrap !important;
  font-size: 14px !important;
  line-height: 34px !important;
}

#system360-app .s360-db360-actions .s360-btn,
#system360-app .s360-db360-toolbar-bulk .s360-btn {
  flex: 0 0 auto !important;
  height: 34px !important;
  min-height: 34px !important;
  white-space: nowrap !important;
}

/* Mis ventas: cliente como texto, sin etiqueta/fondo claro */
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td .s360-linklike,
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td button.s360-linklike {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #dbe7ff !important;
  -webkit-text-fill-color: #dbe7ff !important;
  font: inherit !important;
  font-weight: 650 !important;
  line-height: inherit !important;
  text-align: left !important;
  text-decoration: none !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td .s360-linklike:hover,
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td .s360-linklike:focus-visible {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Inicio: right sidebar composition aligned with compact dark cards */
#system360-app .s360-app.s360-app-system .s360-home-layout-shell {
  grid-template-columns: minmax(0, 1fr) 320px !important;
  gap: 18px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
  grid-template-columns: minmax(0, 1fr) 92px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar {
  gap: 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card {
  border: 1px solid rgba(73, 105, 171, 0.62) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(56, 102, 214, 0.16), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 39, 0.96), rgba(5, 12, 27, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 14px 28px rgba(1, 8, 20, 0.36) !important;
  padding: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-profile-card.s360-home-sidebar-card,
#system360-app .s360-app.s360-app-system .s360-home-sidebar-card.s360-home-calendar-card {
  padding: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card-head,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card .s360-panel-headline h3,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline h3 {
  margin: 0 !important;
  color: #f1f6ff !important;
  -webkit-text-fill-color: #f1f6ff !important;
  font-size: 16px !important;
  line-height: 1.15 !important;
  font-weight: 780 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-toggle {
  width: auto !important;
  min-width: 62px !important;
  height: 32px !important;
  min-height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(72, 98, 156, 0.68) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(30, 45, 82, 0.96), rgba(21, 33, 65, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 18px rgba(1, 8, 20, 0.28) !important;
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  padding: 0 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-toggle:hover {
  border-color: rgba(107, 135, 204, 0.86) !important;
  background: linear-gradient(180deg, rgba(38, 56, 99, 0.98), rgba(25, 39, 74, 1)) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed {
  padding: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-toolbar-collapsed {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  padding: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed .s360-home-sidebar-toggle {
  min-width: 74px !important;
  padding: 0 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-profile-card h4 {
  margin: 8px 0 2px !important;
  color: #f4f8ff !important;
  -webkit-text-fill-color: #f4f8ff !important;
  font-size: 14px !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
}

#system360-app .s360-app.s360-app-system .s360-profile-card p {
  margin: 0 0 10px !important;
  color: #c5d4ef !important;
  -webkit-text-fill-color: #c5d4ef !important;
  font-size: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar .s360-avatar {
  width: 42px !important;
  height: 42px !important;
  margin: 0 0 8px !important;
  border-radius: 9px !important;
  background: linear-gradient(135deg, rgba(32, 54, 147, 0.84), rgba(27, 38, 96, 0.96)) !important;
  color: #6f89ff !important;
  -webkit-text-fill-color: #6f89ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 10px 20px rgba(1, 8, 20, 0.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar .s360-profile-meta {
  gap: 7px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar .s360-profile-meta > div,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected-metrics > div,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-agenda-item {
  border-color: rgba(63, 91, 152, 0.62) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(8, 18, 39, 0.88), rgba(5, 12, 27, 0.94)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-nav {
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-nav .s360-home-cal-nav-btn {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  border-radius: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-month {
  margin: 0 0 10px !important;
  padding-left: 0 !important;
  color: #f1f6ff !important;
  -webkit-text-fill-color: #f1f6ff !important;
  font-size: 13px !important;
  line-height: 1.15 !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-weekdays,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-grid {
  gap: 6px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day {
  border-radius: 8px !important;
  padding: 4px 2px !important;
}

@media (max-width: 1100px) {
  #system360-app .s360-app.s360-app-system .s360-home-layout-shell,
  #system360-app .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-app.s360-app-system .s360-home-right-sidebar {
    grid-template-columns: 1fr !important;
    position: static !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* Loader 360: replica visual de referencia */
#system360-app .s360-app-system .s360-loading-layer {
  position: absolute !important;
  inset: 0 !important;
  z-index: 13050 !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 50% 43%, rgba(57, 30, 128, 0.36), transparent 33%),
    radial-gradient(circle at 48% 42%, rgba(5, 18, 48, 0.92), transparent 55%),
    linear-gradient(180deg, #03091a 0%, #030817 56%, #020614 100%) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-app .s360-app-system .s360-loading-layer::before,
#system360-app .s360-app-system .s360-loading-layer::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 43% !important;
  width: min(420px, 74vw) !important;
  aspect-ratio: 1 !important;
  border-radius: 50% !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
}

#system360-app .s360-app-system .s360-loading-layer::before {
  border: 1px solid rgba(42, 80, 184, 0.28) !important;
  box-shadow:
    0 0 0 34px rgba(62, 35, 160, 0.075),
    0 0 0 68px rgba(56, 29, 136, 0.045),
    0 0 74px rgba(93, 69, 255, 0.25) !important;
  animation: s360-ref-loader-rings-spin 9s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer::after {
  width: min(308px, 58vw) !important;
  border: 1px solid rgba(40, 112, 255, 0.28) !important;
  box-shadow:
    inset 0 0 42px rgba(9, 18, 52, 0.8),
    0 0 56px rgba(25, 86, 255, 0.16) !important;
  animation: s360-ref-loader-rings-spin-reverse 7s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-orb {
  width: min(620px, 88vw) !important;
  display: grid !important;
  justify-items: center !important;
  color: #eef4ff !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  z-index: 1 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-main {
  width: 100% !important;
  display: grid !important;
  justify-items: center !important;
  gap: 10px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360 {
  --s360-loader-size: 292px !important;
  --s360-loader-thickness: 4px !important;
  width: var(--s360-loader-size) !important;
  height: var(--s360-loader-size) !important;
  margin: 0 auto 4px !important;
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  filter: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-halo {
  inset: -18px !important;
  border-radius: 50% !important;
  background:
    radial-gradient(farthest-side, transparent calc(100% - 1px), rgba(121, 57, 255, 0.26) calc(100% - 1px), rgba(121, 57, 255, 0.26) 100%, transparent calc(100% + 1px)),
    radial-gradient(circle at 50% 50%, rgba(104, 55, 255, 0.13), transparent 63%) !important;
  opacity: 1 !important;
  filter: none !important;
  animation: s360-ref-loader-rings-spin 10.5s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-track,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360-progress,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360-glow {
  position: absolute !important;
  inset: 0 !important;
  border-radius: 50% !important;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - var(--s360-loader-thickness)), #000 calc(100% - var(--s360-loader-thickness) + 1px)) !important;
  mask: radial-gradient(farthest-side, transparent calc(100% - var(--s360-loader-thickness)), #000 calc(100% - var(--s360-loader-thickness) + 1px)) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-track {
  background: conic-gradient(from -92deg, rgba(64, 82, 191, 0.30), rgba(26, 39, 91, 0.10) 125deg, rgba(65, 32, 125, 0.16) 260deg, rgba(64, 82, 191, 0.30) 360deg) !important;
  box-shadow: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-progress {
  background: conic-gradient(from -83deg, #7b3cff 0deg, #c646f2 58deg, #ff4fb1 116deg, #ff8f3f 166deg, transparent 174deg, transparent 260deg, #1e9bff 282deg, #1e9bff 318deg, transparent 326deg, transparent 360deg) !important;
  filter:
    drop-shadow(0 0 8px rgba(126, 64, 255, 0.86))
    drop-shadow(0 0 16px rgba(255, 74, 171, 0.55))
    drop-shadow(0 0 10px rgba(30, 155, 255, 0.65)) !important;
  animation: s360-ref-loader-ring-orbit 3.8s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-progress::after {
  content: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-glow {
  inset: -2px !important;
  background: conic-gradient(from -83deg, rgba(124, 60, 255, 0.0) 0deg, rgba(182, 66, 245, 0.42) 54deg, rgba(255, 78, 177, 0.38) 110deg, rgba(255, 143, 63, 0.30) 166deg, transparent 210deg, rgba(30, 155, 255, 0.44) 300deg, transparent 330deg) !important;
  filter: blur(12px) !important;
  opacity: 0.78 !important;
  animation: s360-ref-loader-glow-orbit 3.8s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-core {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  animation: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  font-size: 74px !important;
  line-height: 0.88 !important;
  font-weight: 300 !important;
  letter-spacing: -0.08em !important;
  color: #ffffff !important;
  text-shadow: 0 6px 22px rgba(0, 0, 0, 0.42) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand-digits {
  display: inline-block !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand-zero {
  width: 48px !important;
  height: 48px !important;
  margin-left: 4px !important;
  border-radius: 50% !important;
  background: conic-gradient(from -35deg, #8d4cff 0deg, #2f8cff 98deg, #34d98d 180deg, #ffc339 252deg, #ff4eb3 328deg, #8d4cff 360deg) !important;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 10px), #000 calc(100% - 9px)) !important;
  mask: radial-gradient(farthest-side, transparent calc(100% - 10px), #000 calc(100% - 9px)) !important;
  box-shadow: 0 0 18px rgba(141, 76, 255, 0.32) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-core-text {
  max-width: 230px !important;
  margin: 0 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  text-shadow: 0 0 12px rgba(255, 255, 255, 0.24) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-headline,
#system360-app .s360-app-system .s360-loading-layer .s360-loading-phase-note {
  display: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-percent {
  margin: -2px 0 18px !important;
  color: #8c52ff !important;
  -webkit-text-fill-color: #8c52ff !important;
  font-size: 20px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-shadow: 0 0 14px rgba(140, 82, 255, 0.54) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress {
  width: min(570px, 86vw) !important;
  height: 6px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(24, 31, 68, 0.82) !important;
  box-shadow: inset 0 0 8px rgba(14, 22, 55, 0.9) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress > span {
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, #24c7ff 0%, #246cff 38%, #7c46ff 67%, #ff4fb1 90%, #ff8d3f 100%) !important;
  box-shadow:
    0 0 9px rgba(36, 199, 255, 0.86),
    0 0 18px rgba(124, 70, 255, 0.62),
    0 0 18px rgba(255, 79, 177, 0.42) !important;
  transition: width 220ms ease !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress > span::after {
  content: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-subtext {
  margin-top: 16px !important;
  color: #8994ad !important;
  -webkit-text-fill-color: #8994ad !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  text-align: center !important;
}

@keyframes s360-ref-loader-glow {
  0%, 100% { opacity: 0.62; }
  50% { opacity: 0.9; }
}

@keyframes s360-ref-loader-rings-spin {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes s360-ref-loader-rings-spin-reverse {
  from { transform: translate(-50%, -50%) rotate(360deg); }
  to { transform: translate(-50%, -50%) rotate(0deg); }
}

@keyframes s360-ref-loader-ring-orbit {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes s360-ref-loader-glow-orbit {
  0% { opacity: 0.62; transform: rotate(0deg); }
  50% { opacity: 0.92; }
  100% { opacity: 0.62; transform: rotate(360deg); }
}

@media (max-width: 700px) {
  #system360-app .s360-app-system .s360-loading-layer .s360-loader360 {
    --s360-loader-size: 238px !important;
  }

  #system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand {
    font-size: 60px !important;
  }

  #system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand-zero {
    width: 39px !important;
    height: 39px !important;
  }
}

/* Inicio: alertas inteligentes sin bloques blancos heredados */
#system360-app .s360-app.s360-app-system .s360-alert-center-overview,
#system360-app .s360-app.s360-app-system .s360-alert-rules-panel {
  border: 1px solid rgba(73, 105, 171, 0.58) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(59, 130, 246, 0.13), transparent 34%),
    radial-gradient(circle at 92% 0%, rgba(139, 92, 246, 0.12), transparent 32%),
    linear-gradient(180deg, rgba(8, 18, 39, 0.96), rgba(5, 12, 27, 0.98)) !important;
  color: #eaf2ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 16px 34px rgba(1, 8, 20, 0.38) !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-overview .s360-panel-headline h3,
#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis h4 {
  color: #f5f8ff !important;
  -webkit-text-fill-color: #f5f8ff !important;
  text-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-kpis .s360-card {
  border: 1px solid rgba(87, 116, 182, 0.58) !important;
  background: linear-gradient(180deg, rgba(12, 23, 48, 0.94), rgba(7, 15, 34, 0.98)) !important;
  color: #edf4ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 10px 18px rgba(1, 8, 20, 0.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-kpis .s360-card .k {
  color: #9fb2dd !important;
  -webkit-text-fill-color: #9fb2dd !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-kpis .s360-card .v {
  color: #f5f8ff !important;
  -webkit-text-fill-color: #f5f8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis {
  border: 1px solid rgba(89, 121, 191, 0.62) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(34, 197, 94, 0.10), transparent 38%),
    linear-gradient(180deg, rgba(10, 25, 48, 0.96), rgba(6, 16, 34, 0.98)) !important;
  color: #dce8ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 12px 22px rgba(1, 8, 20, 0.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis p {
  color: #b9c9eb !important;
  -webkit-text-fill-color: #b9c9eb !important;
  font-weight: 650 !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis p strong {
  color: #eaf2ff !important;
  -webkit-text-fill-color: #eaf2ff !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-reco-list .s360-alert.ok {
  border: 1px solid rgba(34, 197, 94, 0.36) !important;
  border-left: 3px solid rgba(48, 231, 139, 0.88) !important;
  border-radius: 10px !important;
  background: linear-gradient(90deg, rgba(10, 84, 56, 0.72), rgba(8, 46, 42, 0.88)) !important;
  color: #d7ffed !important;
  -webkit-text-fill-color: #d7ffed !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-tabs {
  border: 1px solid rgba(73, 105, 171, 0.54) !important;
  border-radius: 12px !important;
  background: rgba(4, 12, 29, 0.76) !important;
  padding: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-tabs .s360-btn {
  border: 1px solid rgba(92, 123, 190, 0.62) !important;
  background: linear-gradient(180deg, rgba(12, 23, 48, 0.9), rgba(7, 15, 34, 0.96)) !important;
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-tabs .s360-btn.is-active {
  border-color: rgba(163, 112, 255, 0.88) !important;
  background: linear-gradient(135deg, rgba(79, 63, 232, 0.72), rgba(146, 70, 225, 0.64)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 10px 22px rgba(99, 61, 220, 0.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-list {
  border: 1px solid rgba(73, 105, 171, 0.48) !important;
  border-radius: 12px !important;
  background: rgba(4, 12, 29, 0.46) !important;
  padding: 10px !important;
}

/* ===== Sidebar Premium Final Fix (no overlays + stable collapse) ===== */
#system360-app .s360-sidebar.s360-sidebar-premium {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  position: relative !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-height: 52px !important;
  padding: 2px 2px 10px !important;
  flex: 0 0 auto !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand,
#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand::before,
#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand::before {
  content: none !important;
  display: flex !important;
  align-items: center !important;
  font-size: 0 !important;
  line-height: 1 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand {
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
  max-width: calc(100% - 44px) !important;
  overflow: hidden !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand-logo {
  display: block !important;
  height: auto !important;
  max-width: 100% !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 84px !important;
  max-width: 84px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand-logo-short {
  width: 28px !important;
  max-width: 28px !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  display: inline-flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  max-width: 84px !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand-short {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  max-width: 0 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  position: relative !important;
  right: auto !important;
  top: auto !important;
  margin: 0 0 0 auto !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  z-index: 8 !important;
  pointer-events: auto !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  gap: 6px !important;
  padding: 0 2px 4px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav > * {
  position: relative !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item {
  position: relative !important;
  width: 100% !important;
  margin: 0 !important;
  align-items: center !important;
  line-height: 1.2 !important;
  z-index: 1 !important;
  transform: none !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item::before,
#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item::after {
  content: none !important;
  display: none !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-nav-label {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-nav-meta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  min-width: 22px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap {
  position: static !important;
  display: none !important;
  margin: 2px 0 6px 10px !important;
  padding: 2px 0 2px 10px !important;
  border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
  max-height: none !important;
  opacity: 1 !important;
  transform: none !important;
  overflow: hidden !important;
  pointer-events: auto !important;
  row-gap: 3px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap.open {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item {
  min-height: 30px !important;
  margin: 1px 0 !important;
  padding: 6px 8px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item .s360-nav-label {
  font-size: 12px !important;
  padding-left: 10px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-sidebar-foot {
  flex: 0 0 auto !important;
  padding-top: 10px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-userchip {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 56px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-meta {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-meta strong,
#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-meta small {
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium {
  width: 82px !important;
  min-width: 82px !important;
  flex: 0 0 82px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  min-height: 42px !important;
  padding: 0 0 10px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand {
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-width: 32px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  display: none !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand-short {
  display: inline-flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  max-width: 28px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  margin: 0 !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-nav {
  align-items: center !important;
  gap: 8px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-nav-item {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  grid-template-columns: 1fr !important;
  place-items: center !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap,
#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap.open {
  display: none !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  min-height: 52px !important;
  padding: 2px 2px 10px !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-brand {
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  max-width: calc(100% - 44px) !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  display: inline-flex !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-brand-short {
  display: none !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  position: relative !important;
  right: auto !important;
  top: auto !important;
  margin-left: auto !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-nav {
  align-items: stretch !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap.open {
  display: grid !important;
}

/* ===== Sidebar Premium Final Fix v2 (stacking + logo + collapsed footer) ===== */
#system360-app .s360-sidebar.s360-sidebar-premium {
  overflow: hidden !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 118px !important;
  max-width: 118px !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  max-width: 118px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 28px !important;
  column-gap: 10px !important;
  align-items: flex-start !important;
  min-height: 46px !important;
  padding: 2px 8px 8px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand {
  max-width: 100% !important;
  align-self: start !important;
  justify-self: start !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item {
  z-index: auto !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-meta {
  min-width: 20px !important;
  line-height: 1 !important;
  font-size: 0 !important;
  align-items: center !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-meta::before,
#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-meta::after,
#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-chevron::before,
#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-chevron::after {
  content: none !important;
  display: none !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap {
  margin: 3px 0 7px 12px !important;
  padding: 4px 0 3px 10px !important;
  overflow: visible !important;
  z-index: 0 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap.open {
  display: grid !important;
  max-height: none !important;
  overflow: visible !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item {
  min-height: 31px !important;
  margin: 2px 0 !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  min-height: 44px !important;
  padding: 0 7px 9px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand {
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-width: 36px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  display: inline-flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  max-width: 36px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 36px !important;
  max-width: 36px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand-short {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  max-width: 0 !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  justify-self: end !important;
  align-self: start !important;
  margin-top: 1px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle .s360-toggle-icon-stack {
  width: 12px !important;
  height: 12px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle .s360-toggle-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle .s360-toggle-chevron {
  display: inline-flex !important;
  margin-left: -4px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle .s360-toggle-chevron:first-child {
  margin-left: 0 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle .s360-toggle-icon .s360-svg-icon {
  width: 8px !important;
  height: 8px !important;
  stroke-width: 2.2 !important;
  color: #dce2ff !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle .s360-toggle-icon.close .s360-svg-icon {
  transform: rotate(180deg) !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-sidebar-foot {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  padding: 10px 0 2px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-userchip {
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  border-radius: 13px !important;
  display: inline-grid !important;
  place-items: center !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-user-avatar-wrap {
  width: 28px !important;
  height: 28px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-user-avatar {
  width: 28px !important;
  height: 28px !important;
  font-size: 12px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-user-status {
  width: 9px !important;
  height: 9px !important;
  right: -2px !important;
  bottom: -2px !important;
}

/* ===== Sidebar Premium Final Fix v3 (compact proportions like reference) ===== */
#system360-app .s360-sidebar.s360-sidebar-premium {
  width: 248px !important;
  min-width: 248px !important;
  flex: 0 0 248px !important;
  padding: 10px 9px 9px !important;
  border-radius: 14px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  grid-template-columns: minmax(0, 1fr) 24px !important;
  min-height: 40px !important;
  column-gap: 6px !important;
  padding: 0 6px 6px 0 !important;
  align-items: center !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 135px !important;
  max-width: 135px !important;
}

#system360-app .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  max-width: 135px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-brand {
  margin-left: -21px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  max-width: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  border-radius: 7px !important;
  aspect-ratio: 1 / 1 !important;
  display: inline-grid !important;
  place-items: center !important;
  align-self: center !important;
  justify-self: end !important;
  margin-top: -3px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle .s360-toggle-icon-stack {
  width: 10px !important;
  height: 10px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-toggle .s360-toggle-icon .s360-svg-icon {
  width: 7px !important;
  height: 7px !important;
  stroke-width: 2.1 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav {
  gap: 3px !important;
  padding: 0 1px 3px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item {
  min-height: 31px !important;
  border-radius: 9px !important;
  padding: 6px 8px !important;
  grid-template-columns: 14px minmax(0, 1fr) auto !important;
  gap: 8px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-nav-icon .s360-svg-icon {
  width: 13px !important;
  height: 13px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-nav-label {
  font-size: 11.8px !important;
  font-weight: 500 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-nav-meta {
  min-width: 20px !important;
  gap: 6px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-chevron {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(160, 170, 210, 0.3) !important;
  background: rgba(18, 23, 44, 0.78) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  line-height: 0 !important;
  transform: rotate(0deg) !important;
  transform-origin: center center !important;
  transition: transform 220ms ease-in-out, border-color 200ms ease-in-out, background-color 200ms ease-in-out, box-shadow 220ms ease-in-out !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-chevron .s360-svg-icon {
  width: 10px !important;
  height: 10px !important;
  display: block !important;
  overflow: visible !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 2.2 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item:hover .s360-chevron {
  border-color: rgba(110, 127, 255, 0.58) !important;
  background: rgba(34, 47, 92, 0.9) !important;
  box-shadow: 0 0 0 1px rgba(93, 113, 255, 0.28), 0 4px 10px rgba(8, 12, 30, 0.38) !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item .s360-chevron.open {
  transform: rotate(90deg) !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-badge {
  min-width: 15px !important;
  height: 15px !important;
  padding: 0 4px !important;
  font-size: 9px !important;
  line-height: 13px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-submenu-wrap {
  margin: 1px 0 4px 9px !important;
  padding: 2px 0 1px 8px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item {
  min-height: 24px !important;
  border-radius: 7px !important;
  padding: 4px 7px !important;
  margin: 1px 0 !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-nav-item.s360-sub-item .s360-nav-label {
  font-size: 11px !important;
  padding-left: 8px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-sidebar-foot {
  padding-top: 8px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-userchip {
  min-height: 44px !important;
  border-radius: 10px !important;
  padding: 6px 8px !important;
  gap: 7px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-avatar-wrap {
  width: 24px !important;
  height: 24px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-avatar {
  width: 24px !important;
  height: 24px !important;
  font-size: 11px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-status {
  width: 8px !important;
  height: 8px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-meta strong {
  font-size: 11.8px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-meta small {
  font-size: 10.6px !important;
}

#system360-app .s360-sidebar.s360-sidebar-premium .s360-side-user-menu-toggle {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  border-radius: 8px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium {
  width: 74px !important;
  min-width: 74px !important;
  flex: 0 0 74px !important;
  padding: 9px 2px 8px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  grid-template-columns: none !important;
  min-height: 66px !important;
  padding: 0 0 8px !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand {
  width: 70px !important;
  min-width: 70px !important;
  height: 70px !important;
  min-height: 70px !important;
  max-width: 70px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  transform: none !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 70px !important;
  max-width: 70px !important;
  margin: 0 auto !important;
  transform: none !important;
  display: block !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
  padding: 0 !important;
  border-radius: 7px !important;
  aspect-ratio: 1 / 1 !important;
  position: static !important;
  align-self: center !important;
  justify-self: center !important;
  margin: 0 !important;
}

#system360-app .s360-shell.collapsed .s360-sidebar.s360-sidebar-premium .s360-nav-item {
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
}

#system360-app .s360-shell.collapsed.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium {
  width: 248px !important;
  min-width: 248px !important;
  flex: 0 0 248px !important;
}

/* ===== Login Replica Final (Reference 2026-04-24) ===== */
#system360-app .s360-app.s360-app-login {
  min-height: 100dvh !important;
  padding: 38px 34px 18px !important;
  display: grid !important;
  align-content: center !important;
  gap: 14px !important;
  background: #050518 url("https://static.wixstatic.com/media/ddf669_2524b342f4f8432d8cd697b64fa5a2b2~mv2.png") center center / cover no-repeat fixed !important;
}

#system360-app .s360-login-shell {
  width: min(1480px, calc(100vw - 68px)) !important;
  min-height: min(820px, calc(100dvh - 124px)) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(470px, 48%) minmax(620px, 52%) !important;
  border-radius: 30px !important;
  overflow: hidden !important;
  border: 1px solid rgba(132, 148, 186, 0.32) !important;
  background: transparent !important;
  box-shadow: 0 22px 58px rgba(2, 8, 22, 0.38) !important;
}

#system360-app .s360-login-hero {
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 18px !important;
  padding: 46px 54px 44px !important;
  border-radius: 30px 0 0 30px !important;
  color: #f8fbff !important;
  background: #02040d url("https://static.wixstatic.com/media/ddf669_9a0d40364a3a4523abb48a54b0c48027~mv2.png") left center / cover no-repeat !important;
}

#system360-app .s360-login-brand {
  margin: 0 !important;
}

#system360-app .s360-login-logo {
  width: clamp(148px, 9.7vw, 176px) !important;
  max-width: 100% !important;
  height: auto !important;
  filter: none !important;
}

#system360-app .s360-login-hero-copy {
  margin-top: 8px !important;
}

#system360-app .s360-login-hero-copy h2 {
  margin: 0 0 14px !important;
  font-size: clamp(30px, 2.12vw, 40px) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.02em !important;
  font-weight: 650 !important;
  color: #f8fbff !important;
}

#system360-app .s360-login-hero-copy h2 span {
  background: linear-gradient(90deg, #2c85ff 0%, #8b45ff 54%, #ff46a7 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

#system360-app .s360-login-hero-copy p {
  margin: 0 !important;
  width: min(430px, 96%) !important;
  font-size: clamp(14px, 0.9vw, 17px) !important;
  line-height: 1.5 !important;
  color: rgba(233, 241, 255, 0.92) !important;
}

#system360-app .s360-login-feature-list {
  margin-top: auto !important;
  display: grid !important;
  gap: 14px !important;
}

#system360-app .s360-login-feature-item {
  grid-template-columns: 54px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
}

#system360-app .s360-login-feature-icon {
  width: 54px !important;
  height: 54px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(150, 172, 212, 0.26) !important;
  background: linear-gradient(150deg, rgba(15, 27, 56, 0.94), rgba(7, 14, 30, 0.82)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 8px 18px rgba(1, 4, 14, 0.38) !important;
}

#system360-app .s360-login-feature-icon .s360-svg-icon {
  width: 21px !important;
  height: 21px !important;
}

#system360-app .s360-login-feature-item strong {
  font-size: clamp(14px, 0.9vw, 16px) !important;
  line-height: 1.2 !important;
  font-weight: 640 !important;
  color: #ffffff !important;
}

#system360-app .s360-login-feature-item small {
  margin-top: 4px !important;
  font-size: clamp(12px, 0.75vw, 13px) !important;
  line-height: 1.45 !important;
  color: rgba(221, 233, 250, 0.9) !important;
}

#system360-app .s360-login-form-wrap {
  background: #f3f4f8 !important;
  border-radius: 0 30px 30px 0 !important;
  padding: 42px 66px 30px !important;
  display: grid !important;
  align-content: start !important;
}

#system360-app .s360-login-locale {
  justify-self: end !important;
  min-height: 44px !important;
  padding: 0 15px !important;
  border-radius: 12px !important;
  border: 1px solid #d3dae6 !important;
  background: #f7f8fb !important;
  color: #4c5a73 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  gap: 8px !important;
}

#system360-app .s360-login-locale-caret {
  transform: rotate(90deg) !important;
  opacity: 0.78 !important;
}

#system360-app .s360-login-form-card {
  width: 100% !important;
  max-width: 560px !important;
  margin: 46px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-login-form-card h3 {
  margin: 0 0 10px !important;
  color: #111b34 !important;
  font-size: clamp(28px, 1.8vw, 48px) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
  font-weight: 700 !important;
}

#system360-app .s360-login-form-card > p {
  margin: 0 0 28px !important;
  color: #64718a !important;
  font-size: clamp(13px, 0.86vw, 15px) !important;
  line-height: 1.35 !important;
}

#system360-app .s360-login-form-card label {
  margin: 0 0 11px !important;
  color: #303a4e !important;
  font-size: 15px !important;
  font-weight: 620 !important;
}

#system360-app .s360-login-form-card label[for="s360-p"] {
  margin-top: 28px !important;
}

#system360-app .s360-login-input-wrap {
  min-height: 56px !important;
  border-radius: 12px !important;
  border: 1px solid #d0d7e4 !important;
  background: #fdfdff !important;
  padding: 0 16px !important;
  gap: 12px !important;
  margin: 0 !important;
  box-shadow: none !important;
}

#system360-app .s360-login-input-wrap:focus-within {
  border-color: #7d9fff !important;
  box-shadow: 0 0 0 3px rgba(75, 130, 255, 0.14) !important;
}

#system360-app .s360-login-input-wrap input,
#system360-app .s360-login-input-wrap #s360-u,
#system360-app .s360-login-input-wrap #s360-p {
  height: 36px !important;
  min-height: 0 !important;
  border: 0 !important;
  outline: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  color: #172030 !important;
  font-size: 17px !important;
  line-height: 1.2 !important;
}

#system360-app .s360-login-input-wrap input::placeholder {
  color: #7f8a9f !important;
}

#system360-app .s360-login-input-icon,
#system360-app .s360-login-eye-btn {
  color: #748198 !important;
}

#system360-app .s360-login-input-icon .s360-svg-icon,
#system360-app .s360-login-eye-btn .s360-svg-icon {
  width: 20px !important;
  height: 20px !important;
}

#system360-app .s360-login-eye-btn {
  width: 22px !important;
  height: 22px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-login-meta-row {
  margin-top: 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
}

#system360-app .s360-login-check {
  gap: 9px !important;
  color: #5d6880 !important;
  font-size: 14px !important;
  font-weight: 510 !important;
}

#system360-app .s360-login-check input {
  width: 19px !important;
  height: 19px !important;
  accent-color: #2f63ff !important;
}

#system360-app .s360-login-link-btn,
#system360-app .s360-login-link-btn:hover,
#system360-app .s360-login-link-btn:focus,
#system360-app .s360-login-link-btn:focus-visible,
#system360-app .s360-login-link-btn:active {
  color: #2e63ff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
  background: transparent !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  outline: none !important;
}

#system360-app .s360-login-primary-btn {
  margin-top: 18px !important;
  min-height: 58px !important;
  width: 100% !important;
  border-radius: 12px !important;
  border: 0 !important;
  background: linear-gradient(90deg, #2d5dff 0%, #6f45ef 52%, #e44298 100%) !important;
  color: #ffffff !important;
  font-size: clamp(18px, 1.08vw, 22px) !important;
  font-weight: 660 !important;
  letter-spacing: 0 !important;
  box-shadow: 0 8px 22px rgba(77, 95, 228, 0.23) !important;
}

#system360-app .s360-login-primary-btn span .s360-svg-icon {
  width: 20px !important;
  height: 20px !important;
}

#system360-app .s360-login-status {
  margin-top: 8px !important;
  min-height: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #768196 !important;
  font-size: 12px !important;
}

#system360-app .s360-login-status:empty {
  display: none !important;
}

#system360-app .s360-login-divider {
  margin: 20px 0 14px !important;
  grid-template-columns: 1fr auto 1fr !important;
  gap: 12px !important;
  color: #707c92 !important;
  font-size: 15px !important;
}

#system360-app .s360-login-divider::before,
#system360-app .s360-login-divider::after {
  background: #d4dbe7 !important;
}

#system360-app .s360-login-social-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

#system360-app .s360-login-social-btn {
  min-height: 54px !important;
  border-radius: 11px !important;
  border: 1px solid #d6dce8 !important;
  background: #ffffff !important;
  color: #2d3850 !important;
  font-size: 14px !important;
  font-weight: 530 !important;
  gap: 9px !important;
  box-shadow: none !important;
}

#system360-app .s360-login-social-icon {
  width: 23px !important;
  height: 23px !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: #111827 !important;
}

#system360-app .s360-login-social-icon svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

#system360-app .s360-login-create-account {
  margin-top: 30px !important;
  text-align: center !important;
  color: #67748a !important;
  font-size: 14px !important;
}

#system360-app .s360-login-create-account .s360-login-link-btn {
  font-size: 14px !important;
}

#system360-app .s360-login-version {
  display: none !important;
}

#system360-app .s360-login-footer {
  width: min(1480px, calc(100vw - 68px)) !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
  color: rgba(214, 223, 242, 0.84) !important;
  font-size: 13px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#system360-app .s360-login-footer span:first-child {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

#system360-app .s360-login-footer span:first-child::before {
  content: "" !important;
  width: 14px !important;
  height: 14px !important;
  display: inline-block !important;
  background: currentColor !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17 8h-1V6a4 4 0 1 0-8 0v2H7a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-9a2 2 0 0 0-2-2Zm-6 0V6a2 2 0 1 1 4 0v2h-4Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17 8h-1V6a4 4 0 1 0-8 0v2H7a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-9a2 2 0 0 0-2-2Zm-6 0V6a2 2 0 1 1 4 0v2h-4Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

@media (max-width: 1280px) {
  #system360-app .s360-app.s360-app-login {
    padding: 20px 14px 12px !important;
  }

  #system360-app .s360-login-shell,
  #system360-app .s360-login-footer {
    width: min(1480px, calc(100vw - 28px)) !important;
  }

  #system360-app .s360-login-shell {
    min-height: auto !important;
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-login-hero {
    min-height: 430px !important;
    border-radius: 24px 24px 0 0 !important;
    padding: 30px 28px 22px !important;
  }

  #system360-app .s360-login-form-wrap {
    border-radius: 0 0 24px 24px !important;
    padding: 22px 20px 18px !important;
  }

  #system360-app .s360-login-form-card {
    margin-top: 18px !important;
    max-width: 100% !important;
  }
}

#system360-app .s360-app-login .s360-login-primary-btn.s360-btn {
  background: linear-gradient(90deg, #2d5dff 0%, #6f45ef 52%, #e44298 100%) !important;
  background-image: linear-gradient(90deg, #2d5dff 0%, #6f45ef 52%, #e44298 100%) !important;
  color: #ffffff !important;
  border: 0 !important;
}

#system360-app .s360-app-login .s360-login-primary-btn.s360-btn:hover,
#system360-app .s360-app-login .s360-login-primary-btn.s360-btn:focus,
#system360-app .s360-app-login .s360-login-primary-btn.s360-btn:focus-visible {
  background: linear-gradient(90deg, #2856ec 0%, #663dde 52%, #d93d8f 100%) !important;
  background-image: linear-gradient(90deg, #2856ec 0%, #663dde 52%, #d93d8f 100%) !important;
  color: #ffffff !important;
}

@media (max-width: 860px) {
  #system360-app .s360-login-feature-list {
    display: none !important;
  }

  #system360-app .s360-login-social-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ===== Login Replica Apr 2026 (single white card + background scene) ===== */
#system360-app .s360-app.s360-app-login,
#system360-app .s360-app.s360-app-login * {
  font-family: "Manrope", "Plus Jakarta Sans", "Segoe UI", Tahoma, sans-serif !important;
}

#system360-app .s360-app.s360-app-login {
  position: relative !important;
  width: 100vw !important;
  min-height: 100dvh !important;
  display: grid !important;
  grid-template-columns: minmax(340px, 500px) minmax(560px, 680px) !important;
  justify-content: center !important;
  align-items: center !important;
  gap: clamp(16px, 2.3vw, 34px) !important;
  padding: clamp(10px, 1.4vw, 18px) clamp(16px, 2.4vw, 34px) 42px !important;
  overflow: hidden !important;
  background: #050518 url("https://static.wixstatic.com/media/ddf669_2524b342f4f8432d8cd697b64fa5a2b2~mv2.png") center center / cover no-repeat !important;
  color: #ffffff !important;
}

#system360-app .s360-app.s360-app-login .s360-login-bg-panel {
  position: relative !important;
  z-index: 2 !important;
  width: min(500px, 100%) !important;
  margin-left: 0 !important;
  display: grid !important;
  align-content: start !important;
  align-self: start !important;
  gap: clamp(4px, 0.8vw, 8px) !important;
  padding-top: 0 !important;
  margin-top: clamp(-34px, -3.2vh, -18px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-app .s360-app.s360-app-login .s360-login-brand {
  margin: 0 0 0 -65px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-logo {
  width: clamp(186px, 13.8vw, 260px) !important;
  max-width: 100% !important;
  filter: drop-shadow(0 8px 18px rgba(6, 10, 33, 0.42)) !important;
}

#system360-app .s360-app.s360-app-login .s360-login-hero-copy {
  max-width: 460px !important;
  margin-top: -45px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-hero-copy h2 {
  margin: 0 !important;
  color: #f8fbff !important;
  font-size: clamp(34px, 2.95vw, 56px) !important;
  line-height: 1.08 !important;
  font-weight: 740 !important;
  letter-spacing: -0.02em !important;
}

#system360-app .s360-app.s360-app-login .s360-login-hero-copy h2 span {
  background: linear-gradient(90deg, #2f87ff 0%, #9b4dff 54%, #ff4da0 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

#system360-app .s360-app.s360-app-login .s360-login-hero-copy p {
  margin: 6px 0 0 !important;
  max-width: 430px !important;
  color: rgba(228, 235, 255, 0.86) !important;
  font-size: clamp(14px, 0.96vw, 17px) !important;
  line-height: 1.44 !important;
}

#system360-app .s360-app.s360-app-login .s360-login-feature-list {
  margin-top: 200px !important;
  display: grid !important;
  gap: 12px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-feature-item {
  display: grid !important;
  grid-template-columns: 46px 1fr !important;
  gap: 11px !important;
  align-items: center !important;
}

#system360-app .s360-app.s360-app-login .s360-login-feature-icon {
  width: 46px !important;
  height: 46px !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(151, 170, 255, 0.26) !important;
  background: linear-gradient(150deg, rgba(9, 14, 44, 0.92), rgba(13, 26, 76, 0.66)) !important;
  color: #7ca9ff !important;
  box-shadow: 0 8px 18px rgba(3, 5, 20, 0.38) !important;
}

#system360-app .s360-app.s360-app-login .s360-login-feature-icon .s360-svg-icon {
  width: 21px !important;
  height: 21px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-feature-item:nth-child(1) .s360-login-feature-icon { color: #9159ff !important; }
#system360-app .s360-app.s360-app-login .s360-login-feature-item:nth-child(2) .s360-login-feature-icon { color: #1ad688 !important; }
#system360-app .s360-app.s360-app-login .s360-login-feature-item:nth-child(3) .s360-login-feature-icon { color: #ffa32d !important; }

#system360-app .s360-app.s360-app-login .s360-login-feature-item strong {
  display: block !important;
  margin: 0 0 2px !important;
  color: #f8fbff !important;
  font-size: clamp(14px, 1.01vw, 18px) !important;
  font-weight: 710 !important;
}

#system360-app .s360-app.s360-app-login .s360-login-feature-item small {
  display: block !important;
  margin: 0 !important;
  color: rgba(211, 222, 252, 0.84) !important;
  font-size: clamp(12px, 0.84vw, 15px) !important;
  line-height: 1.36 !important;
}

#system360-app .s360-app.s360-app-login .s360-login-shell {
  position: relative !important;
  z-index: 3 !important;
  width: min(680px, 100%) !important;
  min-height: min(780px, calc(100dvh - 158px)) !important;
  margin: 0 !important;
  border-radius: 22px !important;
  border: 1px solid rgba(223, 227, 238, 0.96) !important;
  background: #f6f7fa !important;
  box-shadow: 0 24px 56px rgba(5, 8, 32, 0.34) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden !important;
  display: block !important;
  padding: 0 !important;
  transform: none !important;
}

#system360-app .s360-app.s360-app-login .s360-login-form-wrap {
  min-height: 100% !important;
  padding: clamp(16px, 1.8vw, 26px) clamp(16px, 1.95vw, 30px) clamp(18px, 1.9vw, 26px) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  background: transparent !important;
}

#system360-app .s360-app.s360-app-login .s360-login-locale {
  align-self: flex-end !important;
  margin-bottom: clamp(10px, 1.4vh, 18px) !important;
  min-height: 46px !important;
  border-radius: 12px !important;
  border: 1px solid #d6dae4 !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: #57617a !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-login .s360-login-locale .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-form-card {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#system360-app .s360-app.s360-app-login .s360-login-form-card h3 {
  margin: 0 !important;
  color: #151f33 !important;
  font-size: clamp(24px, 1.65vw, 34px) !important;
  line-height: 1.14 !important;
  font-weight: 720 !important;
  letter-spacing: -0.02em !important;
}

#system360-app .s360-app.s360-app-login .s360-login-form-card > p {
  margin: 7px 0 40px !important;
  color: #6e7890 !important;
  font-size: clamp(14px, 0.86vw, 16px) !important;
}

#system360-app .s360-app.s360-app-login .s360-login-form-card label {
  margin: 0 0 7px !important;
  color: #3a455a !important;
  font-size: clamp(13px, 0.8vw, 15px) !important;
  font-weight: 620 !important;
}

#system360-app .s360-app.s360-app-login .s360-login-form-card label[for="s360-p"] {
  margin-top: 27px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-input-wrap {
  min-height: 54px !important;
  margin: 0 0 13px !important;
  border-radius: 12px !important;
  border: 1px solid #d4dae6 !important;
  background: #fcfdff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
  padding: 0 14px !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-input-wrap:focus-within {
  border-color: #7b98ff !important;
  box-shadow: 0 0 0 3px rgba(84, 121, 255, 0.16) !important;
}

#system360-app .s360-app.s360-app-login .s360-login-input-wrap input,
#system360-app .s360-app.s360-app-login .s360-login-input-wrap #s360-u,
#system360-app .s360-app.s360-app-login .s360-login-input-wrap #s360-p {
  height: 34px !important;
  color: #1c2438 !important;
  font-size: clamp(14px, 0.84vw, 16px) !important;
  line-height: 1.2 !important;
}

#system360-app .s360-app.s360-app-login .s360-login-input-wrap input::placeholder {
  color: #8b96ad !important;
}

#system360-app .s360-app.s360-app-login .s360-login-input-icon,
#system360-app .s360-app.s360-app-login .s360-login-eye-btn {
  color: #7b879f !important;
}

#system360-app .s360-app.s360-app-login .s360-login-input-icon .s360-svg-icon,
#system360-app .s360-app.s360-app-login .s360-login-eye-btn .s360-svg-icon {
  width: 19px !important;
  height: 19px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-meta-row {
  margin-top: 1px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-check {
  color: #66748e !important;
  font-size: clamp(13px, 0.8vw, 15px) !important;
}

#system360-app .s360-app.s360-app-login .s360-login-link-btn,
#system360-app .s360-app.s360-app-login .s360-login-link-btn:hover,
#system360-app .s360-app.s360-app-login .s360-login-link-btn:focus,
#system360-app .s360-app.s360-app-login .s360-login-link-btn:focus-visible,
#system360-app .s360-app.s360-app-login .s360-login-link-btn:active {
  color: #2157ff !important;
  font-size: clamp(13px, 0.8vw, 15px) !important;
}

#system360-app .s360-app.s360-app-login .s360-login-primary-btn,
#system360-app .s360-app.s360-app-login .s360-login-primary-btn.s360-btn {
  margin-top: 10px !important;
  min-height: 52px !important;
  border-radius: 12px !important;
  border: 0 !important;
  box-shadow: 0 14px 32px rgba(72, 84, 226, 0.28) !important;
  background: linear-gradient(90deg, #2d5dff 0%, #6f45ef 52%, #e44298 100%) !important;
  color: #ffffff !important;
  font-size: clamp(15px, 0.86vw, 18px) !important;
  font-weight: 680 !important;
}

#system360-app .s360-app.s360-app-login .s360-login-primary-btn span .s360-svg-icon {
  width: 19px !important;
  height: 19px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-loading {
  min-height: 56px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-status {
  margin-top: 10px !important;
  color: #6f7c94 !important;
}

#system360-app .s360-app.s360-app-login .s360-login-divider {
  margin: 14px 0 10px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-social-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-social-btn {
  min-height: 48px !important;
  border-radius: 12px !important;
  border: 1px solid #d5dbe8 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 0 12px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-social-icon {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  flex: 0 0 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0 !important;
  line-height: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  color: #111827 !important;
}

#system360-app .s360-app.s360-app-login .s360-login-social-icon svg {
  width: 20px !important;
  height: 20px !important;
  display: block !important;
}

#system360-app .s360-app.s360-app-login .s360-login-social-icon.is-google,
#system360-app .s360-app.s360-app-login .s360-login-social-icon.is-microsoft {
  color: inherit !important;
}

#system360-app .s360-app.s360-app-login .s360-login-social-icon.is-microsoft {
  background: transparent !important;
}

#system360-app .s360-app.s360-app-login .s360-login-social-icon.is-apple {
  color: #111827 !important;
  position: static !important;
}

#system360-app .s360-app.s360-app-login .s360-login-social-icon.is-apple::before {
  content: none !important;
  display: none !important;
}

#system360-app .s360-app.s360-app-login .s360-login-social-btn > span:not(.s360-login-social-icon) {
  font-size: 14px !important;
  line-height: 1 !important;
}

#system360-app .s360-app.s360-app-login .s360-login-create-account {
  margin-top: 16px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-footer {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 20px !important;
  z-index: 2 !important;
  width: 100% !important;
  margin: 0 !important;
  justify-content: center !important;
  gap: 14px !important;
  color: rgba(213, 222, 246, 0.74) !important;
  font-size: 12px !important;
}

#system360-app .s360-app.s360-app-login .s360-login-footer span + span::before {
  content: "|" !important;
  margin-right: 14px !important;
  color: rgba(213, 222, 246, 0.52) !important;
}

@media (max-width: 1260px) {
  #system360-app .s360-app.s360-app-login {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    align-content: flex-start !important;
    gap: 16px !important;
    padding: 20px 14px 18px !important;
    overflow-y: auto !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-bg-panel {
    width: min(760px, 100%) !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-brand {
    margin-left: 0 !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-shell {
    width: min(760px, 100%) !important;
    min-height: auto !important;
    margin: 0 !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-footer {
    position: static !important;
    margin-top: 4px !important;
  }
}

@media (max-width: 920px) {
  #system360-app .s360-app.s360-app-login .s360-login-feature-list {
    display: none !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-hero-copy h2 {
    font-size: clamp(28px, 8vw, 40px) !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-hero-copy p {
    font-size: 15px !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-social-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 680px) {
  #system360-app .s360-app.s360-app-login .s360-login-shell {
    width: 100% !important;
    border-radius: 22px !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-form-wrap {
    padding: 16px 14px 18px !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-locale {
    min-height: 48px !important;
    margin-bottom: 14px !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-input-wrap {
    min-height: 58px !important;
    margin-bottom: 16px !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-form-card label[for="s360-p"] {
    margin-top: 6px !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-input-wrap input,
  #system360-app .s360-app.s360-app-login .s360-login-input-wrap #s360-u,
  #system360-app .s360-app.s360-app-login .s360-login-input-wrap #s360-p {
    font-size: 16px !important;
    height: 34px !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-primary-btn,
  #system360-app .s360-app.s360-app-login .s360-login-primary-btn.s360-btn {
    min-height: 58px !important;
    font-size: 18px !important;
  }

  #system360-app .s360-app.s360-app-login .s360-login-footer {
    font-size: 12px !important;
    gap: 10px !important;
  }

}

/* ===== Topbar Dark V2 (reference-aligned) ===== */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos {
  position: relative !important;
  z-index: 90 !important;
  min-height: 66px !important;
  max-height: 66px !important;
  height: 66px !important;
  padding: 10px 14px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(94, 109, 150, 0.26) !important;
  background:
    radial-gradient(120% 180% at 50% 0%, rgba(118, 82, 255, 0.12), transparent 56%),
    linear-gradient(180deg, rgba(14, 20, 36, 0.96) 0%, rgba(9, 14, 28, 0.94) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 14px 34px rgba(3, 7, 20, 0.46) !important;
  backdrop-filter: blur(10px) saturate(112%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(112%) !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-top-left {
  gap: 10px !important;
  min-width: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-mobile-side-trigger {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(102, 121, 167, 0.34) !important;
  background: linear-gradient(180deg, rgba(37, 47, 78, 0.68), rgba(20, 28, 50, 0.64)) !important;
  color: #d6dff7 !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-mobile-side-trigger .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-title-text {
  color: #f2f5ff !important;
  font-size: 20px !important;
  font-weight: 690 !important;
  letter-spacing: -0.012em !important;
  text-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-right {
  gap: 8px !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-group {
  min-height: 42px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(82, 99, 140, 0.35) !important;
  background: linear-gradient(180deg, rgba(21, 29, 51, 0.84), rgba(13, 20, 39, 0.84)) !important;
  padding: 4px 6px !important;
  gap: 6px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-group + .s360-topbar-group {
  border-left: 1px solid rgba(80, 95, 132, 0.34) !important;
  padding-left: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-group-meta {
  max-width: 260px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-icon-wrap {
  position: relative !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-icon-btn {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(95, 112, 153, 0.34) !important;
  background: linear-gradient(180deg, rgba(28, 37, 63, 0.86), rgba(15, 23, 43, 0.86)) !important;
  color: #d4def7 !important;
  box-shadow: none !important;
  transform: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-icon-btn:hover {
  border-color: rgba(130, 97, 255, 0.62) !important;
  background: linear-gradient(180deg, rgba(39, 49, 84, 0.94), rgba(21, 31, 58, 0.92)) !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 1px rgba(109, 76, 255, 0.28), 0 10px 18px rgba(8, 12, 28, 0.35) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-icon-btn .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
  stroke-width: 1.9 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-icon-badge {
  top: -4px !important;
  right: -4px !important;
  min-width: 16px !important;
  height: 16px !important;
  border-radius: 999px !important;
  padding: 0 4px !important;
  border: 1px solid rgba(226, 218, 255, 0.32) !important;
  background: linear-gradient(180deg, #8b5cff 0%, #6b34ff 100%) !important;
  color: #f8f5ff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 14px !important;
  box-shadow: 0 8px 14px rgba(88, 46, 220, 0.42) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-live-time,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-live-datetime,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-badge,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-user,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-call-top-pill {
  min-height: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(82, 100, 141, 0.36) !important;
  background: linear-gradient(180deg, rgba(24, 33, 57, 0.86), rgba(14, 22, 43, 0.86)) !important;
  color: #c7d4f4 !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-live-time {
  padding: 0 10px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  gap: 6px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-live-datetime {
  max-width: 166px !important;
  font-size: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-work-period-badge {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #d7e4ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-user {
  max-width: 245px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  font-weight: 620 !important;
  color: #e0e8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-refresh,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-logout {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border-radius: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-refresh {
  border: 1px solid rgba(95, 128, 190, 0.42) !important;
  background: linear-gradient(180deg, rgba(31, 44, 74, 0.88), rgba(15, 23, 43, 0.86)) !important;
  color: #cfe2ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 7px 14px rgba(2, 8, 23, 0.2) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-refresh:hover {
  border-color: rgba(102, 174, 255, 0.64) !important;
  background: linear-gradient(180deg, rgba(40, 61, 100, 0.9), rgba(18, 30, 55, 0.88)) !important;
  color: #e7f2ff !important;
  filter: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 9px 18px rgba(12, 28, 64, 0.26) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-refresh[aria-busy="true"] {
  border-color: rgba(102, 174, 255, 0.72) !important;
  color: #f4f9ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-refresh[aria-busy="true"]::after {
  inset: -2px !important;
  border-radius: 12px !important;
  border-color: rgba(102, 174, 255, 0.18) !important;
  border-top-color: rgba(102, 174, 255, 0.9) !important;
  border-right-color: rgba(207, 226, 255, 0.86) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-logout {
  border: 1px solid rgba(95, 113, 156, 0.38) !important;
  background: linear-gradient(180deg, rgba(28, 37, 63, 0.86), rgba(15, 23, 43, 0.86)) !important;
  color: #d9e2fa !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-logout:hover {
  border-color: rgba(255, 126, 126, 0.62) !important;
  color: #ffe1e1 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-host > .s360-dropdown,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-chat-host > .s360-dropdown,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-dropdown,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-host > .s360-notif-dropdown,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-chat-host > .s360-chat-dropdown,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown {
  margin-top: 10px !important;
  border: 1px solid rgba(83, 101, 142, 0.42) !important;
  background: linear-gradient(180deg, rgba(19, 27, 47, 0.96), rgba(11, 18, 34, 0.96)) !important;
  box-shadow: 0 20px 36px rgba(5, 10, 24, 0.45) !important;
}

@media (max-width: 1200px) {
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-live-datetime,
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-user,
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-work-period-badge {
    display: none !important;
  }
}

@media (max-width: 980px) {
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos {
    min-height: auto !important;
    max-height: none !important;
    height: auto !important;
    padding: 8px 10px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-right {
    gap: 6px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-group {
    min-height: 38px !important;
    padding: 3px 5px !important;
  }
}

/* ===== Notification Panel Redesign V3 ===== */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern {
  top: calc(100% + 10px) !important;
  right: -8px !important;
  width: min(790px, calc(100vw - 24px)) !important;
  max-height: min(78vh, 820px) !important;
  padding: 14px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(92, 109, 150, 0.44) !important;
  background:
    radial-gradient(120% 180% at 50% 0%, rgba(120, 74, 255, 0.12), transparent 58%),
    linear-gradient(180deg, rgba(11, 16, 30, 0.98), rgba(8, 13, 25, 0.98)) !important;
  box-shadow: 0 26px 56px rgba(3, 8, 22, 0.62), inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
  backdrop-filter: blur(14px) saturate(112%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(112%) !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head {
  margin: 0 !important;
  padding: 0 0 12px !important;
  border: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-left {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head h4 {
  margin: 0 !important;
  font-size: 36px !important;
  line-height: 1 !important;
  letter-spacing: -0.03em !important;
  font-weight: 700 !important;
  color: #eef3ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head .s360-badge {
  min-width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(162, 119, 255, 0.58) !important;
  background: linear-gradient(180deg, rgba(145, 88, 255, 0.84), rgba(105, 53, 242, 0.84)) !important;
  color: #f9f5ff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 0 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-link {
  border: 0 !important;
  background: transparent !important;
  color: #a777ff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  padding: 2px 4px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-link:hover {
  color: #c69dff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-link:disabled {
  color: rgba(149, 164, 203, 0.46) !important;
  cursor: default !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-close {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(90, 107, 146, 0.42) !important;
  background: linear-gradient(180deg, rgba(25, 35, 60, 0.9), rgba(16, 24, 43, 0.9)) !important;
  color: #dbe4ff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-close .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid rgba(66, 83, 120, 0.42) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tabs {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab {
  min-height: 36px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(78, 96, 136, 0.42) !important;
  background: linear-gradient(180deg, rgba(24, 34, 58, 0.78), rgba(15, 23, 42, 0.78)) !important;
  color: #d8e3ff !important;
  padding: 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab span {
  font-size: 14px !important;
  font-weight: 560 !important;
  line-height: 1 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab small {
  min-width: 20px !important;
  height: 20px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(88, 104, 143, 0.44) !important;
  background: rgba(10, 16, 31, 0.5) !important;
  color: #9eb3e7 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 6px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab.is-active {
  border-color: rgba(151, 95, 255, 0.72) !important;
  background: linear-gradient(90deg, rgba(77, 48, 255, 0.94) 0%, rgba(174, 66, 219, 0.9) 100%) !important;
  color: #ffffff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab.is-active small {
  border-color: rgba(255, 255, 255, 0.44) !important;
  background: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-wrap {
  position: relative !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn {
  min-height: 36px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(80, 98, 139, 0.44) !important;
  background: linear-gradient(180deg, rgba(23, 33, 56, 0.86), rgba(14, 22, 41, 0.86)) !important;
  color: #d7e1ff !important;
  font-size: 13px !important;
  font-weight: 560 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 0 10px !important;
  cursor: pointer !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn small {
  color: #9ab0e1 !important;
  font-size: 11px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn.is-active,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn.is-open {
  border-color: rgba(148, 95, 255, 0.72) !important;
  color: #efe5ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-menu {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  min-width: 220px !important;
  padding: 8px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(95, 112, 153, 0.5) !important;
  background: linear-gradient(180deg, rgba(18, 27, 46, 0.98), rgba(11, 18, 35, 0.98)) !important;
  box-shadow: 0 18px 34px rgba(4, 9, 21, 0.5) !important;
  z-index: 9 !important;
  display: grid !important;
  gap: 6px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-menu button {
  min-height: 34px !important;
  border-radius: 9px !important;
  border: 1px solid transparent !important;
  background: rgba(17, 26, 45, 0.92) !important;
  color: #d8e3ff !important;
  text-align: left !important;
  font-size: 13px !important;
  font-weight: 540 !important;
  padding: 0 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-menu button.is-active {
  border-color: rgba(143, 90, 255, 0.66) !important;
  background: rgba(88, 47, 196, 0.34) !important;
  color: #ffffff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack {
  margin-top: 12px !important;
  max-height: min(56vh, 560px) !important;
  display: grid !important;
  gap: 0 !important;
  overflow: auto !important;
  padding-right: 4px !important;
  scrollbar-gutter: stable !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel::-webkit-scrollbar,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack::-webkit-scrollbar {
  width: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel::-webkit-scrollbar-thumb,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  border: 2px solid rgba(11, 17, 31, 0.9) !important;
  background: rgba(103, 122, 165, 0.58) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card {
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 14px 10px !important;
  border-bottom: 1px solid rgba(63, 79, 115, 0.34) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card:last-child {
  border-bottom: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card:hover {
  background: rgba(72, 92, 136, 0.12) !important;
  transform: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card.is-read {
  opacity: 0.74 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head {
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) auto !important;
  gap: 12px !important;
  align-items: start !important;
  margin: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon {
  width: 46px !important;
  height: 46px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(81, 97, 137, 0.48) !important;
  background: linear-gradient(180deg, rgba(28, 38, 64, 0.84), rgba(17, 25, 45, 0.84)) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-kind-mentions .s360-notif-icon {
  border-color: rgba(57, 196, 127, 0.5) !important;
  background: linear-gradient(180deg, rgba(12, 74, 48, 0.56), rgba(9, 43, 34, 0.72)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-kind-tasks .s360-notif-icon {
  border-color: rgba(246, 169, 63, 0.52) !important;
  background: linear-gradient(180deg, rgba(96, 56, 19, 0.58), rgba(52, 31, 12, 0.72)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-kind-system .s360-notif-icon {
  border-color: rgba(156, 101, 255, 0.56) !important;
  background: linear-gradient(180deg, rgba(65, 30, 115, 0.56), rgba(34, 19, 61, 0.72)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon .s360-svg-icon {
  width: 20px !important;
  height: 20px !important;
  stroke-width: 1.8 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title {
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1.16 !important;
  letter-spacing: -0.01em !important;
  font-weight: 700 !important;
  color: #f3f6ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-desc {
  margin-top: 4px !important;
  font-size: 14px !important;
  line-height: 1.34 !important;
  color: #becbec !important;
  display: block !important;
  white-space: normal !important;
  -webkit-line-clamp: unset !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-meta {
  margin-top: 8px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-meta span {
  min-height: 24px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(79, 97, 137, 0.42) !important;
  background: rgba(20, 30, 52, 0.8) !important;
  color: #9fb3e1 !important;
  font-size: 12px !important;
  font-weight: 580 !important;
  padding: 0 9px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-meta .s360-pill {
  border-color: rgba(96, 114, 155, 0.62) !important;
  background: rgba(25, 35, 59, 0.88) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-right {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  position: relative !important;
  margin-top: 2px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-age {
  font-size: 12px !important;
  font-weight: 560 !important;
  color: #9db1e0 !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-unread-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 999px !important;
  background: #975cff !important;
  box-shadow: 0 0 0 3px rgba(151, 92, 255, 0.22) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-read-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 999px !important;
  background: rgba(117, 133, 168, 0.58) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-more {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(83, 100, 141, 0.45) !important;
  background: linear-gradient(180deg, rgba(24, 34, 58, 0.86), rgba(15, 23, 42, 0.86)) !important;
  color: #d6e0fa !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-more .s360-svg-icon {
  width: 15px !important;
  height: 15px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-menu {
  border-radius: 12px !important;
  border: 1px solid rgba(86, 103, 144, 0.52) !important;
  background: linear-gradient(180deg, rgba(18, 27, 46, 0.98), rgba(11, 18, 35, 0.98)) !important;
  box-shadow: 0 18px 32px rgba(3, 8, 20, 0.54) !important;
  min-width: 220px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-menu .s360-notif-read {
  min-height: 34px !important;
  border-radius: 8px !important;
  color: #d7e2ff !important;
  font-size: 13px !important;
  font-weight: 550 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-menu .s360-notif-read:hover {
  background: rgba(79, 98, 142, 0.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-row {
  margin-top: 8px !important;
  padding: 12px 2px 4px !important;
  border-top: 1px solid rgba(65, 82, 119, 0.38) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-link {
  border: 0 !important;
  background: transparent !important;
  color: #b27dff !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-arrow {
  color: #b27dff !important;
  display: inline-flex !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-arrow .s360-svg-icon {
  width: 16px !important;
  height: 16px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-empty {
  border-radius: 12px !important;
  border: 1px dashed rgba(83, 100, 142, 0.5) !important;
  background: rgba(15, 24, 43, 0.64) !important;
  padding: 18px 16px !important;
  margin: 4px 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-empty strong {
  color: #dde8ff !important;
  font-size: 15px !important;
  font-weight: 650 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-empty p {
  margin: 6px 0 0 !important;
  color: #95abd9 !important;
  font-size: 13px !important;
}

@media (max-width: 980px) {
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern {
    right: -2px !important;
    width: min(96vw, 680px) !important;
    padding: 12px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head h4 {
    font-size: 24px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title {
    font-size: 16px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-desc {
    font-size: 13px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-toolbar {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-wrap {
    width: 100% !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ===== Notification Panel Redesign V4 (clean dark) ===== */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern {
  top: calc(100% + 12px) !important;
  right: -4px !important;
  width: min(640px, calc(100vw - 24px)) !important;
  max-height: min(78vh, 820px) !important;
  padding: 14px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(94, 111, 153, 0.5) !important;
  background:
    radial-gradient(120% 120% at 100% 0%, rgba(151, 92, 255, 0.16), transparent 52%),
    linear-gradient(180deg, rgba(10, 16, 31, 0.98), rgba(7, 12, 24, 0.98)) !important;
  box-shadow: 0 26px 56px rgba(2, 7, 20, 0.62), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head {
  margin: 0 !important;
  padding: 0 0 12px !important;
  border: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-left {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head h4 {
  margin: 0 !important;
  font-size: 28px !important;
  line-height: 1 !important;
  letter-spacing: -0.02em !important;
  font-weight: 700 !important;
  color: #eef3ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head .s360-badge {
  min-width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(160, 118, 255, 0.66) !important;
  background: linear-gradient(180deg, rgba(146, 89, 255, 0.88), rgba(97, 52, 228, 0.88)) !important;
  color: #faf7ff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 0 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-link {
  border: 0 !important;
  background: transparent !important;
  color: #af7aff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 3px 4px !important;
  cursor: pointer !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-link:hover {
  color: #cfadff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-link:disabled {
  color: rgba(148, 163, 201, 0.46) !important;
  cursor: default !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-close {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(86, 104, 146, 0.46) !important;
  background: linear-gradient(180deg, rgba(23, 33, 57, 0.9), rgba(14, 23, 42, 0.9)) !important;
  color: #dce5ff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-close .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-toolbar {
  margin: 0 !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid rgba(67, 84, 122, 0.38) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab {
  min-height: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(82, 99, 140, 0.44) !important;
  background: linear-gradient(180deg, rgba(22, 33, 56, 0.84), rgba(14, 22, 42, 0.84)) !important;
  color: #d9e3ff !important;
  padding: 0 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab span {
  font-size: 13px !important;
  font-weight: 560 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab small {
  min-width: 19px !important;
  height: 19px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(92, 109, 151, 0.5) !important;
  background: rgba(10, 16, 31, 0.62) !important;
  color: #9fb3e7 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 6px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab.is-active {
  border-color: rgba(151, 95, 255, 0.74) !important;
  background: linear-gradient(90deg, rgba(78, 50, 255, 0.95), rgba(171, 66, 222, 0.92)) !important;
  color: #ffffff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab.is-active small {
  border-color: rgba(255, 255, 255, 0.5) !important;
  background: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-wrap {
  position: relative !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn {
  min-height: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(82, 99, 140, 0.44) !important;
  background: linear-gradient(180deg, rgba(22, 33, 56, 0.84), rgba(14, 22, 42, 0.84)) !important;
  color: #d7e2ff !important;
  font-size: 13px !important;
  font-weight: 560 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn small {
  color: #9ab0e1 !important;
  font-size: 11px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn.is-active,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn.is-open {
  border-color: rgba(149, 94, 255, 0.72) !important;
  color: #f1e7ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-menu {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  min-width: 224px !important;
  padding: 8px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(92, 109, 151, 0.52) !important;
  background: linear-gradient(180deg, rgba(18, 27, 46, 0.98), rgba(11, 18, 35, 0.98)) !important;
  box-shadow: 0 18px 34px rgba(4, 9, 21, 0.5) !important;
  display: grid !important;
  gap: 6px !important;
  z-index: 9 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-menu button {
  min-height: 34px !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
  background: rgba(17, 26, 45, 0.92) !important;
  color: #d9e3ff !important;
  text-align: left !important;
  font-size: 13px !important;
  font-weight: 540 !important;
  padding: 0 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-menu button.is-active {
  border-color: rgba(146, 91, 255, 0.66) !important;
  background: rgba(84, 44, 190, 0.34) !important;
  color: #ffffff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack {
  margin-top: 12px !important;
  max-height: min(54vh, 560px) !important;
  display: grid !important;
  gap: 10px !important;
  overflow: auto !important;
  padding-right: 4px !important;
  scrollbar-gutter: stable !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel::-webkit-scrollbar,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack::-webkit-scrollbar {
  width: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel::-webkit-scrollbar-thumb,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  border: 2px solid rgba(11, 17, 31, 0.9) !important;
  background: rgba(103, 122, 165, 0.58) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card {
  margin: 0 !important;
  border: 1px solid rgba(70, 88, 126, 0.44) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(17, 26, 45, 0.84), rgba(12, 20, 38, 0.84)) !important;
  box-shadow: 0 10px 22px rgba(4, 9, 20, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  padding: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card.s360-notif-card-danger {
  border-color: rgba(245, 110, 130, 0.58) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card.s360-notif-card-warn {
  border-color: rgba(244, 175, 73, 0.58) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card.s360-notif-card-ok {
  border-color: rgba(96, 127, 255, 0.48) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card.is-unread {
  box-shadow: 0 12px 26px rgba(19, 31, 59, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card.is-read {
  opacity: 0.78 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(120, 140, 187, 0.62) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: start !important;
  margin: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(85, 102, 144, 0.52) !important;
  background: linear-gradient(180deg, rgba(28, 38, 64, 0.84), rgba(17, 25, 45, 0.84)) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon .s360-svg-icon {
  width: 18px !important;
  height: 18px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title {
  margin: 0 !important;
  font-size: 21px !important;
  line-height: 1.14 !important;
  letter-spacing: -0.01em !important;
  font-weight: 680 !important;
  color: #eef3ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-desc {
  margin-top: 4px !important;
  font-size: 13px !important;
  line-height: 1.34 !important;
  color: #b7c6ea !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-meta {
  margin-top: 7px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-meta span {
  min-height: 22px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(79, 97, 137, 0.44) !important;
  background: rgba(18, 27, 47, 0.8) !important;
  color: #9cb2e2 !important;
  font-size: 11px !important;
  font-weight: 580 !important;
  padding: 0 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-right {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  position: relative !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-age {
  font-size: 11px !important;
  font-weight: 560 !important;
  color: #9eb2e2 !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-unread-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: #975cff !important;
  box-shadow: 0 0 0 3px rgba(151, 92, 255, 0.22) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-read-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: rgba(117, 133, 168, 0.56) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-more {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(83, 100, 141, 0.48) !important;
  background: linear-gradient(180deg, rgba(22, 33, 56, 0.86), rgba(14, 22, 42, 0.86)) !important;
  color: #d6e0fa !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-more .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-menu {
  border-radius: 12px !important;
  border: 1px solid rgba(86, 103, 144, 0.52) !important;
  background: linear-gradient(180deg, rgba(18, 27, 46, 0.98), rgba(11, 18, 35, 0.98)) !important;
  box-shadow: 0 18px 32px rgba(3, 8, 20, 0.54) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-menu .s360-notif-read {
  min-height: 34px !important;
  border-radius: 8px !important;
  color: #d7e2ff !important;
  font-size: 13px !important;
  font-weight: 550 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-menu .s360-notif-read:hover {
  background: rgba(79, 98, 142, 0.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-row {
  margin-top: 8px !important;
  padding: 12px 2px 2px !important;
  border-top: 1px solid rgba(65, 82, 119, 0.36) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-link {
  border: 0 !important;
  background: transparent !important;
  color: #b37dff !important;
  font-size: 15px !important;
  font-weight: 610 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-arrow {
  color: #b37dff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-empty {
  border-radius: 12px !important;
  border: 1px dashed rgba(83, 100, 142, 0.5) !important;
  background: rgba(15, 24, 43, 0.64) !important;
  padding: 18px 16px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-empty strong {
  color: #dde8ff !important;
  font-size: 15px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-empty p {
  margin: 6px 0 0 !important;
  color: #95abd9 !important;
  font-size: 13px !important;
}

@media (max-width: 900px) {
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern {
    right: -2px !important;
    width: min(96vw, 560px) !important;
    padding: 12px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head h4 {
    font-size: 24px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-wrap {
    width: 100% !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ===== Notification Panel Redesign V5 (reference match) ===== */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern {
  width: min(590px, calc(100vw - 22px)) !important;
  right: 0 !important;
  padding: 12px !important;
  border-radius: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head {
  padding: 0 0 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head h4 {
  font-size: 26px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-toolbar {
  padding: 0 0 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn {
  min-height: 33px !important;
  padding: 0 9px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab span {
  font-size: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab small {
  min-width: 18px !important;
  height: 18px !important;
  font-size: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack {
  margin-top: 10px !important;
  gap: 8px !important;
  max-height: min(52vh, 500px) !important;
  padding-right: 4px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card {
  border-radius: 11px !important;
  padding: 10px 10px 9px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head {
  grid-template-columns: 38px minmax(0, 1fr) auto !important;
  gap: 9px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon-whatsapp {
  border-color: rgba(37, 208, 127, 0.58) !important;
  background: linear-gradient(180deg, rgba(11, 94, 56, 0.64), rgba(8, 52, 35, 0.78)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon-user_plus {
  border-color: rgba(167, 101, 255, 0.62) !important;
  background: linear-gradient(180deg, rgba(77, 37, 144, 0.66), rgba(42, 21, 81, 0.78)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon-clipboard {
  border-color: rgba(252, 166, 58, 0.64) !important;
  background: linear-gradient(180deg, rgba(119, 65, 17, 0.68), rgba(64, 35, 10, 0.8)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon-money_bag {
  border-color: rgba(146, 89, 255, 0.62) !important;
  background: linear-gradient(180deg, rgba(74, 33, 136, 0.68), rgba(42, 20, 79, 0.8)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon-envelope {
  border-color: rgba(79, 137, 255, 0.62) !important;
  background: linear-gradient(180deg, rgba(22, 62, 133, 0.68), rgba(13, 34, 75, 0.8)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon-phone_check {
  border-color: rgba(42, 222, 130, 0.62) !important;
  background: linear-gradient(180deg, rgba(12, 99, 63, 0.68), rgba(8, 53, 37, 0.8)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title {
  font-size: 15px !important;
  line-height: 1.22 !important;
  letter-spacing: -0.005em !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-desc {
  margin-top: 3px !important;
  font-size: 12.5px !important;
  line-height: 1.3 !important;
  color: #b9c8ec !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-subdesc {
  margin-top: 2px !important;
  font-size: 12.5px !important;
  line-height: 1.3 !important;
  color: #9bb2e1 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-meta {
  display: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-right {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 6px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-right-top {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  position: relative !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-age {
  font-size: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-more {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-urgency {
  min-height: 20px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(232, 110, 123, 0.62) !important;
  background: rgba(79, 19, 34, 0.68) !important;
  color: #ff8b98 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-urgency.is-warn {
  border-color: rgba(245, 164, 61, 0.62) !important;
  background: rgba(89, 53, 17, 0.68) !important;
  color: #ffb76e !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-row {
  margin-top: 10px !important;
  padding-top: 10px !important;
}

@media (max-width: 900px) {
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern {
    width: min(96vw, 520px) !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-wrap {
    width: 100% !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ===== Notification Panel Redesign V6 (exact horizontal layout) ===== */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern {
  width: min(670px, calc(100vw - 22px)) !important;
  right: 0 !important;
  padding: 12px 12px 10px !important;
  border-radius: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head {
  padding: 0 2px 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-dropdown-head h4 {
  font-size: 32px !important;
  letter-spacing: -0.02em !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-link {
  font-size: 15px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-toolbar {
  padding: 0 0 10px !important;
  border-bottom: 1px solid rgba(67, 84, 122, 0.44) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab {
  min-height: 36px !important;
  padding: 0 12px !important;
  border-radius: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-tab span {
  font-size: 13px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn {
  min-height: 36px !important;
  padding: 0 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-filter-btn .s360-svg-icon {
  width: 15px !important;
  height: 15px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-panel,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-stack {
  margin-top: 8px !important;
  gap: 0 !important;
  max-height: min(54vh, 520px) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 12px 4px !important;
  border-bottom: 1px solid rgba(63, 79, 115, 0.35) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card:last-child {
  border-bottom: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-card:hover {
  background: rgba(69, 91, 138, 0.08) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head {
  grid-template-columns: 42px minmax(0, 1fr) 134px !important;
  gap: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-icon .s360-svg-icon {
  width: 18px !important;
  height: 18px !important;
  stroke-width: 1.85 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title {
  font-size: 16.5px !important;
  line-height: 1.15 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  display: inline-block !important;
  background: rgba(146, 161, 196, 0.55) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title-dot.is-unread {
  background: #8e54ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title-dot.is-success {
  background: #11d67e !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-desc,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-subdesc {
  font-size: 13.5px !important;
  line-height: 1.3 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-subdesc {
  color: #9fb4e3 !important;
  margin-top: 2px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head-right {
  align-items: flex-end !important;
  justify-content: flex-start !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-right-top {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-age {
  font-size: 12.5px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-more,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-read-dot {
  display: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-unread-dot {
  width: 7px !important;
  height: 7px !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-urgency {
  min-height: 22px !important;
  line-height: 20px !important;
  font-size: 12px !important;
  padding: 0 9px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-row {
  margin-top: 8px !important;
  padding: 12px 6px 2px !important;
  justify-content: center !important;
  position: relative !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-link {
  font-size: 16px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-footer-arrow {
  position: absolute !important;
  right: 10px !important;
}

@media (max-width: 980px) {
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern {
    width: min(96vw, 620px) !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-title {
    font-size: 16px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-desc,
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-subdesc,
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-age {
    font-size: 12.5px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-notif-dropdown.s360-notif-dropdown-modern .s360-notif-head {
    grid-template-columns: 40px minmax(0, 1fr) 116px !important;
  }
}

/* ===== Notification Panel Redesign V7 (hard override exact) ===== */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-host > #s360-notif-dropdown.s360-notif-dropdown,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-host > #s360-notif-dropdown.s360-notif-dropdown-modern {
  width: min(670px, calc(100vw - 20px)) !important;
  right: 0 !important;
  top: calc(100% + 10px) !important;
  border-radius: 12px !important;
  border: 1px solid rgba(88, 106, 148, 0.52) !important;
  background:
    radial-gradient(130% 120% at 50% 0%, rgba(37, 109, 255, 0.1), transparent 62%),
    linear-gradient(180deg, rgba(8, 14, 28, 0.99), rgba(7, 12, 24, 0.99)) !important;
  box-shadow: 0 24px 54px rgba(3, 8, 20, 0.64), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  padding: 12px 12px 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-dropdown-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 2px 10px !important;
  margin: 0 !important;
  border: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-dropdown-head h4 {
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  color: #eef3ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 0 10px !important;
  border-bottom: 1px solid rgba(65, 83, 121, 0.44) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tabs {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab {
  min-height: 36px !important;
  padding: 0 12px !important;
  border-radius: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab span {
  font-size: 13px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn {
  min-height: 36px !important;
  padding: 0 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-panel,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-stack {
  margin-top: 8px !important;
  max-height: min(56vh, 520px) !important;
  overflow: auto !important;
  display: grid !important;
  gap: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-card {
  border: 0 !important;
  border-bottom: 1px solid rgba(62, 79, 114, 0.36) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 12px 4px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-card:last-child {
  border-bottom: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) 130px !important;
  gap: 12px !important;
  align-items: start !important;
  margin: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-title {
  font-size: 16px !important;
  font-weight: 680 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-desc,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-subdesc {
  font-size: 13px !important;
  line-height: 1.3 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-right {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-right-top {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-age {
  font-size: 13px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-more,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-read-dot {
  display: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-unread-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-urgency {
  min-height: 22px !important;
  padding: 0 9px !important;
  font-size: 12px !important;
  line-height: 20px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-footer-row {
  padding: 12px 6px 2px !important;
  margin-top: 8px !important;
  position: relative !important;
  justify-content: center !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-footer-link {
  font-size: 16px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-footer-arrow {
  position: absolute !important;
  right: 10px !important;
}

/* Notification Panel Redesign V8 - wider layout + horizontal action tabs */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-host > #s360-notif-dropdown.s360-notif-dropdown,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-host > #s360-notif-dropdown.s360-notif-dropdown-modern {
  width: min(780px, calc(100vw - 120px)) !important;
  max-width: min(780px, calc(100vw - 120px)) !important;
  left: auto !important;
  right: 0 !important;
  padding: 14px 14px 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-dropdown-head {
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 0 2px 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-left {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-dropdown-head h4 {
  font-size: 29px !important;
  line-height: 1 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-dropdown-head .s360-badge {
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 10px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #efe6ff !important;
  border-radius: 999px !important;
  border: 1px solid rgba(169, 104, 255, 0.8) !important;
  background: linear-gradient(180deg, rgba(131, 76, 225, 0.95), rgba(86, 44, 170, 0.94)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-actions {
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-link {
  min-height: 40px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(131, 151, 204, 0.42) !important;
  color: #d9e4ff !important;
  background: linear-gradient(180deg, rgba(24, 34, 58, 0.9), rgba(13, 21, 41, 0.95)) !important;
  font-size: 14px !important;
  font-weight: 620 !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-close {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(131, 151, 204, 0.42) !important;
  background: linear-gradient(180deg, rgba(24, 34, 58, 0.9), rgba(13, 21, 41, 0.95)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid rgba(66, 84, 124, 0.56) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tabs {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  overflow: visible !important;
  padding-bottom: 2px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tabs::-webkit-scrollbar {
  height: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab {
  flex: 0 0 auto !important;
  min-height: 40px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(119, 138, 189, 0.45) !important;
  background: linear-gradient(180deg, rgba(21, 31, 55, 0.94), rgba(12, 19, 38, 0.96)) !important;
  color: #dbe5ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab span {
  font-size: 14px !important;
  font-weight: 620 !important;
  color: inherit !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab small {
  min-width: 24px !important;
  height: 24px !important;
  padding: 0 6px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(136, 155, 203, 0.48) !important;
  background: rgba(14, 21, 40, 0.88) !important;
  color: #c4d3fb !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab.is-active {
  border-color: rgba(153, 93, 255, 0.86) !important;
  background: linear-gradient(180deg, rgba(126, 71, 225, 0.96), rgba(81, 43, 166, 0.95)) !important;
  color: #f6edff !important;
  box-shadow: 0 8px 18px rgba(97, 58, 184, 0.36) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab.is-active small {
  border-color: rgba(213, 191, 255, 0.62) !important;
  background: rgba(75, 40, 150, 0.74) !important;
  color: #f4e8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-wrap {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  position: relative !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn {
  min-height: 40px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(119, 138, 189, 0.45) !important;
  background: linear-gradient(180deg, rgba(21, 31, 55, 0.94), rgba(12, 19, 38, 0.96)) !important;
  color: #dbe5ff !important;
  font-size: 14px !important;
  font-weight: 620 !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn.is-active {
  border-color: rgba(153, 93, 255, 0.78) !important;
  background: linear-gradient(180deg, rgba(101, 59, 190, 0.94), rgba(66, 35, 140, 0.95)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-menu {
  top: calc(100% + 8px) !important;
  right: 0 !important;
  min-width: 260px !important;
  border-radius: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-panel,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-stack {
  margin-top: 10px !important;
  max-height: min(62vh, 620px) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head {
  grid-template-columns: 44px minmax(0, 1fr) 154px !important;
}

@media (max-width: 1080px) {
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-host > #s360-notif-dropdown.s360-notif-dropdown,
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-host > #s360-notif-dropdown.s360-notif-dropdown-modern {
    width: min(95vw, 700px) !important;
    max-width: min(95vw, 700px) !important;
  }
}

@media (max-width: 760px) {
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-dropdown-head {
    flex-wrap: wrap !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-actions {
    margin-left: 0 !important;
    width: 100% !important;
    justify-content: space-between !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-toolbar {
    flex-wrap: wrap !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tabs {
    width: 100% !important;
    flex: 1 0 100% !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-wrap {
    margin-left: 0 !important;
    width: 100% !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* Notification Panel Redesign V9 - button style to match reference */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-link {
  min-height: 42px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(72, 101, 166, 0.55) !important;
  background: linear-gradient(180deg, rgba(11, 20, 40, 0.96), rgba(8, 15, 32, 0.98)) !important;
  color: #e4ecff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 16px rgba(3, 8, 24, 0.34) !important;
  font-size: 16px !important;
  font-weight: 590 !important;
  letter-spacing: -0.01em !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab {
  padding: 0 18px !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab span,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn span,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-link {
  font-size: 14px !important;
  font-weight: 590 !important;
  color: inherit !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab small,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn small {
  min-width: 24px !important;
  height: 24px !important;
  padding: 0 6px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(128, 150, 205, 0.56) !important;
  background: linear-gradient(180deg, rgba(22, 34, 63, 0.96), rgba(15, 24, 46, 0.98)) !important;
  color: #cddafd !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab.is-active {
  border-color: rgba(132, 102, 255, 0.88) !important;
  background: linear-gradient(180deg, rgba(88, 72, 226, 0.98), rgba(58, 45, 165, 0.98)) !important;
  color: #f4edff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.16),
    0 0 0 1px rgba(123, 92, 255, 0.35),
    0 10px 22px rgba(62, 42, 162, 0.52) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab.is-active small {
  border-color: rgba(201, 180, 255, 0.66) !important;
  background: linear-gradient(180deg, rgba(67, 49, 172, 0.92), rgba(53, 40, 138, 0.94)) !important;
  color: #f1e8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn {
  padding: 0 18px !important;
  gap: 9px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
  color: #d8e6ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-link {
  padding: 0 18px !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab:hover,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn:hover,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-link:hover {
  border-color: rgba(124, 149, 208, 0.72) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-tab:disabled,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-filter-btn:disabled,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-link:disabled {
  opacity: 0.58 !important;
  filter: grayscale(0.12) !important;
}

/* Notification Panel Redesign V10 - mark-all as text link + close button style */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-link {
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #9f6fff !important;
  font-size: 14px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-link:hover {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #b88bff !important;
  transform: none !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 2px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-link:disabled {
  color: rgba(159, 111, 255, 0.5) !important;
  text-decoration: none !important;
  opacity: 1 !important;
  filter: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-close {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(72, 101, 166, 0.55) !important;
  background: linear-gradient(180deg, rgba(11, 20, 40, 0.96), rgba(8, 15, 32, 0.98)) !important;
  color: #e4ecff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 16px rgba(3, 8, 24, 0.34) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-close .s360-svg-icon {
  width: 15px !important;
  height: 15px !important;
  color: #dbe6ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-close:hover {
  border-color: rgba(124, 149, 208, 0.72) !important;
  transform: translateY(-1px) !important;
}

/* Notification Panel Redesign V11 - footer link style consistency */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-footer-row {
  margin-top: 8px !important;
  padding: 12px 2px 2px !important;
  border-top: 1px solid rgba(66, 84, 124, 0.45) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-footer-link {
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #9f6fff !important;
  font-size: 14px !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-footer-link:hover {
  color: #b88bff !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 2px !important;
  transform: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-footer-arrow {
  position: static !important;
  color: #9f6fff !important;
  opacity: 0.95 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-footer-arrow .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
}

/* Notification Panel Redesign V12 - notification cards full dark style */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-panel,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-stack {
  background:
    radial-gradient(120% 120% at 50% 0%, rgba(45, 104, 220, 0.16), transparent 58%),
    linear-gradient(180deg, rgba(7, 13, 27, 0.98), rgba(5, 10, 22, 0.98)) !important;
  border: 1px solid rgba(66, 85, 126, 0.42) !important;
  border-radius: 12px !important;
  padding: 2px 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-card,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-card.is-unread,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-card.is-read {
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(61, 79, 117, 0.34) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 14px 14px 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-card:last-child {
  border-bottom: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-card:hover {
  background: linear-gradient(90deg, rgba(38, 57, 95, 0.14), rgba(18, 29, 54, 0.08)) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head {
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) 138px !important;
  gap: 12px !important;
  align-items: start !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon {
  width: 46px !important;
  height: 46px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(77, 100, 148, 0.34) !important;
  background: linear-gradient(180deg, rgba(14, 27, 51, 0.9), rgba(8, 17, 36, 0.94)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 10px 16px rgba(2, 8, 20, 0.35) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon .s360-svg-icon {
  width: 19px !important;
  height: 19px !important;
  stroke-width: 1.9 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon-whatsapp {
  border-color: rgba(26, 192, 117, 0.44) !important;
  background: linear-gradient(180deg, rgba(6, 77, 49, 0.9), rgba(4, 42, 29, 0.94)) !important;
  color: #28db86 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon-user_plus {
  border-color: rgba(138, 104, 255, 0.46) !important;
  background: linear-gradient(180deg, rgba(66, 39, 141, 0.92), rgba(35, 22, 78, 0.95)) !important;
  color: #bf9bff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon-clipboard {
  border-color: rgba(229, 150, 46, 0.5) !important;
  background: linear-gradient(180deg, rgba(106, 63, 18, 0.92), rgba(56, 33, 11, 0.95)) !important;
  color: #ffbe5a !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon-money_bag {
  border-color: rgba(147, 100, 255, 0.48) !important;
  background: linear-gradient(180deg, rgba(71, 40, 150, 0.9), rgba(39, 22, 82, 0.95)) !important;
  color: #bf98ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon-envelope {
  border-color: rgba(69, 133, 255, 0.48) !important;
  background: linear-gradient(180deg, rgba(18, 61, 137, 0.9), rgba(10, 33, 75, 0.95)) !important;
  color: #84b5ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon-phone_check {
  border-color: rgba(26, 198, 126, 0.46) !important;
  background: linear-gradient(180deg, rgba(8, 88, 56, 0.9), rgba(5, 48, 33, 0.95)) !important;
  color: #2bdd8a !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon-settings,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-icon-build {
  border-color: rgba(125, 142, 180, 0.42) !important;
  background: linear-gradient(180deg, rgba(44, 53, 77, 0.9), rgba(27, 33, 52, 0.95)) !important;
  color: #c9d3ea !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-main {
  min-width: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-title {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  color: #ecf3ff !important;
  letter-spacing: -0.01em !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-title-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: #8c59ff !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-desc,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-subdesc {
  margin-top: 3px !important;
  font-size: 13.5px !important;
  line-height: 1.32 !important;
  color: #b8c8e9 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-subdesc {
  color: #8fa7dd !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head-right {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-right-top {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-age {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #9fb3de !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-unread-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 999px !important;
  background: #8d59ff !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-urgency {
  min-height: 24px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(220, 88, 110, 0.56) !important;
  background: rgba(85, 19, 37, 0.68) !important;
  color: #ff8ea1 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-urgency.is-warn {
  border-color: rgba(244, 166, 64, 0.56) !important;
  background: rgba(87, 52, 18, 0.68) !important;
  color: #ffc378 !important;
}

@media (max-width: 900px) {
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-head {
    grid-template-columns: 42px minmax(0, 1fr) 112px !important;
    gap: 10px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-title {
    font-size: 15px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-desc,
  #system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-notif-dropdown .s360-notif-subdesc {
    font-size: 12.5px !important;
  }
}

/* Global Design System V13 - dark premium unified theme */
#system360-app .s360-app.s360-app-system {
  --s360g-bg-0: #050814;
  --s360g-bg-1: #070d1f;
  --s360g-bg-2: #0a1126;
  --s360g-panel: rgba(10, 18, 39, 0.82);
  --s360g-panel-strong: rgba(9, 16, 35, 0.9);
  --s360g-panel-soft: rgba(14, 23, 47, 0.72);
  --s360g-line: rgba(86, 106, 156, 0.44);
  --s360g-line-strong: rgba(112, 136, 194, 0.56);
  --s360g-text: #edf3ff;
  --s360g-text-soft: #9db0d9;
  --s360g-accent-a: #4b4dff;
  --s360g-accent-b: #8a46ff;
  --s360g-accent-c: #ff5b8a;
  --s360g-accent-d: #ff8e45;
  --s360g-success: #1dd17d;
  --s360g-warning: #f3a33f;
  --s360g-danger: #ef4f67;
  --s360-ui-border: rgba(86, 106, 156, 0.44);
  --s360-ui-card-bg: linear-gradient(180deg, rgba(10, 18, 39, 0.86), rgba(8, 15, 33, 0.92));
  --s360-ui-card-hover-bg: linear-gradient(180deg, rgba(14, 24, 49, 0.9), rgba(10, 17, 37, 0.94));
  --s360-ui-text: #edf3ff;
  --s360-ui-muted: #9db0d9;
  --s360-ui-blue: #7f83ff;
  --s360-ink: #edf3ff;
  --s360-ink-soft: #9db0d9;
  --s8-text: #edf3ff;
  --s8-soft: #9db0d9;
  --ink: #edf3ff;
  color: var(--s360g-text) !important;
  background:
    radial-gradient(1100px 760px at -10% -25%, rgba(46, 92, 225, 0.26), transparent 58%),
    radial-gradient(920px 680px at 110% -15%, rgba(124, 68, 236, 0.2), transparent 55%),
    radial-gradient(700px 540px at 50% 120%, rgba(30, 180, 140, 0.09), transparent 58%),
    linear-gradient(180deg, var(--s360g-bg-0), var(--s360g-bg-1) 46%, var(--s360g-bg-2)) !important;
}

#system360-app .s360-app.s360-app-system,
#system360-app .s360-app.s360-app-system .s360-main,
#system360-app .s360-app.s360-app-system .s360-content-scroll,
#system360-app .s360-app.s360-app-system .s360-panel,
#system360-app .s360-app.s360-app-system .s360-card,
#system360-app .s360-app.s360-app-system .s360-box,
#system360-app .s360-app.s360-app-system .s360-sidebar,
#system360-app .s360-app.s360-app-system .s360-topbar {
  color: #edf3ff !important;
}

#system360-app .s360-app.s360-app-system :is(
  p, span, label, small, strong, em, li, a,
  h1, h2, h3, h4, h5, h6,
  td, th, div[class*="title"], div[class*="label"], div[class*="name"]
) {
  color: inherit !important;
}

#system360-app .s360-app.s360-app-system .s360-muted,
#system360-app .s360-app.s360-app-system [class*="muted"] {
  color: #9db0d9 !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-input, .s360-select, .s360-textarea,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
  select, textarea
) {
  color: #ecf3ff !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table td, .s360-table th, table td, table th) {
  color: #dbe7ff !important;
}

/* Force readable KPI typography in dark mode */
#system360-app .s360-app.s360-app-system .s360-card .k,
#system360-app .s360-app.s360-app-system .s360-kpi-label,
#system360-app .s360-app.s360-app-system .s360-kpi-smart-label,
#system360-app .s360-app.s360-app-system .s360-kpi-rank-card .k {
  color: #c8d8ff !important;
  -webkit-text-fill-color: #c8d8ff !important;
  opacity: 1 !important;
}

#system360-app .s360-app.s360-app-system .s360-card .v,
#system360-app .s360-app.s360-app-system .s360-kpi-value,
#system360-app .s360-app.s360-app-system .s360-kpi-smart-value,
#system360-app .s360-app.s360-app-system .s360-kpi-rank-card .v {
  color: #f4f8ff !important;
  -webkit-text-fill-color: #f4f8ff !important;
  opacity: 1 !important;
  text-shadow: 0 0 1px rgba(133, 162, 230, 0.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-kpi-smart-hint,
#system360-app .s360-app.s360-app-system .s360-kpi-live-item strong,
#system360-app .s360-app.s360-app-system .s360-chart-row span,
#system360-app .s360-app.s360-app-system .s360-progress-label {
  color: #9db0d9 !important;
  -webkit-text-fill-color: #9db0d9 !important;
  opacity: 1 !important;
}

#system360-app .s360-app.s360-app-system .s360-shell {
  border-radius: 20px !important;
  border: 1px solid var(--s360g-line) !important;
  background: linear-gradient(180deg, rgba(8, 14, 31, 0.88), rgba(6, 12, 28, 0.86)) !important;
  box-shadow:
    0 28px 55px rgba(1, 6, 19, 0.68),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar,
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos {
  border-radius: 14px !important;
  border: 1px solid var(--s360g-line) !important;
  background:
    radial-gradient(95% 120% at 50% -40%, rgba(72, 117, 255, 0.24), transparent 60%),
    linear-gradient(180deg, rgba(11, 20, 42, 0.94), rgba(8, 15, 33, 0.95)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 10px 22px rgba(2, 8, 22, 0.44) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar :is(h1, h2, h3, h4, h5, h6, span, small, strong, p),
#system360-app .s360-app.s360-app-system .s360-main :is(h1, h2, h3, h4, h5, h6, strong) {
  color: var(--s360g-text) !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar .s360-muted,
#system360-app .s360-app.s360-app-system .s360-main .s360-muted {
  color: var(--s360g-text-soft) !important;
}

#system360-app .s360-app.s360-app-system .s360-sidebar {
  border-radius: 16px !important;
  border: 1px solid var(--s360g-line) !important;
  background:
    radial-gradient(120% 120% at 20% -25%, rgba(85, 95, 245, 0.24), transparent 55%),
    linear-gradient(180deg, rgba(9, 16, 36, 0.95), rgba(7, 13, 28, 0.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 20px 34px rgba(2, 8, 22, 0.52) !important;
}

#system360-app .s360-app.s360-app-system .s360-sidebar-head,
#system360-app .s360-app.s360-app-system .s360-sidebar-foot {
  border-color: rgba(86, 105, 154, 0.38) !important;
}

#system360-app .s360-app.s360-app-system .s360-nav-item {
  border-radius: 12px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #dce7ff !important;
}

#system360-app .s360-app.s360-app-system .s360-nav-item .s360-nav-icon {
  color: #afc3ee !important;
}

#system360-app .s360-app.s360-app-system .s360-nav-item:hover {
  border-color: rgba(97, 122, 187, 0.56) !important;
  background: linear-gradient(90deg, rgba(67, 89, 152, 0.24), rgba(34, 48, 89, 0.15)) !important;
}

#system360-app .s360-app.s360-app-system .s360-nav-item.active {
  border-color: rgba(134, 106, 255, 0.74) !important;
  background: linear-gradient(90deg, rgba(98, 69, 228, 0.46), rgba(62, 48, 144, 0.34)) !important;
  color: #f3eeff !important;
  box-shadow: 0 8px 18px rgba(54, 38, 130, 0.4) !important;
}

#system360-app .s360-app.s360-app-system .s360-main .s360-panel,
#system360-app .s360-app.s360-app-system .s360-main .s360-card,
#system360-app .s360-app.s360-app-system .s360-main .s360-box,
#system360-app .s360-app.s360-app-system .s360-main .s360-seguimientos-wrap {
  border-radius: 14px !important;
  border: 1px solid var(--s360g-line) !important;
  background:
    radial-gradient(120% 140% at 50% -50%, rgba(54, 97, 214, 0.14), transparent 60%),
    linear-gradient(180deg, var(--s360g-panel), var(--s360g-panel-strong)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 16px 28px rgba(2, 7, 19, 0.46) !important;
}

#system360-app .s360-app.s360-app-system .s360-main .s360-panel:hover,
#system360-app .s360-app.s360-app-system .s360-main .s360-card:hover {
  border-color: var(--s360g-line-strong) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-btn, .s360-drop-btn, .s360-chat-btn) {
  border-radius: 11px !important;
  border: 1px solid rgba(95, 118, 173, 0.56) !important;
  color: #eaf1ff !important;
  background: linear-gradient(180deg, rgba(14, 23, 46, 0.94), rgba(9, 16, 35, 0.97)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 16px rgba(2, 8, 20, 0.36) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-btn:hover, .s360-drop-btn:hover, .s360-chat-btn:hover) {
  border-color: rgba(130, 154, 214, 0.7) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-btn.ok, .s360-btn.primary, .s360-btn.is-primary, .s360-quality-approve) {
  border-color: rgba(151, 108, 255, 0.75) !important;
  color: #f4edff !important;
  background: linear-gradient(135deg, var(--s360g-accent-a) 0%, var(--s360g-accent-b) 55%, var(--s360g-accent-c) 100%) !important;
  box-shadow: 0 10px 22px rgba(74, 56, 178, 0.46), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-btn.sec, .s360-btn.ghost, .s360-btn.is-ghost) {
  background: linear-gradient(180deg, rgba(12, 20, 40, 0.9), rgba(8, 14, 30, 0.95)) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-btn.warn) {
  border-color: rgba(240, 163, 61, 0.68) !important;
  color: #ffd394 !important;
  background: linear-gradient(135deg, rgba(89, 56, 20, 0.9), rgba(54, 34, 13, 0.95)) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-btn.danger, .s360-quality-reject) {
  border-color: rgba(238, 86, 108, 0.74) !important;
  color: #ffb5c1 !important;
  background: linear-gradient(135deg, rgba(96, 24, 38, 0.9), rgba(61, 15, 27, 0.96)) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-icon-btn, .s360-top-action-btn) {
  border-radius: 10px !important;
  border: 1px solid rgba(85, 108, 162, 0.54) !important;
  background: linear-gradient(180deg, rgba(13, 21, 42, 0.94), rgba(8, 15, 32, 0.98)) !important;
  color: #d9e6ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 16px rgba(2, 8, 20, 0.32) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea) {
  border: 1px solid rgba(88, 112, 170, 0.58) !important;
  border-radius: 11px !important;
  background: linear-gradient(180deg, rgba(11, 19, 38, 0.92), rgba(8, 14, 31, 0.95)) !important;
  color: #e9f1ff !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.04) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea)::placeholder {
  color: #8ea3ce !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea):focus {
  border-color: rgba(130, 104, 255, 0.82) !important;
  box-shadow: 0 0 0 3px rgba(102, 76, 216, 0.24), inset 0 1px 1px rgba(255, 255, 255, 0.06) !important;
}

#system360-app .s360-app.s360-app-system .s360-follow-panel select.s360-follow-select option {
  background: #ffffff !important;
  color: #102a42 !important;
}

#system360-app .s360-app.s360-app-system .s360-follow-panel select.s360-follow-select option:checked {
  background: #2563d8 !important;
  color: #ffffff !important;
}

#system360-app .s360-app.s360-app-system .s360-follow-panel select.s360-follow-select option:disabled {
  color: #7a8aa0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, table) {
  border: 1px solid rgba(80, 103, 153, 0.52) !important;
  border-radius: 12px !important;
  background: rgba(8, 14, 31, 0.72) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table th, .s360-table-follow th, .s360-table-sales th, table th) {
  border-bottom: 1px solid rgba(88, 111, 162, 0.54) !important;
  background: linear-gradient(180deg, rgba(14, 23, 46, 0.94), rgba(10, 17, 36, 0.96)) !important;
  color: #c9d8f8 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table td, .s360-table-follow td, .s360-table-sales td, table td) {
  border-bottom: 1px solid rgba(68, 88, 131, 0.42) !important;
  color: #d7e3ff !important;
  background: transparent !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-badge, .s360-chip, .s360-pill, .s360-task-chip, .s360-task-area-chip, .s360-call-top-pill, .s360-icon-badge) {
  border-radius: 999px !important;
  border: 1px solid rgba(96, 118, 173, 0.56) !important;
  background: linear-gradient(180deg, rgba(17, 27, 52, 0.9), rgba(10, 17, 36, 0.94)) !important;
  color: #dce8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-pill.ok {
  border-color: rgba(38, 208, 128, 0.64) !important;
  background: rgba(7, 82, 51, 0.64) !important;
  color: #9ff2cb !important;
}

#system360-app .s360-app.s360-app-system .s360-pill.warn {
  border-color: rgba(241, 165, 62, 0.66) !important;
  background: rgba(92, 58, 21, 0.66) !important;
  color: #ffd69d !important;
}

#system360-app .s360-app.s360-app-system .s360-pill.danger {
  border-color: rgba(239, 83, 106, 0.68) !important;
  background: rgba(90, 23, 37, 0.66) !important;
  color: #ffb7c3 !important;
}

@media (max-width: 1024px) {
  #system360-app .s360-app.s360-app-system .s360-shell {
    border-radius: 16px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-sidebar,
  #system360-app .s360-app.s360-app-system .s360-topbar,
  #system360-app .s360-app.s360-app-system .s360-main .s360-panel,
  #system360-app .s360-app.s360-app-system .s360-main .s360-card {
    border-radius: 12px !important;
  }
}

/* Global Design System V13.2 - readability hotfix (home + productividad) */
#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-prod-check-item,
#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-prod-reco-item,
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar .s360-profile-meta > div,
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar .s360-diagnosis-kpis > div {
  border: 1px solid rgba(88, 112, 170, 0.58) !important;
  background: linear-gradient(180deg, rgba(12, 20, 41, 0.92), rgba(8, 14, 31, 0.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 10px 18px rgba(1, 8, 20, 0.34) !important;
}

#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-prod-check-item.is-done {
  border-color: rgba(41, 201, 133, 0.56) !important;
  background: linear-gradient(180deg, rgba(9, 44, 34, 0.86), rgba(7, 26, 24, 0.94)) !important;
}

#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-prod-check-head strong,
#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-prod-reco-item > div:first-child strong,
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar .s360-profile-meta > div strong,
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar .s360-diagnosis-kpis > div strong {
  color: #eef4ff !important;
  -webkit-text-fill-color: #eef4ff !important;
  opacity: 1 !important;
}

#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-prod-check-head span,
#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-prod-check-foot small,
#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-prod-reco-item > div:first-child span,
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar .s360-profile-meta > div span,
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar .s360-diagnosis-kpis > div span {
  color: #9db0d9 !important;
  -webkit-text-fill-color: #9db0d9 !important;
  opacity: 1 !important;
}

#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-chart-row b {
  color: #e9f1ff !important;
}

#system360-app .s360-app.s360-app-system .s360-sec-productividad .s360-chart-track {
  background: rgba(44, 61, 99, 0.7) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card.s360-home-calendar-card {
  border: 1px solid rgba(89, 113, 171, 0.56) !important;
  background: linear-gradient(180deg, rgba(12, 20, 41, 0.92), rgba(8, 14, 31, 0.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 14px 28px rgba(1, 8, 20, 0.42) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline h3,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-month {
  color: #eef4ff !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-weekdays > span {
  color: #a6b8de !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-nav .s360-home-cal-nav-btn {
  border: 1px solid rgba(90, 114, 172, 0.62) !important;
  background: linear-gradient(180deg, rgba(16, 26, 52, 0.95), rgba(11, 18, 38, 0.98)) !important;
  color: #d8e6ff !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day {
  border: 1px solid rgba(85, 108, 162, 0.56) !important;
  background: linear-gradient(180deg, rgba(16, 26, 52, 0.9), rgba(11, 18, 38, 0.95)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 8px 14px rgba(1, 8, 20, 0.28) !important;
  color: #d7e4ff !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day:hover:not(.is-empty) {
  border-color: rgba(121, 145, 209, 0.78) !important;
  background: linear-gradient(180deg, rgba(21, 34, 65, 0.95), rgba(13, 22, 45, 0.98)) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-selected {
  border-color: rgba(140, 111, 255, 0.84) !important;
  background: linear-gradient(135deg, rgba(76, 71, 214, 0.42), rgba(135, 72, 223, 0.32), rgba(20, 34, 64, 0.96)) !important;
  box-shadow: inset 0 0 0 1px rgba(171, 149, 255, 0.24), 0 10px 17px rgba(1, 8, 20, 0.34) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-num {
  color: #eaf1ff !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-today .s360-home-cal-num {
  color: #9cb2ff !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-meta > small.agenda {
  color: #cddcff !important;
  background: rgba(59, 88, 165, 0.5) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-meta > small.worked {
  color: #b5f8d8 !important;
  background: rgba(14, 105, 69, 0.52) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected-metrics > div,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-agenda-item {
  border: 1px solid rgba(88, 112, 170, 0.56) !important;
  background: linear-gradient(180deg, rgba(11, 19, 38, 0.9), rgba(7, 13, 30, 0.95)) !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected-head strong,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected-metrics > div > strong,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-agenda-item > strong {
  color: #edf3ff !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected-head span,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected-metrics > div > span,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-agenda-item > span,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected .s360-muted {
  color: #9db0d9 !important;
}

/* Global Design System V13.3 - contrast sweep (funnel + resultados + analytics cards) */
#system360-app .s360-app.s360-app-system :is(
  .s360-kpi-funnel-step,
  .s360-kpi-live-item,
  .s360-kpi-smart-card,
  .s360-shortcut,
  .s360-up-item
) {
  border: 1px solid rgba(88, 112, 170, 0.56) !important;
  background: linear-gradient(180deg, rgba(12, 20, 41, 0.92), rgba(8, 14, 31, 0.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 10px 18px rgba(1, 8, 20, 0.34) !important;
}

#system360-app .s360-app.s360-app-system .s360-kpi-smart-card {
  border-left-color: rgba(141, 161, 208, 0.8) !important;
}

#system360-app .s360-app.s360-app-system .s360-kpi-smart-card.is-ok {
  border-left-color: #1dd17d !important;
  background: linear-gradient(180deg, rgba(8, 52, 37, 0.88), rgba(7, 26, 24, 0.94)) !important;
}

#system360-app .s360-app.s360-app-system .s360-kpi-smart-card.is-warn {
  border-left-color: #f3a33f !important;
  background: linear-gradient(180deg, rgba(73, 49, 17, 0.9), rgba(37, 26, 12, 0.95)) !important;
}

#system360-app .s360-app.s360-app-system .s360-kpi-smart-card.is-danger {
  border-left-color: #ef4f67 !important;
  background: linear-gradient(180deg, rgba(79, 22, 34, 0.9), rgba(45, 14, 25, 0.96)) !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-kpi-funnel-head strong,
  .s360-kpi-funnel-step > b,
  .s360-kpi-smart-value,
  .s360-kpi-live-item b,
  .s360-shortcut strong,
  .s360-up-item strong,
  .s360-progress-value,
  .s360-chart-row b
) {
  color: #edf3ff !important;
  -webkit-text-fill-color: #edf3ff !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-kpi-funnel-head span,
  .s360-kpi-smart-label,
  .s360-kpi-smart-hint,
  .s360-kpi-live-item strong,
  .s360-shortcut span,
  .s360-up-item span,
  .s360-progress-label,
  .s360-chart-row span
) {
  color: #9db0d9 !important;
  -webkit-text-fill-color: #9db0d9 !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-chart-track,
  .s360-progress-track,
  .s360-kpi-dual-track
) {
  background: rgba(44, 61, 99, 0.72) !important;
}

#system360-app .s360-app.s360-app-system .s360-kpi-dual-fill.is-leads {
  background: linear-gradient(90deg, rgba(113, 150, 255, 0.72), rgba(87, 128, 255, 0.9)) !important;
}

#system360-app .s360-app.s360-app-system .s360-kpi-dual-fill.is-sales {
  background: linear-gradient(90deg, rgba(32, 211, 139, 0.78), rgba(24, 172, 117, 0.92)) !important;
}

/* Global Design System V13.4 - database surfaces */
#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) :is(.s360-db-toolbar, .s360-atcdb-table-wrap > .s360-agenda-actions) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(188px, 1fr)) !important;
  gap: 12px !important;
  align-items: end !important;
  margin-bottom: 12px !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-db-toolbar, .s360-atcdb-table-wrap > .s360-agenda-actions) > label {
  width: 100% !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-db-toolbar, .s360-atcdb-table-wrap > .s360-agenda-actions) > label > .s360-muted {
  font-size: 11px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #9db0d9 !important;
  margin-bottom: 6px !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-db-toolbar, .s360-atcdb-table-wrap > .s360-agenda-actions) :is(.s360-input, .s360-select) {
  min-height: 46px !important;
  height: 46px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(90, 114, 170, 0.62) !important;
  background: linear-gradient(180deg, rgba(12, 20, 40, 0.95), rgba(8, 14, 30, 0.98)) !important;
  color: #eaf2ff !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-db-toolbar, .s360-atcdb-table-wrap > .s360-agenda-actions) :is(.s360-btn.sec, .s360-btn.ghost) {
  min-height: 46px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(93, 117, 175, 0.66) !important;
  background: linear-gradient(180deg, rgba(15, 25, 50, 0.96), rgba(10, 17, 37, 0.98)) !important;
  color: #d9e8ff !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap {
  border-radius: 16px !important;
  border: 1px solid rgba(84, 106, 160, 0.54) !important;
  background:
    radial-gradient(130% 140% at 50% -50%, rgba(66, 106, 212, 0.15), transparent 60%),
    linear-gradient(180deg, rgba(9, 15, 33, 0.95), rgba(7, 12, 28, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 14px 28px rgba(1, 7, 19, 0.44) !important;
  overflow: auto !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(106, 132, 192, 0.85) rgba(20, 30, 58, 0.52) !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap::-webkit-scrollbar {
  width: 10px !important;
  height: 10px !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap::-webkit-scrollbar-track {
  background: rgba(16, 26, 50, 0.56) !important;
  border-radius: 999px !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(114, 142, 206, 0.95), rgba(88, 118, 185, 0.92)) !important;
  border-radius: 999px !important;
  border: 1px solid rgba(20, 30, 58, 0.9) !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  min-width: max-content !important;
  width: 100% !important;
  background: transparent !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 3 !important;
  border-bottom: 1px solid rgba(84, 106, 160, 0.56) !important;
  background: linear-gradient(180deg, rgba(14, 23, 46, 0.97), rgba(10, 17, 36, 0.98)) !important;
  color: #d6e4ff !important;
  font-size: 12px !important;
  font-weight: 620 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  padding: 14px 14px !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) thead th:first-child {
  border-top-left-radius: 14px !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) thead th:last-child {
  border-top-right-radius: 14px !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) tbody td {
  border-bottom: 1px solid rgba(63, 83, 126, 0.44) !important;
  color: #e8f0ff !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  padding: 13px 14px !important;
  background: rgba(8, 14, 31, 0.62) !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) tbody tr:hover td {
  background: rgba(22, 33, 66, 0.88) !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-atc-indexed-table tbody td:first-child) {
  text-align: center !important;
  font-weight: 700 !important;
  color: #9fb7e8 !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) .s360-muted {
  color: #98acd4 !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-atc-action-row, td .s360-flex) {
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-atc-icon-btn, td .s360-btn.small, td .s360-btn.sec.small, td .s360-btn.danger.small) {
  min-height: 34px !important;
  min-width: 34px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(91, 115, 173, 0.62) !important;
  background: linear-gradient(180deg, rgba(16, 26, 52, 0.96), rgba(10, 17, 37, 0.98)) !important;
  color: #dce9ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 14px rgba(2, 8, 20, 0.34) !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-atc-icon-btn:hover, td .s360-btn.small:hover, td .s360-btn.sec.small:hover, td .s360-btn.danger.small:hover) {
  border-color: rgba(125, 149, 210, 0.78) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) .s360-atcdb-pager {
  margin-top: 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) .s360-atcdb-pager-center {
  border-radius: 12px !important;
  border: 1px solid rgba(84, 108, 164, 0.6) !important;
  background: linear-gradient(180deg, rgba(13, 22, 44, 0.95), rgba(9, 16, 35, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  padding: 6px 10px !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) .s360-atcdb-page-pill {
  border: 1px solid rgba(102, 126, 185, 0.66) !important;
  background: linear-gradient(180deg, rgba(21, 34, 65, 0.95), rgba(13, 22, 45, 0.98)) !important;
  color: #dce9ff !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) .s360-atcdb-page-meta {
  color: #9db0d9 !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) .s360-atcdb-pager-btn {
  border-radius: 10px !important;
  border: 1px solid rgba(90, 114, 172, 0.66) !important;
  background: linear-gradient(180deg, rgba(16, 26, 52, 0.96), rgba(10, 17, 37, 0.98)) !important;
  color: #d8e6ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 16px rgba(2, 8, 20, 0.32) !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(table td input[type="checkbox"], table th input[type="checkbox"]) {
  width: 18px !important;
  height: 18px !important;
  border-radius: 5px !important;
  border: 1px solid rgba(103, 126, 184, 0.72) !important;
  background: rgba(8, 14, 31, 0.9) !important;
  accent-color: #6f6dff !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) .s360-pill {
  min-height: 28px !important;
  padding: 5px 10px !important;
  font-size: 12px !important;
  font-weight: 640 !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) .s360-chart-track {
  height: 9px !important;
  border-radius: 999px !important;
  background: rgba(44, 61, 99, 0.7) !important;
}

#system360-app .s360-app.s360-app-system .s360-bases-panel > h3,
#system360-app .s360-app.s360-app-system .s360-atcdb-shell > .s360-agenda-toolbar h3 {
  font-size: 26px !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
  color: #edf3ff !important;
}

#system360-app .s360-app.s360-app-system .s360-bases-panel > p.s360-muted {
  margin-top: 6px !important;
  margin-bottom: 14px !important;
  color: #97acd6 !important;
  font-size: 14px !important;
}

/* Final Form360 policy control override: keep step 2 controls dark. */
#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control > :is(.s360-select, .s360-input, select, input) {
  min-height: 42px !important;
  height: 42px !important;
  width: 100% !important;
  border: 1px solid rgba(56, 82, 132, 0.78) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(8, 18, 36, 0.96), rgba(5, 13, 28, 0.96)) !important;
  background-color: #071225 !important;
  background-image: linear-gradient(180deg, rgba(8, 18, 36, 0.96), rgba(5, 13, 28, 0.96)) !important;
  color: #edf5ff !important;
  -webkit-text-fill-color: #edf5ff !important;
  box-shadow: inset 0 1px 0 rgba(128, 157, 214, 0.08) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  padding: 0 38px 0 44px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  outline: 0 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control > select.s360-select {
  cursor: pointer !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 1.8px solid #a7badc;
  border-bottom: 1.8px solid #a7badc;
  transform: translateY(-65%) rotate(45deg);
  pointer-events: none;
  opacity: 0.92;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control:has(input[readonly])::after {
  display: none !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-field .s360-form360-policy-control.is-readonly::after {
  display: none !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-policy-control i {
  background: transparent !important;
}

#system360-app #s360-wz-policy-service,
#system360-app #s360-wz-policy-modality,
#system360-app #s360-wz-policy-price,
#s360-modal.s360-modal-form360 #s360-wz-policy-service,
#s360-modal.s360-modal-form360 #s360-wz-policy-modality,
#s360-modal.s360-modal-form360 #s360-wz-policy-price {
  min-height: 42px !important;
  height: 42px !important;
  border: 1px solid rgba(56, 82, 132, 0.78) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #081224 0%, #050d1c 100%) !important;
  background-color: #071225 !important;
  background-image: linear-gradient(180deg, #081224 0%, #050d1c 100%) !important;
  color: #edf5ff !important;
  -webkit-text-fill-color: #edf5ff !important;
  box-shadow: inset 0 1px 0 rgba(128, 157, 214, 0.08) !important;
  opacity: 1 !important;
}

/* Final Form360 wizard footer override across all steps. */
#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer,
#s360-modal.s360-modal-form360 .s360-form360-step-footer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 18px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer-left,
#s360-modal.s360-modal-form360 .s360-form360-step-footer-left {
  min-width: 0 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer-right,
#s360-modal.s360-modal-form360 .s360-form360-step-footer-right {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn,
#s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn {
  min-height: 42px !important;
  height: 42px !important;
  border-radius: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 760 !important;
  line-height: 1 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.ghost,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.sec,
#s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.ghost,
#s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.sec {
  border: 1px solid rgba(58, 86, 137, 0.78) !important;
  background: linear-gradient(180deg, rgba(9, 21, 42, 0.94), rgba(6, 15, 31, 0.9)) !important;
  color: #cbd9f0 !important;
  box-shadow: none !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.ghost:hover,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.sec:hover,
#s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.ghost:hover,
#s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.sec:hover {
  border-color: rgba(112, 139, 198, 0.82) !important;
  background: linear-gradient(180deg, rgba(13, 29, 56, 0.98), rgba(8, 18, 37, 0.94)) !important;
  color: #eef5ff !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer [data-wz-jump],
#s360-modal.s360-modal-form360 .s360-form360-step-footer [data-wz-jump] {
  min-width: 128px !important;
  justify-content: flex-start !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer [data-modal-cancel],
#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer #s360-wz-step2-cancel,
#s360-modal.s360-modal-form360 .s360-form360-step-footer [data-modal-cancel],
#s360-modal.s360-modal-form360 .s360-form360-step-footer #s360-wz-step2-cancel {
  min-width: 82px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.ok.sale,
#s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.ok.sale {
  min-width: 246px !important;
  border: 1px solid rgba(255, 106, 132, 0.18) !important;
  background: linear-gradient(100deg, #5a35f4 0%, #7c2df1 42%, #c335bc 72%, #ee4555 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 28px rgba(94, 58, 237, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
  padding: 0 18px !important;
  white-space: nowrap !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.ok.sale:hover,
#s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-btn.ok.sale:hover {
  filter: brightness(1.07) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-form360-back-icon,
#s360-modal.s360-modal-form360 .s360-form360-step-footer .s360-form360-back-icon {
  display: inline-flex !important;
  transform: rotate(180deg) !important;
}

/* Final Form360 step 1 tab navigation buttons. */
#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions,
#s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 18px 0 2px !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn,
#s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn {
  min-height: 42px !important;
  height: 42px !important;
  border-radius: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 760 !important;
  line-height: 1 !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn.is-back,
#s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn.is-back {
  min-width: 136px !important;
  justify-content: flex-start !important;
  border: 1px solid rgba(58, 86, 137, 0.78) !important;
  background: linear-gradient(180deg, rgba(9, 21, 42, 0.94), rgba(6, 15, 31, 0.9)) !important;
  color: #cbd9f0 !important;
  box-shadow: none !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn.is-back:hover,
#s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn.is-back:hover {
  border-color: rgba(112, 139, 198, 0.82) !important;
  background: linear-gradient(180deg, rgba(13, 29, 56, 0.98), rgba(8, 18, 37, 0.94)) !important;
  color: #eef5ff !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn.is-next,
#s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn.is-next {
  min-width: 230px !important;
  margin-left: auto !important;
  border: 1px solid rgba(255, 106, 132, 0.18) !important;
  background: linear-gradient(100deg, #5a35f4 0%, #7c2df1 42%, #c335bc 72%, #ee4555 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 28px rgba(94, 58, 237, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
  white-space: nowrap !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn.is-next:hover,
#s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-btn.is-next:hover {
  filter: brightness(1.07) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-form360-back-icon,
#s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-tab-actions .s360-form360-back-icon {
  display: inline-flex !important;
  transform: rotate(180deg) !important;
}

/* Hard stop for old green primary buttons inside Form360. */
#system360-app #s360-modal.s360-modal-form360 :is(.s360-btn.ok, .s360-btn.ok.sale, .s360-btn.is-next),
#system360-app .s360-modal.s360-modal-form360 :is(.s360-btn.ok, .s360-btn.ok.sale, .s360-btn.is-next),
#s360-modal.s360-modal-form360 :is(.s360-btn.ok, .s360-btn.ok.sale, .s360-btn.is-next),
#system360-app #s360-modal #s360-policy-modal-save {
  border: 1px solid rgba(255, 106, 132, 0.18) !important;
  background: linear-gradient(100deg, #5a35f4 0%, #7c2df1 42%, #c335bc 72%, #ee4555 100%) !important;
  background-color: #7c2df1 !important;
  background-image: linear-gradient(100deg, #5a35f4 0%, #7c2df1 42%, #c335bc 72%, #ee4555 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 14px 28px rgba(94, 58, 237, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

#system360-app #s360-modal.s360-modal-form360 :is(.s360-btn.ok, .s360-btn.ok.sale, .s360-btn.is-next):hover,
#system360-app .s360-modal.s360-modal-form360 :is(.s360-btn.ok, .s360-btn.ok.sale, .s360-btn.is-next):hover,
#s360-modal.s360-modal-form360 :is(.s360-btn.ok, .s360-btn.ok.sale, .s360-btn.is-next):hover,
#system360-app #s360-modal #s360-policy-modal-save:hover {
  filter: brightness(1.07) !important;
  transform: translateY(-1px) !important;
}

/* Final Form360 medical questionnaire containment. */
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"],
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"],
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-medical,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-medical,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-medical {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px 14px !important;
  align-items: start !important;
  min-width: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  overflow: hidden !important;
  padding: 12px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(64, 95, 147, 0.52) !important;
  background: linear-gradient(180deg, rgba(10, 21, 43, 0.9), rgba(8, 18, 37, 0.86)) !important;
  box-shadow: inset 0 1px 0 rgba(123, 154, 210, 0.1) !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-q,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-q,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-q {
  min-width: 0 !important;
  max-width: 100% !important;
  color: #d7e6ff !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-group,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-group,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-group {
  width: 74px !important;
  min-width: 74px !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  justify-self: end !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-option,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-option,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-option {
  width: 100% !important;
  min-height: 40px !important;
  justify-content: center !important;
  padding: 8px 10px !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs),
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs),
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs) {
  grid-column: 1 / -1 !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-items,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-items,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-items {
  grid-column: 1 / -1 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-item-row,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-item-row,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-item-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 8px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-add], [data-med-fam-item-add]),
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-add], [data-med-fam-item-add]),
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-add], [data-med-fam-item-add]) {
  min-height: 38px !important;
  height: 38px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(58, 86, 137, 0.78) !important;
  background: linear-gradient(180deg, rgba(9, 21, 42, 0.94), rgba(6, 15, 31, 0.9)) !important;
  background-color: #071225 !important;
  background-image: linear-gradient(180deg, rgba(9, 21, 42, 0.94), rgba(6, 15, 31, 0.9)) !important;
  color: #cbd9f0 !important;
  -webkit-text-fill-color: #cbd9f0 !important;
  box-shadow: none !important;
  padding: 0 14px !important;
  font-size: 12px !important;
  font-weight: 760 !important;
  line-height: 1 !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-add], [data-med-fam-item-add]):hover,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-add], [data-med-fam-item-add]):hover,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-add], [data-med-fam-item-add]):hover {
  border-color: rgba(112, 139, 198, 0.82) !important;
  background: linear-gradient(180deg, rgba(13, 29, 56, 0.98), rgba(8, 18, 37, 0.94)) !important;
  background-color: #0b1b36 !important;
  background-image: linear-gradient(180deg, rgba(13, 29, 56, 0.98), rgba(8, 18, 37, 0.94)) !important;
  color: #eef5ff !important;
  -webkit-text-fill-color: #eef5ff !important;
  transform: translateY(-1px) !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-del], [data-med-fam-item-del]),
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-del], [data-med-fam-item-del]),
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-del], [data-med-fam-item-del]) {
  min-height: 38px !important;
  height: 38px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(238, 86, 108, 0.62) !important;
  background: linear-gradient(180deg, rgba(79, 24, 39, 0.72), rgba(38, 14, 26, 0.82)) !important;
  background-color: #35101e !important;
  background-image: linear-gradient(180deg, rgba(79, 24, 39, 0.72), rgba(38, 14, 26, 0.82)) !important;
  color: #ffc1cb !important;
  -webkit-text-fill-color: #ffc1cb !important;
  box-shadow: none !important;
  padding: 0 14px !important;
  font-size: 12px !important;
  font-weight: 760 !important;
  line-height: 1 !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-del], [data-med-fam-item-del]):hover,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-del], [data-med-fam-item-del]):hover,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is([data-med-item-del], [data-med-fam-item-del]):hover {
  border-color: rgba(255, 116, 138, 0.82) !important;
  background: linear-gradient(180deg, rgba(105, 31, 50, 0.82), rgba(54, 16, 31, 0.9)) !important;
  background-color: #441422 !important;
  background-image: linear-gradient(180deg, rgba(105, 31, 50, 0.82), rgba(54, 16, 31, 0.9)) !important;
  color: #ffe5ea !important;
  -webkit-text-fill-color: #ffe5ea !important;
  transform: translateY(-1px) !important;
}

/* Final Form360 medical question card design. */
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row {
  grid-template-columns: 34px minmax(0, 1fr) auto minmax(150px, 170px) !important;
  gap: 10px 16px !important;
  padding: 16px 18px !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-index,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-index,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-index {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-index > span,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-index > span,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-index > span {
  width: 26px !important;
  height: 26px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(148, 105, 255, 0.9) !important;
  background: linear-gradient(180deg, rgba(83, 55, 198, 0.56), rgba(16, 35, 68, 0.92)) !important;
  color: #e9ddff !important;
  -webkit-text-fill-color: #e9ddff !important;
  font-size: 13px !important;
  font-weight: 840 !important;
  box-shadow: 0 0 0 3px rgba(122, 88, 255, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-copy,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-copy,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-copy {
  min-width: 0 !important;
  display: grid !important;
  gap: 8px !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-required,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-required,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-required {
  width: max-content !important;
  border-radius: 999px !important;
  padding: 4px 8px !important;
  border: 1px solid rgba(151, 96, 255, 0.42) !important;
  background: rgba(91, 54, 201, 0.24) !important;
  color: #b991ff !important;
  -webkit-text-fill-color: #b991ff !important;
  font-size: 10px !important;
  font-weight: 820 !important;
  line-height: 1 !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-group,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-group,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-group {
  width: auto !important;
  min-width: 178px !important;
  display: inline-grid !important;
  grid-template-columns: repeat(2, 86px) !important;
  gap: 10px !important;
  justify-self: end !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status {
  min-height: 44px !important;
  padding-left: 22px !important;
  border-left: 1px solid rgba(67, 97, 149, 0.46) !important;
  display: grid !important;
  align-content: center !important;
  gap: 8px !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status > span,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status > span,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status > span {
  width: max-content !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  border-radius: 9px !important;
  padding: 5px 10px !important;
  font-size: 11px !important;
  font-weight: 840 !important;
  line-height: 1 !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status > span i,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status > span i,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status > span i {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  display: inline-block !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-answered > span,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-answered > span,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-answered > span {
  border: 1px solid rgba(34, 197, 94, 0.28) !important;
  background: rgba(17, 127, 67, 0.22) !important;
  color: #35d27a !important;
  -webkit-text-fill-color: #35d27a !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-answered > span i,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-answered > span i,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-answered > span i {
  background: #22c55e !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-pending > span,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-pending > span,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-pending > span {
  border: 1px solid rgba(245, 158, 11, 0.3) !important;
  background: rgba(146, 91, 8, 0.2) !important;
  color: #f59e0b !important;
  -webkit-text-fill-color: #f59e0b !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-pending > span i,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-pending > span i,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status.is-pending > span i {
  background: #f59e0b !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status time,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status time,
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status time {
  color: #a9bbd7 !important;
  -webkit-text-fill-color: #a9bbd7 !important;
  font-size: 12px !important;
  font-weight: 720 !important;
}

#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items),
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items),
#s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items) {
  grid-column: 2 / -1 !important;
}

@media (max-width: 1180px) {
  #system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
  #system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
  #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row {
    grid-template-columns: 34px minmax(0, 1fr) !important;
  }

  #system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-dot-group, .s360-wz-med-status, .s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items),
  #system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-dot-group, .s360-wz-med-status, .s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items),
  #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-dot-group, .s360-wz-med-status, .s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items) {
    grid-column: 2 / -1 !important;
    justify-self: stretch !important;
  }

  #system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status,
  #system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status,
  #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-status {
    padding-left: 0 !important;
    padding-top: 10px !important;
    border-left: 0 !important;
    border-top: 1px solid rgba(67, 97, 149, 0.46) !important;
  }
}

/* Jornada control panel final dark theme */
#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard {
  width: min(650px, calc(100vw - 28px)) !important;
  max-width: calc(100vw - 28px) !important;
  padding: 18px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(78, 105, 158, 0.58) !important;
  background:
    radial-gradient(120% 85% at 12% 0%, rgba(91, 65, 196, 0.18), transparent 52%),
    linear-gradient(180deg, rgba(13, 24, 48, 0.98), rgba(7, 16, 33, 0.98)) !important;
  box-shadow: 0 28px 64px rgba(2, 8, 24, 0.62), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  color: #eef5ff !important;
  overflow: hidden !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard .s360-clock-v2-head {
  align-items: flex-start !important;
  padding: 0 0 16px !important;
  margin: 0 !important;
  border-bottom: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard .s360-clock-v2-head h4 {
  margin: 0 0 4px !important;
  color: #f7fbff !important;
  font-size: 24px !important;
  line-height: 1.08 !important;
  font-weight: 820 !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard .s360-clock-v2-head p {
  margin: 0 !important;
  color: #a9bce2 !important;
  font-size: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard :is(.s360-clock-worked-card, .s360-clock-metric-card, .s360-clock-action-card) {
  border-color: rgba(62, 89, 144, 0.58) !important;
  background:
    radial-gradient(95% 90% at 18% 0%, rgba(82, 115, 196, 0.14), transparent 62%),
    rgba(10, 22, 45, 0.78) !important;
  color: #eef5ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard :is(.s360-clock-worked-copy strong, .s360-clock-metric-card strong, .s360-clock-action-card strong) {
  color: #ffffff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard :is(.s360-clock-worked-copy small, .s360-clock-metric-card small) {
  color: #b7c7ed !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard .s360-clock-action-card small {
  color: #a8b9dd !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard {
  width: min(560px, calc(100vw - 24px)) !important;
  padding: 14px 16px !important;
  max-height: calc(100vh - 72px) !important;
  overflow-y: auto !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard .s360-clock-worked-card {
  min-height: 118px !important;
  padding: 16px 18px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard .s360-clock-metric-card {
  min-height: 90px !important;
  padding: 13px 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard :is(.s360-clock-action-card, .s360-clock-action-card.is-on, .s360-clock-action-card.is-on.is-danger) {
  min-height: 86px !important;
  padding: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard :is(.s360-clock-metric-icon, .s360-clock-action-icon) {
  width: 48px !important;
  height: 48px !important;
  background: linear-gradient(145deg, rgba(105, 66, 255, 0.42), rgba(61, 42, 132, 0.58)) !important;
  color: #b768ff !important;
}

#system360-app .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-clock-host > .s360-clock-dropdown.s360-clock-ios-dashboard :is(.s360-clock-metric-icon, .s360-clock-action-icon) svg {
  width: 24px !important;
  height: 24px !important;
  display: block !important;
  stroke: currentColor !important;
  fill: none !important;
}

/* Chat interno: override final para evitar estilos claros heredados */
body .s360-chat-layer,
#system360-app .s360-chat-layer {
  font-family: Inter, "SF Pro Display", "Segoe UI", sans-serif !important;
}

body .s360-chat-layer .s360-chat-window,
#system360-app .s360-chat-layer .s360-chat-window {
  background:
    radial-gradient(circle at 16% 0%, rgba(55, 102, 255, 0.14), transparent 32%),
    radial-gradient(circle at 88% 2%, rgba(162, 65, 255, 0.12), transparent 30%),
    #06101f !important;
  border: 1px solid rgba(72, 106, 170, 0.78) !important;
  border-radius: 10px !important;
  color: #eaf1ff !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(130, 85, 255, 0.12) inset !important;
}

body .s360-chat-layer .s360-chat-window.is-launcher,
#system360-app .s360-chat-layer .s360-chat-window.is-launcher {
  min-width: min(1140px, calc(100vw - 36px)) !important;
  min-height: min(640px, calc(100vh - 84px)) !important;
}

body .s360-chat-layer .s360-chat-window-head,
body .s360-chat-layer .s360-chat-window-nav,
body .s360-chat-layer .s360-chat-window-input,
#system360-app .s360-chat-layer .s360-chat-window-head,
#system360-app .s360-chat-layer .s360-chat-window-nav,
#system360-app .s360-chat-layer .s360-chat-window-input {
  background: rgba(5, 13, 28, 0.96) !important;
  border-color: rgba(62, 91, 149, 0.56) !important;
  color: #eaf1ff !important;
}

body .s360-chat-layer .s360-chat-window-head,
#system360-app .s360-chat-layer .s360-chat-window-head {
  min-height: 58px !important;
  padding: 12px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

body .s360-chat-layer .s360-chat-window-head-main strong,
#system360-app .s360-chat-layer .s360-chat-window-head-main strong {
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 820 !important;
}

body .s360-chat-layer .s360-chat-window-head-main small,
body .s360-chat-layer .s360-chat-directory-main small,
body .s360-chat-layer .s360-chat-empty,
#system360-app .s360-chat-layer .s360-chat-window-head-main small,
#system360-app .s360-chat-layer .s360-chat-directory-main small,
#system360-app .s360-chat-layer .s360-chat-empty {
  color: #91a4c4 !important;
}

body .s360-chat-layer .s360-chat-window-nav,
#system360-app .s360-chat-layer .s360-chat-window-nav {
  display: grid !important;
  grid-template-columns: 240px minmax(0, 1fr) !important;
  gap: 10px !important;
  padding: 8px 10px !important;
}

body .s360-chat-layer .s360-chat-window-tabs,
#system360-app .s360-chat-layer .s360-chat-window-tabs {
  background: rgba(7, 18, 36, 0.9) !important;
  border: 1px solid rgba(53, 83, 140, 0.58) !important;
  border-radius: 8px !important;
  padding: 4px !important;
}

body .s360-chat-layer .s360-chat-window-tab,
#system360-app .s360-chat-layer .s360-chat-window-tab {
  min-height: 34px !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: #a8bad8 !important;
  background: transparent !important;
}

body .s360-chat-layer .s360-chat-window-tab.active,
#system360-app .s360-chat-layer .s360-chat-window-tab.active {
  color: #fff !important;
  background: linear-gradient(90deg, #552cf1, #8a36ef) !important;
  box-shadow: 0 0 24px rgba(122, 70, 255, 0.32) !important;
}

body .s360-chat-layer .s360-chat-window .s360-input,
#system360-app .s360-chat-layer .s360-chat-window .s360-input {
  color: #dce8ff !important;
  background: rgba(5, 14, 30, 0.94) !important;
  border: 1px solid rgba(64, 96, 155, 0.64) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body .s360-chat-layer .s360-chat-window .s360-input::placeholder,
#system360-app .s360-chat-layer .s360-chat-window .s360-input::placeholder {
  color: #8397b9 !important;
}

body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
#system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
  display: grid !important;
  grid-template-columns: 300px minmax(430px, 1fr) 280px !important;
  gap: 10px !important;
  padding: 10px !important;
  background: rgba(3, 10, 22, 0.88) !important;
  overflow: hidden !important;
}

body .s360-chat-layer .s360-chat-window-directory,
body .s360-chat-layer .s360-chat-window-main,
body .s360-chat-layer .s360-chat-launcher-info,
#system360-app .s360-chat-layer .s360-chat-window-directory,
#system360-app .s360-chat-layer .s360-chat-window-main,
#system360-app .s360-chat-layer .s360-chat-launcher-info {
  min-width: 0 !important;
  background: linear-gradient(180deg, rgba(8, 20, 39, 0.96), rgba(5, 14, 29, 0.96)) !important;
  border: 1px solid rgba(57, 89, 148, 0.62) !important;
  border-radius: 8px !important;
  color: #eaf1ff !important;
  overflow: hidden !important;
}

body .s360-chat-layer .s360-chat-window-directory,
#system360-app .s360-chat-layer .s360-chat-window-directory {
  padding: 8px !important;
  overflow-y: auto !important;
}

body .s360-chat-layer .s360-chat-directory-block-title,
#system360-app .s360-chat-layer .s360-chat-directory-block-title {
  color: #8195b8 !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  margin: 12px 6px 6px !important;
}

body .s360-chat-layer .s360-chat-directory-item,
#system360-app .s360-chat-layer .s360-chat-directory-item {
  min-height: 54px !important;
  padding: 8px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #dce8ff !important;
  opacity: 1 !important;
}

body .s360-chat-layer .s360-chat-directory-main strong,
#system360-app .s360-chat-layer .s360-chat-directory-main strong {
  color: #eef5ff !important;
  font-size: 13px !important;
  font-weight: 760 !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35) !important;
}

body .s360-chat-layer .s360-chat-directory-main small,
#system360-app .s360-chat-layer .s360-chat-directory-main small {
  color: #a8bad8 !important;
  font-size: 11px !important;
}

body .s360-chat-layer .s360-chat-directory-item *,
#system360-app .s360-chat-layer .s360-chat-directory-item * {
  opacity: 1 !important;
}

body .s360-chat-layer .s360-chat-directory-item:hover,
body .s360-chat-layer .s360-chat-directory-item.active,
#system360-app .s360-chat-layer .s360-chat-directory-item:hover,
#system360-app .s360-chat-layer .s360-chat-directory-item.active {
  background: linear-gradient(90deg, rgba(92, 45, 223, 0.70), rgba(48, 32, 101, 0.72)) !important;
  border-color: rgba(143, 94, 255, 0.82) !important;
  box-shadow: 0 0 22px rgba(112, 67, 255, 0.30) !important;
}

body .s360-chat-layer .s360-chat-directory-avatar,
body .s360-chat-layer .s360-chat-info-icon,
#system360-app .s360-chat-layer .s360-chat-directory-avatar,
#system360-app .s360-chat-layer .s360-chat-info-icon {
  background: linear-gradient(135deg, #572fe7, #9d39ee) !important;
  color: #fff !important;
}

body .s360-chat-layer .s360-chat-main-meta,
#system360-app .s360-chat-layer .s360-chat-main-meta {
  display: none !important;
}

body .s360-chat-layer .s360-chat-window-messages,
#system360-app .s360-chat-layer .s360-chat-window-messages {
  background: transparent !important;
  color: #dce8ff !important;
}

body .s360-chat-layer .s360-chat-launcher-panel,
#system360-app .s360-chat-layer .s360-chat-launcher-panel {
  padding: 0 !important;
  overflow: auto !important;
}

body .s360-chat-layer .s360-chat-active,
#system360-app .s360-chat-layer .s360-chat-active {
  min-height: 100% !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  gap: 10px !important;
  padding: 14px !important;
}

body .s360-chat-layer .s360-chat-active > .s360-chat-window-messages,
#system360-app .s360-chat-layer .s360-chat-active > .s360-chat-window-messages {
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 6px 2px 6px 0 !important;
}

body .s360-chat-layer .s360-chat-preview,
#system360-app .s360-chat-layer .s360-chat-preview {
  min-height: 100% !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
  gap: 10px !important;
  padding: 14px !important;
}

body .s360-chat-layer .s360-chat-preview-head,
#system360-app .s360-chat-layer .s360-chat-preview-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(58, 86, 140, 0.46) !important;
  min-width: 0 !important;
}

body .s360-chat-layer .s360-chat-preview-head strong,
#system360-app .s360-chat-layer .s360-chat-preview-head strong {
  color: #fff !important;
  font-size: 19px !important;
}

body .s360-chat-layer .s360-chat-preview-head small,
#system360-app .s360-chat-layer .s360-chat-preview-head small {
  display: block !important;
  margin-top: 3px !important;
  color: #91a4c4 !important;
}

body .s360-chat-layer .s360-chat-preview-actions,
#system360-app .s360-chat-layer .s360-chat-preview-actions {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  flex: 0 0 auto !important;
}

body .s360-chat-layer .s360-chat-preview-actions button,
body .s360-chat-layer .s360-chat-preview-composer button,
#system360-app .s360-chat-layer .s360-chat-preview-actions button,
#system360-app .s360-chat-layer .s360-chat-preview-composer button {
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(64, 96, 155, 0.62) !important;
  border-radius: 8px !important;
  background: rgba(8, 18, 36, 0.92) !important;
  color: #dce8ff !important;
}

body .s360-chat-layer .s360-chat-preview-avatars,
#system360-app .s360-chat-layer .s360-chat-preview-avatars {
  display: flex !important;
  align-items: center !important;
}

body .s360-chat-layer .s360-chat-preview-avatars b,
body .s360-chat-layer .s360-chat-preview-avatars em,
#system360-app .s360-chat-layer .s360-chat-preview-avatars b,
#system360-app .s360-chat-layer .s360-chat-preview-avatars em {
  width: 26px !important;
  height: 26px !important;
  margin-left: -5px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(161, 186, 228, 0.36) !important;
  border-radius: 999px !important;
  background: #1d2b47 !important;
  color: #fff !important;
  font-size: 10px !important;
  font-style: normal !important;
}

body .s360-chat-layer .s360-chat-preview-pinned,
#system360-app .s360-chat-layer .s360-chat-preview-pinned {
  display: flex !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid rgba(126, 83, 255, 0.62) !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, rgba(61, 42, 132, 0.38), rgba(17, 29, 58, 0.80)) !important;
}

body .s360-chat-layer .s360-chat-preview-pinned strong,
#system360-app .s360-chat-layer .s360-chat-preview-pinned strong {
  color: #fff !important;
}

body .s360-chat-layer .s360-chat-preview-pinned small,
#system360-app .s360-chat-layer .s360-chat-preview-pinned small {
  display: block !important;
  color: #aebcdf !important;
}

body .s360-chat-layer .s360-chat-preview-date,
#system360-app .s360-chat-layer .s360-chat-preview-date {
  color: #91a4c4 !important;
  text-align: center !important;
  font-size: 12px !important;
}

body .s360-chat-layer .s360-chat-preview-message,
#system360-app .s360-chat-layer .s360-chat-preview-message {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  gap: 10px !important;
  color: #dce8ff !important;
}

body .s360-chat-layer .s360-chat-preview-avatar,
#system360-app .s360-chat-layer .s360-chat-preview-avatar {
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #293b64, #8652ff) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

body .s360-chat-layer .s360-chat-preview-message strong,
#system360-app .s360-chat-layer .s360-chat-preview-message strong {
  color: #fff !important;
}

body .s360-chat-layer .s360-chat-preview-message small,
#system360-app .s360-chat-layer .s360-chat-preview-message small {
  color: #8297b8 !important;
  font-weight: 500 !important;
}

body .s360-chat-layer .s360-chat-preview-message p,
#system360-app .s360-chat-layer .s360-chat-preview-message p {
  margin: 4px 0 0 !important;
  color: #c5d3ed !important;
}

body .s360-chat-layer .s360-chat-preview-message em,
#system360-app .s360-chat-layer .s360-chat-preview-message em {
  display: inline-flex !important;
  margin-top: 6px !important;
  padding: 3px 9px !important;
  border: 1px solid rgba(65, 98, 158, 0.56) !important;
  border-radius: 999px !important;
  color: #dce8ff !important;
  background: rgba(7, 17, 34, 0.88) !important;
  font-style: normal !important;
}

body .s360-chat-layer .s360-chat-preview-message.is-mine > div,
#system360-app .s360-chat-layer .s360-chat-preview-message.is-mine > div {
  padding: 10px 12px !important;
  border: 1px solid rgba(110, 75, 255, 0.62) !important;
  border-radius: 8px !important;
  background: rgba(38, 34, 91, 0.52) !important;
}

body .s360-chat-layer .s360-chat-preview-empty-state,
#system360-app .s360-chat-layer .s360-chat-preview-empty-state {
  min-height: 190px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 10px !important;
  padding: 28px !important;
  border: 1px dashed rgba(80, 112, 174, 0.55) !important;
  border-radius: 10px !important;
  background: rgba(6, 16, 32, 0.62) !important;
  text-align: center !important;
}

body .s360-chat-layer .s360-chat-preview-empty-state span,
#system360-app .s360-chat-layer .s360-chat-preview-empty-state span {
  width: 52px !important;
  height: 52px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #552cf1, #9b34f4) !important;
  color: #fff !important;
}

body .s360-chat-layer .s360-chat-preview-empty-state strong,
#system360-app .s360-chat-layer .s360-chat-preview-empty-state strong {
  color: #fff !important;
  font-size: 18px !important;
}

body .s360-chat-layer .s360-chat-preview-empty-state small,
#system360-app .s360-chat-layer .s360-chat-preview-empty-state small {
  max-width: 330px !important;
  color: #aabbd8 !important;
}

body .s360-chat-layer .s360-chat-preview-composer,
#system360-app .s360-chat-layer .s360-chat-preview-composer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) repeat(4, 34px) 48px !important;
  gap: 7px !important;
  padding: 10px !important;
  border: 1px solid rgba(64, 96, 155, 0.62) !important;
  border-radius: 8px !important;
  background: rgba(5, 14, 30, 0.92) !important;
  align-self: end !important;
}

body .s360-chat-layer .s360-chat-preview-composer .is-send,
#system360-app .s360-chat-layer .s360-chat-preview-composer .is-send {
  width: 48px !important;
  background: linear-gradient(135deg, #642eff, #8d31e8) !important;
  border-color: rgba(158, 107, 255, 0.82) !important;
}

body .s360-chat-layer .s360-chat-launcher-composer,
#system360-app .s360-chat-layer .s360-chat-launcher-composer {
  display: grid !important;
  grid-template-columns: 36px 36px 36px 36px minmax(0, 1fr) 52px !important;
  gap: 7px !important;
  padding: 10px !important;
  border: 1px solid rgba(64, 96, 155, 0.62) !important;
  border-radius: 8px !important;
  background: rgba(5, 14, 30, 0.96) !important;
  align-items: center !important;
}

body .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-client-chip-row,
body .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-mention-list,
#system360-app .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-client-chip-row,
#system360-app .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-mention-list {
  grid-column: 1 / -1 !important;
}

body .s360-chat-layer .s360-chat-launcher-composer .s360-input,
#system360-app .s360-chat-layer .s360-chat-launcher-composer .s360-input {
  grid-column: 5 !important;
  height: 36px !important;
}

body .s360-chat-layer .s360-chat-launcher-composer .s360-icon-btn,
#system360-app .s360-chat-layer .s360-chat-launcher-composer .s360-icon-btn {
  width: 36px !important;
  height: 36px !important;
  border: 1px solid rgba(64, 96, 155, 0.62) !important;
  border-radius: 8px !important;
  background: rgba(8, 18, 36, 0.92) !important;
  color: #dce8ff !important;
  box-shadow: none !important;
}

body .s360-chat-layer .s360-chat-launcher-composer .s360-icon-btn:hover,
#system360-app .s360-chat-layer .s360-chat-launcher-composer .s360-icon-btn:hover {
  border-color: rgba(143, 94, 255, 0.82) !important;
  background: rgba(29, 31, 73, 0.95) !important;
}

body .s360-chat-layer .s360-chat-launcher-composer .s360-chat-send-btn,
#system360-app .s360-chat-layer .s360-chat-launcher-composer .s360-chat-send-btn {
  grid-column: 6 !important;
  width: 52px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border: 1px solid rgba(158, 107, 255, 0.82) !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #642eff, #8d31e8) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(108, 60, 255, 0.32) !important;
}

body .s360-chat-layer .s360-chat-launcher-composer svg,
#system360-app .s360-chat-layer .s360-chat-launcher-composer svg {
  width: 18px !important;
  height: 18px !important;
  stroke: currentColor !important;
  fill: none !important;
}

body .s360-chat-layer .s360-chat-launcher-info,
#system360-app .s360-chat-layer .s360-chat-launcher-info {
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
  padding: 12px !important;
}

body .s360-chat-layer .s360-chat-info-card,
#system360-app .s360-chat-layer .s360-chat-info-card {
  padding: 14px !important;
  border: 1px solid rgba(57, 89, 148, 0.56) !important;
  border-radius: 8px !important;
  background: rgba(8, 19, 38, 0.86) !important;
}

body .s360-chat-layer .s360-chat-info-card strong,
#system360-app .s360-chat-layer .s360-chat-info-card strong {
  color: #fff !important;
}

body .s360-chat-layer .s360-chat-info-grid,
#system360-app .s360-chat-layer .s360-chat-info-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

body .s360-chat-layer .s360-chat-info-grid article,
#system360-app .s360-chat-layer .s360-chat-info-grid article {
  border: 1px solid rgba(57, 89, 148, 0.50) !important;
  border-radius: 8px !important;
  background: rgba(7, 17, 34, 0.9) !important;
  padding: 12px !important;
}

body .s360-chat-layer .s360-chat-info-grid b,
#system360-app .s360-chat-layer .s360-chat-info-grid b {
  display: block !important;
  color: #fff !important;
  font-size: 18px !important;
}

body .s360-chat-layer .s360-chat-info-grid span,
body .s360-chat-layer .s360-chat-info-card small,
#system360-app .s360-chat-layer .s360-chat-info-grid span,
#system360-app .s360-chat-layer .s360-chat-info-card small {
  color: #91a4c4 !important;
}

body .s360-chat-layer .s360-chat-info-actions button,
#system360-app .s360-chat-layer .s360-chat-info-actions button {
  width: 100% !important;
  min-height: 36px !important;
  margin-top: 8px !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: #fff !important;
  background: linear-gradient(90deg, #552cf1, #b337d6, #ef4f69) !important;
}

body .s360-chat-layer .s360-chat-launcher-foot,
#system360-app .s360-chat-layer .s360-chat-launcher-foot {
  background: rgba(5, 13, 28, 0.96) !important;
  color: #6e83a7 !important;
}

body .s360-chat-layer .s360-chat-head-btn,
#system360-app .s360-chat-layer .s360-chat-head-btn {
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(76, 111, 174, 0.72) !important;
  border-radius: 9px !important;
  background: rgba(8, 18, 36, 0.92) !important;
  color: #dce8ff !important;
  box-shadow: 0 0 0 transparent !important;
}

body .s360-chat-layer .s360-chat-head-btn:hover,
#system360-app .s360-chat-layer .s360-chat-head-btn:hover {
  border-color: rgba(141, 105, 255, 0.9) !important;
  background: rgba(27, 32, 73, 0.96) !important;
  box-shadow: 0 0 18px rgba(105, 76, 255, 0.25) !important;
}

body .s360-chat-layer .s360-chat-head-btn.is-close,
#system360-app .s360-chat-layer .s360-chat-head-btn.is-close {
  color: #f1f6ff !important;
}

body .s360-chat-layer .s360-chat-head-btn svg,
#system360-app .s360-chat-layer .s360-chat-head-btn svg {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  stroke: currentColor !important;
  fill: none !important;
}

body .s360-chat-layer .s360-chat-head-btn .material-symbols-rounded,
body .s360-chat-layer .s360-chat-head-btn .material-symbols-outlined,
body .s360-chat-layer .s360-chat-head-btn .material-icons,
#system360-app .s360-chat-layer .s360-chat-head-btn .material-symbols-rounded,
#system360-app .s360-chat-layer .s360-chat-head-btn .material-symbols-outlined,
#system360-app .s360-chat-layer .s360-chat-head-btn .material-icons {
  color: currentColor !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

@media (max-width: 980px) {
  body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
    grid-template-columns: minmax(260px, 0.85fr) minmax(360px, 1.3fr) !important;
  }

  body .s360-chat-layer .s360-chat-launcher-info,
  #system360-app .s360-chat-layer .s360-chat-launcher-info {
    display: none !important;
  }
}

/* ===== Disco de asesores premium ===== */
body #s360-drive-floating-root,
#s360-drive-floating-root {
  position: fixed !important;
  inset: 0 !important;
  z-index: 11110 !important;
  pointer-events: none !important;
  font-family: Inter, "SF Pro Display", "Segoe UI", system-ui, sans-serif !important;
}

body #s360-drive-floating-root .s360-drive-floating-overlay,
#s360-drive-floating-root .s360-drive-floating-overlay {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(2, 6, 23, 0.58) !important;
  backdrop-filter: blur(12px) saturate(120%) !important;
  pointer-events: auto !important;
}

body #s360-drive-floating-root [data-drive-popup-window],
#s360-drive-floating-root [data-drive-popup-window] {
  position: fixed !important;
  pointer-events: auto !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  min-width: min(1180px, calc(100vw - 32px)) !important;
  min-height: min(680px, calc(100vh - 52px)) !important;
  max-width: calc(100vw - 28px) !important;
  max-height: calc(100vh - 28px) !important;
  overflow: hidden !important;
  border-radius: 20px !important;
  border: 1px solid rgba(96, 165, 250, 0.28) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(79, 70, 229, 0.18), transparent 34%),
    radial-gradient(circle at 88% 12%, rgba(236, 72, 153, 0.1), transparent 30%),
    linear-gradient(145deg, #0b1020 0%, #090d17 46%, #050915 100%) !important;
  box-shadow: 0 34px 90px rgba(0, 0, 0, 0.62), 0 0 0 1px rgba(255, 255, 255, 0.03) inset !important;
  color: #eef4ff !important;
}

body #s360-drive-floating-root [data-drive-popup-window].is-maximized,
#s360-drive-floating-root [data-drive-popup-window].is-maximized {
  inset: 14px !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

body #s360-drive-floating-root [data-drive-popup-window].is-minimized,
#s360-drive-floating-root [data-drive-popup-window].is-minimized {
  min-height: 74px !important;
  height: 74px !important;
}

body #s360-drive-floating-root .s360-drive-popup-head,
#s360-drive-floating-root .s360-drive-popup-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 18px 22px 16px !important;
  cursor: grab !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.76), rgba(15, 23, 42, 0.24)) !important;
}

body #s360-drive-floating-root .s360-drive-popup-head-main,
#s360-drive-floating-root .s360-drive-popup-head-main {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

body #s360-drive-floating-root .s360-drive-popup-icon,
#s360-drive-floating-root .s360-drive-popup-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 15px !important;
  display: grid !important;
  place-items: center !important;
  color: #d8c8ff !important;
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.24), rgba(139, 92, 246, 0.75)) !important;
  box-shadow: 0 0 28px rgba(139, 92, 246, 0.32) !important;
}

body #s360-drive-floating-root .s360-svg-icon,
#s360-drive-floating-root .s360-svg-icon {
  width: 18px !important;
  height: 18px !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  fill: none !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body #s360-drive-floating-root .s360-drive-popup-head-text strong,
#s360-drive-floating-root .s360-drive-popup-head-text strong {
  display: block !important;
  color: #f8fbff !important;
  font-size: 20px !important;
  line-height: 1.1 !important;
  font-weight: 850 !important;
}

body #s360-drive-floating-root .s360-drive-popup-head-text small,
#s360-drive-floating-root .s360-drive-popup-head-text small {
  display: block !important;
  color: #a8b6d5 !important;
  font-size: 12px !important;
  margin-top: 4px !important;
}

body #s360-drive-floating-root .s360-drive-popup-head-actions,
#s360-drive-floating-root .s360-drive-popup-head-actions,
body #s360-drive-floating-root .s360-drive-floating-actions,
#s360-drive-floating-root .s360-drive-floating-actions,
body #s360-drive-floating-root .s360-drive-floating-chips,
#s360-drive-floating-root .s360-drive-floating-chips {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
}

body #s360-drive-floating-root .s360-drive-window-btn,
#s360-drive-floating-root .s360-drive-window-btn,
body #s360-drive-floating-root .s360-drive-toggle-btn,
#s360-drive-floating-root .s360-drive-toggle-btn,
body #s360-drive-floating-root .s360-drive-action-btn,
#s360-drive-floating-root .s360-drive-action-btn {
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(96, 165, 250, 0.24) !important;
  background: rgba(15, 23, 42, 0.72) !important;
  color: #cfe0ff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  transition: transform 260ms ease, border-color 260ms ease, box-shadow 260ms ease, background 260ms ease !important;
}

body #s360-drive-floating-root .s360-drive-window-btn:hover,
#s360-drive-floating-root .s360-drive-window-btn:hover,
body #s360-drive-floating-root .s360-drive-toggle-btn:hover,
#s360-drive-floating-root .s360-drive-toggle-btn:hover,
body #s360-drive-floating-root .s360-drive-action-btn:hover,
#s360-drive-floating-root .s360-drive-action-btn:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(168, 85, 247, 0.62) !important;
  box-shadow: 0 0 22px rgba(124, 58, 237, 0.2) !important;
}

body #s360-drive-floating-root .s360-drive-toggle-btn.is-active,
#s360-drive-floating-root .s360-drive-toggle-btn.is-active,
body #s360-drive-floating-root .s360-drive-action-btn.is-primary,
#s360-drive-floating-root .s360-drive-action-btn.is-primary,
body #s360-drive-floating-root .s360-drive-chip.is-active,
#s360-drive-floating-root .s360-drive-chip.is-active {
  border-color: rgba(168, 85, 247, 0.72) !important;
  background: linear-gradient(135deg, #4f46e5, #7c3aed 52%, #ec4899) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(124, 58, 237, 0.26) !important;
}

body #s360-drive-floating-root .s360-drive-floating-body,
#s360-drive-floating-root .s360-drive-floating-body {
  min-height: 0 !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

body #s360-drive-floating-root [data-drive-popup-window].is-minimized .s360-drive-floating-body,
#s360-drive-floating-root [data-drive-popup-window].is-minimized .s360-drive-floating-body {
  display: none !important;
}

body #s360-drive-floating-root .s360-drive-floating-toolbar,
#s360-drive-floating-root .s360-drive-floating-toolbar {
  display: grid !important;
  grid-template-columns: auto minmax(260px, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 12px 22px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.13) !important;
  background: rgba(5, 10, 21, 0.62) !important;
}

body #s360-drive-floating-root .s360-drive-chip,
#s360-drive-floating-root .s360-drive-chip {
  height: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(96, 165, 250, 0.22) !important;
  background: rgba(15, 23, 42, 0.7) !important;
  color: #cfe0ff !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

body #s360-drive-floating-root .s360-drive-chip.is-soft,
#s360-drive-floating-root .s360-drive-chip.is-soft {
  color: #c8d4ea !important;
  background: rgba(17, 24, 39, 0.84) !important;
}

body #s360-drive-floating-root .s360-drive-search,
#s360-drive-floating-root .s360-drive-search {
  height: 38px !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(96, 165, 250, 0.24) !important;
  background: rgba(6, 12, 24, 0.82) !important;
  padding: 0 12px !important;
  color: #9db2d3 !important;
}

body #s360-drive-floating-root .s360-drive-search input,
#s360-drive-floating-root .s360-drive-search input {
  width: 100% !important;
  min-width: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: #eef4ff !important;
  font-size: 13px !important;
}

body #s360-drive-floating-root .s360-drive-search input::placeholder,
#s360-drive-floating-root .s360-drive-search input::placeholder {
  color: #8091b0 !important;
}

body #s360-drive-floating-root .s360-drive-search kbd,
#s360-drive-floating-root .s360-drive-search kbd {
  border-radius: 7px !important;
  padding: 2px 7px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #95a6c3 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

body #s360-drive-floating-root .s360-drive-filter,
#s360-drive-floating-root .s360-drive-filter,
body #s360-drive-floating-root [data-drive-sort],
#s360-drive-floating-root [data-drive-sort] {
  height: 36px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(96, 165, 250, 0.24) !important;
  background: rgba(15, 23, 42, 0.84) !important;
  color: #dbe8ff !important;
  padding: 0 10px !important;
  font-weight: 750 !important;
  outline: 0 !important;
}

body #s360-drive-floating-root .s360-drive-manager,
#s360-drive-floating-root .s360-drive-manager {
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: 252px minmax(420px, 1fr) 286px !important;
  overflow: hidden !important;
}

body #s360-drive-floating-root .s360-drive-sidebar,
#s360-drive-floating-root .s360-drive-sidebar,
body #s360-drive-floating-root .s360-drive-details,
#s360-drive-floating-root .s360-drive-details {
  min-height: 0 !important;
  overflow: auto !important;
  background: rgba(4, 10, 22, 0.58) !important;
}

body #s360-drive-floating-root .s360-drive-sidebar,
#s360-drive-floating-root .s360-drive-sidebar {
  border-right: 1px solid rgba(148, 163, 184, 0.14) !important;
  padding: 14px !important;
}

body #s360-drive-floating-root .s360-drive-nav,
#s360-drive-floating-root .s360-drive-nav,
body #s360-drive-floating-root .s360-drive-tree,
#s360-drive-floating-root .s360-drive-tree {
  display: grid !important;
  gap: 6px !important;
}

body #s360-drive-floating-root .s360-drive-nav button,
#s360-drive-floating-root .s360-drive-nav button,
body #s360-drive-floating-root .s360-drive-tree button,
#s360-drive-floating-root .s360-drive-tree button {
  width: 100% !important;
  min-height: 36px !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #b8c8e4 !important;
  display: grid !important;
  grid-template-columns: 20px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 10px !important;
  text-align: left !important;
  font-size: 13px !important;
  font-weight: 750 !important;
}

body #s360-drive-floating-root .s360-drive-nav button:hover,
#s360-drive-floating-root .s360-drive-nav button:hover,
body #s360-drive-floating-root .s360-drive-tree button:hover,
#s360-drive-floating-root .s360-drive-tree button:hover,
body #s360-drive-floating-root .s360-drive-nav button.is-active,
#s360-drive-floating-root .s360-drive-nav button.is-active,
body #s360-drive-floating-root .s360-drive-tree button.is-active,
#s360-drive-floating-root .s360-drive-tree button.is-active {
  border-color: rgba(139, 92, 246, 0.58) !important;
  background: linear-gradient(90deg, rgba(124, 58, 237, 0.46), rgba(37, 99, 235, 0.12)) !important;
  color: #fff !important;
  box-shadow: 0 0 18px rgba(124, 58, 237, 0.15) !important;
}

body #s360-drive-floating-root .s360-drive-sidebar-title,
#s360-drive-floating-root .s360-drive-sidebar-title {
  margin: 18px 0 8px !important;
  color: #8394b4 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  text-transform: uppercase !important;
}

body #s360-drive-floating-root .s360-drive-storage,
#s360-drive-floating-root .s360-drive-storage {
  margin-top: 22px !important;
  border: 1px solid rgba(96, 165, 250, 0.2) !important;
  border-radius: 14px !important;
  padding: 14px !important;
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.86), rgba(17, 24, 39, 0.54)) !important;
  display: grid !important;
  gap: 10px !important;
}

body #s360-drive-floating-root .s360-drive-storage strong,
#s360-drive-floating-root .s360-drive-storage strong {
  color: #eef4ff !important;
  font-size: 13px !important;
}

body #s360-drive-floating-root .s360-drive-storage span,
#s360-drive-floating-root .s360-drive-storage span {
  height: 7px !important;
  border-radius: 999px !important;
  background: rgba(59, 130, 246, 0.16) !important;
  overflow: hidden !important;
}

body #s360-drive-floating-root .s360-drive-storage span i,
#s360-drive-floating-root .s360-drive-storage span i {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, #60a5fa, #8b5cf6, #ec4899) !important;
}

body #s360-drive-floating-root .s360-drive-storage small,
#s360-drive-floating-root .s360-drive-storage small {
  color: #9fb0ce !important;
  display: flex !important;
  justify-content: space-between !important;
}

body #s360-drive-floating-root .s360-drive-storage button,
#s360-drive-floating-root .s360-drive-storage button {
  height: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  background: rgba(2, 6, 23, 0.32) !important;
  color: #dbe8ff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

body #s360-drive-floating-root .s360-drive-content,
#s360-drive-floating-root .s360-drive-content {
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: auto !important;
  padding: 18px 20px 22px !important;
}

body #s360-drive-floating-root .s360-drive-breadcrumbs,
#s360-drive-floating-root .s360-drive-breadcrumbs {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  color: #8ca0c0 !important;
  font-size: 13px !important;
  margin-bottom: 16px !important;
}

body #s360-drive-floating-root .s360-drive-breadcrumbs button,
#s360-drive-floating-root .s360-drive-breadcrumbs button,
body #s360-drive-floating-root .s360-drive-section-head button,
#s360-drive-floating-root .s360-drive-section-head button {
  border: 0 !important;
  background: transparent !important;
  color: #a855f7 !important;
  font-weight: 850 !important;
}

body #s360-drive-floating-root .s360-drive-breadcrumbs button[disabled],
#s360-drive-floating-root .s360-drive-breadcrumbs button[disabled] {
  opacity: 0.38 !important;
}

body #s360-drive-floating-root .s360-drive-section-head,
#s360-drive-floating-root .s360-drive-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 12px 0 10px !important;
}

body #s360-drive-floating-root .s360-drive-section-head h4,
#s360-drive-floating-root .s360-drive-section-head h4 {
  margin: 0 !important;
  color: #f8fbff !important;
  font-size: 14px !important;
  font-weight: 850 !important;
}

body #s360-drive-floating-root .s360-drive-folders,
#s360-drive-floating-root .s360-drive-folders {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(130px, 1fr)) !important;
  gap: 10px !important;
}

body #s360-drive-floating-root .s360-drive-folder-card,
#s360-drive-floating-root .s360-drive-folder-card {
  min-width: 0 !important;
  min-height: 58px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(96, 165, 250, 0.2) !important;
  background: rgba(15, 23, 42, 0.62) !important;
  color: #eaf2ff !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 18px !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px !important;
  text-align: left !important;
  transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease !important;
}

body #s360-drive-floating-root .s360-drive-folder-card:hover,
#s360-drive-floating-root .s360-drive-folder-card:hover,
body #s360-drive-floating-root .s360-drive-folder-card.is-selected,
#s360-drive-floating-root .s360-drive-folder-card.is-selected,
body #s360-drive-floating-root .s360-drive-file-row:hover,
#s360-drive-floating-root .s360-drive-file-row:hover,
body #s360-drive-floating-root .s360-drive-file-row.is-selected,
#s360-drive-floating-root .s360-drive-file-row.is-selected,
body #s360-drive-floating-root .s360-drive-grid-file:hover,
#s360-drive-floating-root .s360-drive-grid-file:hover,
body #s360-drive-floating-root .s360-drive-grid-file.is-selected,
#s360-drive-floating-root .s360-drive-grid-file.is-selected {
  transform: translateY(-1px) !important;
  border-color: rgba(168, 85, 247, 0.62) !important;
  box-shadow: 0 0 24px rgba(124, 58, 237, 0.16) !important;
}

body #s360-drive-floating-root .s360-drive-folder-card strong,
#s360-drive-floating-root .s360-drive-folder-card strong,
body #s360-drive-floating-root .s360-drive-file-row strong,
#s360-drive-floating-root .s360-drive-file-row strong,
body #s360-drive-floating-root .s360-drive-grid-meta strong,
#s360-drive-floating-root .s360-drive-grid-meta strong {
  display: block !important;
  color: #f8fbff !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body #s360-drive-floating-root .s360-drive-folder-card small,
#s360-drive-floating-root .s360-drive-folder-card small,
body #s360-drive-floating-root .s360-drive-file-row small,
#s360-drive-floating-root .s360-drive-file-row small,
body #s360-drive-floating-root .s360-drive-grid-meta small,
#s360-drive-floating-root .s360-drive-grid-meta small {
  display: block !important;
  color: #9fb0ce !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body #s360-drive-floating-root .s360-drive-filetype,
#s360-drive-floating-root .s360-drive-filetype {
  width: 32px !important;
  height: 32px !important;
  border-radius: 9px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  background: linear-gradient(135deg, #475569, #1e293b) !important;
}

body #s360-drive-floating-root .s360-drive-filetype.is-folder,
#s360-drive-floating-root .s360-drive-filetype.is-folder {
  color: #c4b5fd !important;
  background: rgba(124, 58, 237, 0.32) !important;
}

body #s360-drive-floating-root .s360-drive-filetype.is-pdf,
#s360-drive-floating-root .s360-drive-filetype.is-pdf { background: linear-gradient(135deg, #ef4444, #f97316) !important; }
body #s360-drive-floating-root .s360-drive-filetype.is-ppt,
#s360-drive-floating-root .s360-drive-filetype.is-ppt { background: linear-gradient(135deg, #fb923c, #f43f5e) !important; }
body #s360-drive-floating-root .s360-drive-filetype.is-doc,
#s360-drive-floating-root .s360-drive-filetype.is-doc { background: linear-gradient(135deg, #3b82f6, #06b6d4) !important; }
body #s360-drive-floating-root .s360-drive-filetype.is-xls,
#s360-drive-floating-root .s360-drive-filetype.is-xls { background: linear-gradient(135deg, #10b981, #22c55e) !important; }
body #s360-drive-floating-root .s360-drive-filetype.is-image,
#s360-drive-floating-root .s360-drive-filetype.is-image { background: linear-gradient(135deg, #14b8a6, #8b5cf6) !important; }
body #s360-drive-floating-root .s360-drive-filetype.is-zip,
#s360-drive-floating-root .s360-drive-filetype.is-zip { background: linear-gradient(135deg, #f59e0b, #64748b) !important; }

body #s360-drive-floating-root .s360-drive-list,
#s360-drive-floating-root .s360-drive-list {
  border: 1px solid rgba(96, 165, 250, 0.2) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background: rgba(2, 6, 23, 0.32) !important;
}

body #s360-drive-floating-root .s360-drive-list-head,
#s360-drive-floating-root .s360-drive-list-head,
body #s360-drive-floating-root .s360-drive-file-row,
#s360-drive-floating-root .s360-drive-file-row {
  display: grid !important;
  grid-template-columns: minmax(210px, 1.7fr) minmax(120px, 0.8fr) minmax(145px, 0.9fr) 76px 104px !important;
  align-items: center !important;
  gap: 12px !important;
}

body #s360-drive-floating-root .s360-drive-list-head,
#s360-drive-floating-root .s360-drive-list-head {
  min-height: 42px !important;
  padding: 0 12px !important;
  color: #a9bad7 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  background: rgba(15, 23, 42, 0.66) !important;
}

body #s360-drive-floating-root .s360-drive-file-row,
#s360-drive-floating-root .s360-drive-file-row {
  min-height: 58px !important;
  padding: 8px 12px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.12) !important;
  color: #b9c8e6 !important;
  font-size: 12px !important;
}

body #s360-drive-floating-root .s360-drive-file-name,
#s360-drive-floating-root .s360-drive-file-name {
  min-width: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 !important;
  text-align: left !important;
}

body #s360-drive-floating-root .s360-drive-row-actions,
#s360-drive-floating-root .s360-drive-row-actions,
body #s360-drive-floating-root .s360-drive-grid-actions,
#s360-drive-floating-root .s360-drive-grid-actions {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

body #s360-drive-floating-root .s360-drive-row-actions button,
#s360-drive-floating-root .s360-drive-row-actions button,
body #s360-drive-floating-root .s360-drive-grid-actions button,
#s360-drive-floating-root .s360-drive-grid-actions button {
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(96, 165, 250, 0.22) !important;
  background: rgba(15, 23, 42, 0.72) !important;
  color: #cfe0ff !important;
  display: grid !important;
  place-items: center !important;
}

body #s360-drive-floating-root .s360-drive-grid-files,
#s360-drive-floating-root .s360-drive-grid-files {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)) !important;
  gap: 12px !important;
}

body #s360-drive-floating-root .s360-drive-grid-file,
#s360-drive-floating-root .s360-drive-grid-file {
  min-width: 0 !important;
  border: 1px solid rgba(96, 165, 250, 0.2) !important;
  border-radius: 14px !important;
  background: rgba(15, 23, 42, 0.54) !important;
  padding: 10px !important;
  display: grid !important;
  gap: 10px !important;
}

body #s360-drive-floating-root .s360-drive-grid-preview,
#s360-drive-floating-root .s360-drive-grid-preview,
body #s360-drive-floating-root .s360-drive-preview,
#s360-drive-floating-root .s360-drive-preview {
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 15% 20%, rgba(96, 165, 250, 0.32), transparent 30%),
    radial-gradient(circle at 82% 20%, rgba(236, 72, 153, 0.28), transparent 28%),
    linear-gradient(135deg, #101827, #28145a 58%, #0b1020) !important;
  color: #fff !important;
  min-height: 118px !important;
  display: grid !important;
  place-items: center !important;
  text-align: left !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  overflow: hidden !important;
}

body #s360-drive-floating-root .s360-drive-grid-meta,
#s360-drive-floating-root .s360-drive-grid-meta {
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
}

body #s360-drive-floating-root .s360-drive-details,
#s360-drive-floating-root .s360-drive-details {
  border-left: 1px solid rgba(148, 163, 184, 0.14) !important;
  padding: 16px !important;
  display: grid !important;
  align-content: start !important;
  gap: 14px !important;
}

body #s360-drive-floating-root .s360-drive-details-head,
#s360-drive-floating-root .s360-drive-details-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 10px !important;
}

body #s360-drive-floating-root .s360-drive-details-head strong,
#s360-drive-floating-root .s360-drive-details-head strong {
  color: #f8fbff !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  overflow-wrap: anywhere !important;
}

body #s360-drive-floating-root .s360-drive-details-head button,
#s360-drive-floating-root .s360-drive-details-head button {
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(96, 165, 250, 0.2) !important;
  background: rgba(15, 23, 42, 0.78) !important;
  color: #bcd0ed !important;
}

body #s360-drive-floating-root .s360-drive-detail-actions,
#s360-drive-floating-root .s360-drive-detail-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}

body #s360-drive-floating-root .s360-drive-detail-actions button,
#s360-drive-floating-root .s360-drive-detail-actions button {
  min-height: 34px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(139, 92, 246, 0.34) !important;
  background: rgba(15, 23, 42, 0.74) !important;
  color: #e5edff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

body #s360-drive-floating-root .s360-drive-detail-actions button.is-fav,
#s360-drive-floating-root .s360-drive-detail-actions button.is-fav {
  color: #fbbf24 !important;
  background: rgba(251, 191, 36, 0.12) !important;
}

body #s360-drive-floating-root .s360-drive-detail-list,
#s360-drive-floating-root .s360-drive-detail-list {
  display: grid !important;
  grid-template-columns: 86px minmax(0, 1fr) !important;
  gap: 9px 12px !important;
  margin: 0 !important;
  color: #a9bad7 !important;
  font-size: 12px !important;
}

body #s360-drive-floating-root .s360-drive-detail-list dt,
#s360-drive-floating-root .s360-drive-detail-list dt {
  color: #8497b8 !important;
}

body #s360-drive-floating-root .s360-drive-detail-list dd,
#s360-drive-floating-root .s360-drive-detail-list dd {
  margin: 0 !important;
  color: #dbe8ff !important;
  text-align: right !important;
  overflow-wrap: anywhere !important;
}

body #s360-drive-floating-root .s360-drive-permissions,
#s360-drive-floating-root .s360-drive-permissions {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #aec0dc !important;
}

body #s360-drive-floating-root .s360-drive-permissions span,
#s360-drive-floating-root .s360-drive-permissions span,
body #s360-drive-floating-root .s360-drive-permissions i,
#s360-drive-floating-root .s360-drive-permissions i {
  width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, #334155, #7c3aed) !important;
  color: #fff !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 900 !important;
}

body #s360-drive-floating-root .s360-drive-permissions b,
#s360-drive-floating-root .s360-drive-permissions b {
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

body #s360-drive-floating-root .s360-drive-activity,
#s360-drive-floating-root .s360-drive-activity {
  border-top: 1px solid rgba(148, 163, 184, 0.14) !important;
  padding-top: 12px !important;
}

body #s360-drive-floating-root .s360-drive-activity h4,
#s360-drive-floating-root .s360-drive-activity h4 {
  margin: 0 0 8px !important;
  color: #f8fbff !important;
  font-size: 13px !important;
}

body #s360-drive-floating-root .s360-drive-activity p,
#s360-drive-floating-root .s360-drive-activity p {
  margin: 0 0 8px !important;
  display: grid !important;
  gap: 2px !important;
  color: #c8d6ee !important;
  font-size: 12px !important;
}

body #s360-drive-floating-root .s360-drive-activity small,
#s360-drive-floating-root .s360-drive-activity small {
  color: #8295b6 !important;
}

body #s360-drive-floating-root .s360-drive-inline-alert,
#s360-drive-floating-root .s360-drive-inline-alert,
body #s360-drive-floating-root .s360-drive-empty-inline,
#s360-drive-floating-root .s360-drive-empty-inline,
body #s360-drive-floating-root .s360-drive-empty-state,
#s360-drive-floating-root .s360-drive-empty-state {
  border: 1px dashed rgba(96, 165, 250, 0.28) !important;
  border-radius: 14px !important;
  background: rgba(15, 23, 42, 0.48) !important;
  color: #aebfdb !important;
  padding: 16px !important;
}

body #s360-drive-floating-root .s360-drive-empty-state,
#s360-drive-floating-root .s360-drive-empty-state {
  min-height: 160px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 6px !important;
  text-align: center !important;
}

body #s360-drive-floating-root .s360-drive-empty-state strong,
#s360-drive-floating-root .s360-drive-empty-state strong {
  color: #f8fbff !important;
}

body #s360-drive-floating-root .s360-drive-skeleton-list,
#s360-drive-floating-root .s360-drive-skeleton-list {
  display: grid !important;
  gap: 10px !important;
}

body #s360-drive-floating-root .s360-drive-skeleton-list span,
#s360-drive-floating-root .s360-drive-skeleton-list span {
  height: 56px !important;
  border-radius: 12px !important;
  background: linear-gradient(90deg, rgba(15, 23, 42, 0.75), rgba(96, 165, 250, 0.16), rgba(15, 23, 42, 0.75)) !important;
  background-size: 220% 100% !important;
  animation: s360DriveSkeleton 1.2s linear infinite !important;
}

@keyframes s360DriveSkeleton {
  to { background-position: -220% 0; }
}

body #s360-drive-floating-root .s360-drive-floating-resize,
#s360-drive-floating-root .s360-drive-floating-resize {
  position: absolute !important;
  right: 4px !important;
  bottom: 4px !important;
  width: 16px !important;
  height: 16px !important;
  cursor: nwse-resize !important;
  border-right: 2px solid rgba(148, 163, 184, 0.52) !important;
  border-bottom: 2px solid rgba(148, 163, 184, 0.52) !important;
}

@media (max-width: 1180px) {
  body #s360-drive-floating-root .s360-drive-manager,
  #s360-drive-floating-root .s360-drive-manager {
    grid-template-columns: 220px minmax(360px, 1fr) !important;
  }

  body #s360-drive-floating-root .s360-drive-details,
  #s360-drive-floating-root .s360-drive-details {
    display: none !important;
  }

  body #s360-drive-floating-root .s360-drive-floating-toolbar,
  #s360-drive-floating-root .s360-drive-floating-toolbar {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  body #s360-drive-floating-root [data-drive-popup-window],
  #s360-drive-floating-root [data-drive-popup-window] {
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    border-radius: 0 !important;
  }

  body #s360-drive-floating-root .s360-drive-manager,
  #s360-drive-floating-root .s360-drive-manager {
    grid-template-columns: 1fr !important;
  }

  body #s360-drive-floating-root .s360-drive-sidebar,
  #s360-drive-floating-root .s360-drive-sidebar {
    display: none !important;
  }

  body #s360-drive-floating-root .s360-drive-folders,
  #s360-drive-floating-root .s360-drive-folders {
    grid-template-columns: 1fr 1fr !important;
  }

  body #s360-drive-floating-root .s360-drive-list-head,
  #s360-drive-floating-root .s360-drive-list-head {
    display: none !important;
  }

  body #s360-drive-floating-root .s360-drive-file-row,
  #s360-drive-floating-root .s360-drive-file-row {
    grid-template-columns: 1fr auto !important;
  }

  body #s360-drive-floating-root .s360-drive-file-row > span:not(.s360-drive-row-actions),
  #s360-drive-floating-root .s360-drive-file-row > span:not(.s360-drive-row-actions) {
    display: none !important;
  }
}

/* ===== Chat Hub final cascade override ===== */
body .s360-chat-layer .s360-chat-window,
#system360-app .s360-chat-layer .s360-chat-window {
  background:
    radial-gradient(circle at 18% -8%, rgba(56, 130, 246, 0.22), transparent 30%),
    radial-gradient(circle at 88% 0%, rgba(236, 72, 153, 0.14), transparent 29%),
    linear-gradient(145deg, #0b0b0f 0%, #0d1320 48%, #080a12 100%) !important;
  border-color: rgba(88, 122, 189, 0.34) !important;
  border-radius: 18px !important;
}

body .s360-chat-layer .s360-chat-window.is-launcher,
#system360-app .s360-chat-layer .s360-chat-window.is-launcher {
  min-width: min(1180px, calc(100vw - 32px)) !important;
  min-height: min(700px, calc(100vh - 70px)) !important;
}

body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
#system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
  grid-template-columns: 304px minmax(420px, 1fr) 296px !important;
  gap: 14px !important;
  padding: 14px 16px 16px !important;
  background: #0b0b0f !important;
}

body .s360-chat-layer .s360-chat-window-directory,
body .s360-chat-layer .s360-chat-window-main,
body .s360-chat-layer .s360-chat-launcher-info,
#system360-app .s360-chat-layer .s360-chat-window-directory,
#system360-app .s360-chat-layer .s360-chat-window-main,
#system360-app .s360-chat-layer .s360-chat-launcher-info {
  border-radius: 18px !important;
  background: linear-gradient(180deg, #151821 0%, #10131c 100%) !important;
}

body .s360-chat-layer .s360-chat-bubble,
#system360-app .s360-chat-layer .s360-chat-bubble {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  gap: 10px !important;
  max-width: 82% !important;
  margin: 12px 0 !important;
}

body .s360-chat-layer .s360-chat-bubble.is-mine,
#system360-app .s360-chat-layer .s360-chat-bubble.is-mine {
  margin-left: auto !important;
}

body .s360-chat-layer .s360-chat-bubble-card,
#system360-app .s360-chat-layer .s360-chat-bubble-card {
  position: relative !important;
  padding: 12px 13px !important;
  border: 1px solid rgba(96, 165, 250, 0.14) !important;
  border-radius: 16px !important;
  background: #1c1f2a !important;
}

body .s360-chat-layer .s360-chat-bubble.is-mine .s360-chat-bubble-card,
#system360-app .s360-chat-layer .s360-chat-bubble.is-mine .s360-chat-bubble-card {
  background: linear-gradient(135deg, rgba(56, 98, 246, 0.34), rgba(136, 92, 246, 0.28) 58%, rgba(236, 72, 153, 0.24)) !important;
}

body .s360-chat-layer .s360-chat-bubble-avatar,
#system360-app .s360-chat-layer .s360-chat-bubble-avatar {
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 13px !important;
  background: #1c1f2a !important;
  color: #dce8ff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

body .s360-chat-layer .s360-chat-bubble-actions,
#system360-app .s360-chat-layer .s360-chat-bubble-actions {
  display: flex !important;
  gap: 5px !important;
  margin-top: 9px !important;
  opacity: 0 !important;
  transform: translateY(4px) !important;
  transition: opacity 180ms ease, transform 180ms ease !important;
}

body .s360-chat-layer .s360-chat-bubble:hover .s360-chat-bubble-actions,
#system360-app .s360-chat-layer .s360-chat-bubble:hover .s360-chat-bubble-actions {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

body .s360-chat-layer .s360-chat-user-status,
#system360-app .s360-chat-layer .s360-chat-user-status,
body .s360-chat-layer .s360-chat-info-section,
#system360-app .s360-chat-layer .s360-chat-info-section,
body .s360-chat-layer .s360-chat-active-search,
#system360-app .s360-chat-layer .s360-chat-active-search {
  border-radius: 16px !important;
  background: #151821 !important;
  border: 1px solid rgba(96, 165, 250, 0.14) !important;
}

body .s360-chat-layer .s360-chat-window,
body .s360-chat-layer .s360-chat-window *,
#system360-app .s360-chat-layer .s360-chat-window,
#system360-app .s360-chat-layer .s360-chat-window * {
  pointer-events: auto !important;
}

body .s360-chat-layer .s360-chat-active,
#system360-app .s360-chat-layer .s360-chat-active {
  min-height: 0 !important;
  overflow: hidden !important;
  position: relative !important;
}

body .s360-chat-layer .s360-chat-window-messages,
#system360-app .s360-chat-layer .s360-chat-window-messages {
  min-height: 0 !important;
}

body .s360-chat-layer .s360-chat-launcher-composer,
#system360-app .s360-chat-layer .s360-chat-launcher-composer {
  position: relative !important;
  z-index: 6 !important;
  display: grid !important;
  grid-template-columns: 38px 38px 38px 38px minmax(160px, 1fr) 54px !important;
  align-items: center !important;
}

body .s360-chat-layer .s360-chat-launcher-composer .s360-input[data-chat-draft-input],
#system360-app .s360-chat-layer .s360-chat-launcher-composer .s360-input[data-chat-draft-input] {
  grid-column: 5 !important;
  min-width: 0 !important;
  width: 100% !important;
  pointer-events: auto !important;
  user-select: text !important;
  -webkit-user-select: text !important;
  cursor: text !important;
}

body .s360-chat-layer .s360-chat-launcher-composer [data-chat-send],
#system360-app .s360-chat-layer .s360-chat-launcher-composer [data-chat-send] {
  grid-column: 6 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

body .s360-chat-layer .s360-chat-launcher-composer [data-chat-attach],
#system360-app .s360-chat-layer .s360-chat-launcher-composer [data-chat-attach] {
  grid-column: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

body .s360-chat-layer .s360-chat-file-input,
#system360-app .s360-chat-layer .s360-chat-file-input {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 1100px) {
  body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
    grid-template-columns: 292px minmax(0, 1fr) !important;
  }
}

/* Mi horario: dark premium cohesion for synced subsections */
#system360-app .s360-time-content {
  color: #eaf1ff !important;
}

#system360-app .s360-time-content :is(.s360-panel, .s360-time-kpi-sync-panel, .s360-time-productivity-sync, .s360-time-weekly-sync, .s360-time-efficiency-sync, .s360-time-alert-sync) {
  border: 1px solid rgba(73, 105, 168, .62) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(59, 130, 246, .11), transparent 34%),
    radial-gradient(circle at 88% 8%, rgba(139, 92, 246, .10), transparent 30%),
    linear-gradient(180deg, rgba(12, 22, 43, .94), rgba(6, 13, 28, .96)) !important;
  color: #eaf1ff !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

#system360-app .s360-time-content :is(.s360-panel-headline, .s360-cal-head) h3,
#system360-app .s360-time-content .s360-panel > h3 {
  color: #f8fbff !important;
  letter-spacing: -.025em !important;
}

#system360-app .s360-time-content :is(.s360-muted, small, p) {
  color: #aebfe4 !important;
}

#system360-app .s360-time-content .s360-card,
#system360-app .s360-time-content .s360-kpi-smart-card,
#system360-app .s360-time-content :is(.s360-prod-check-item, .s360-prod-reco-item, .s360-eff-queue-item, .s360-weekly-heat, .s360-cal-day, .s360-timeline-item) {
  border: 1px solid rgba(83, 118, 185, .48) !important;
  border-radius: 16px !important;
  background:
    linear-gradient(145deg, rgba(18, 30, 57, .82), rgba(7, 14, 30, .88)),
    radial-gradient(circle at 0 0, rgba(56, 130, 246, .12), transparent 44%) !important;
  color: #eef5ff !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

#system360-app .s360-time-content .s360-card .k,
#system360-app .s360-time-content .s360-prod-check-head strong,
#system360-app .s360-time-content .s360-prod-reco-item strong,
#system360-app .s360-time-content .s360-eff-queue-head strong,
#system360-app .s360-time-content .s360-weekly-heat strong,
#system360-app .s360-time-content .s360-timeline-item strong {
  color: #d9e7ff !important;
}

#system360-app .s360-time-content .s360-card .v,
#system360-app .s360-time-content .s360-weekly-heat b,
#system360-app .s360-time-content .s360-prod-check-head span {
  color: #ffffff !important;
}

#system360-app .s360-time-content .s360-prod-checklist {
  display: grid !important;
  gap: 12px !important;
}

#system360-app .s360-time-content .s360-prod-check-item {
  padding: 15px 16px !important;
}

#system360-app .s360-time-content .s360-prod-check-item.is-done {
  border-color: rgba(34, 197, 94, .45) !important;
  background:
    radial-gradient(circle at 0 0, rgba(34, 197, 94, .16), transparent 44%),
    linear-gradient(145deg, rgba(13, 44, 36, .82), rgba(7, 18, 28, .9)) !important;
}

#system360-app .s360-time-content .s360-prod-check-head,
#system360-app .s360-time-content .s360-prod-check-foot,
#system360-app .s360-time-content .s360-eff-queue-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

#system360-app .s360-time-content .s360-prod-check-foot {
  margin-top: 10px !important;
}

#system360-app .s360-time-content .s360-chart-track {
  height: 8px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: rgba(88, 107, 145, .56) !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .34) !important;
}

#system360-app .s360-time-content .s360-chart-track :is(i, .s360-progress-fill) {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, #3b82f6, #8b5cf6, #ec4899) !important;
  box-shadow: 0 0 18px rgba(59, 130, 246, .4) !important;
}

#system360-app .s360-time-content .s360-progress-fill.is-secondary {
  background: linear-gradient(90deg, #22c55e, #38bdf8) !important;
}

#system360-app .s360-time-content .s360-progress-fill.is-neutral {
  background: linear-gradient(90deg, #3b82f6, #8b5cf6) !important;
}

#system360-app .s360-time-content .s360-prod-reco-list,
#system360-app .s360-time-content .s360-alert-list,
#system360-app .s360-time-content .s360-eff-queue-list {
  display: grid !important;
  gap: 10px !important;
}

#system360-app .s360-time-content .s360-prod-reco-item,
#system360-app .s360-time-content .s360-eff-queue-item {
  padding: 13px 14px !important;
}

#system360-app .s360-time-content .s360-weekly-heatmap {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)) !important;
  gap: 10px !important;
  margin-top: 10px !important;
}

#system360-app .s360-time-content .s360-weekly-heat {
  padding: 12px !important;
  text-align: center !important;
}

#system360-app .s360-time-content .s360-weekly-heat.is-good {
  border-color: rgba(34, 197, 94, .4) !important;
}

#system360-app .s360-time-content .s360-weekly-heat.is-bad {
  border-color: rgba(244, 63, 94, .42) !important;
}

#system360-app .s360-time-content :is(.s360-alert.ok, .s360-alert.warn, .s360-alert.danger) {
  border-radius: 14px !important;
  color: #edf5ff !important;
  background: rgba(13, 23, 43, .78) !important;
}

#system360-app .s360-time-content .s360-alert.ok {
  border-color: rgba(34, 197, 94, .42) !important;
}

#system360-app .s360-time-content .s360-alert.warn {
  border-color: rgba(245, 158, 11, .44) !important;
}

#system360-app .s360-time-content .s360-alert.danger {
  border-color: rgba(244, 63, 94, .46) !important;
}

#system360-app .s360-time-content :is(.s360-table, table) {
  color: #eaf1ff !important;
}

#system360-app .s360-time-content :is(.s360-table th, table th) {
  background: rgba(14, 26, 50, .95) !important;
  color: #bcd0f4 !important;
}

#system360-app .s360-time-content :is(.s360-table td, table td) {
  border-color: rgba(83, 118, 185, .25) !important;
  color: #d9e7ff !important;
}

#system360-app .s360-time-content .s360-seguimientos-wrap {
  border-color: rgba(83, 118, 185, .42) !important;
  background: rgba(5, 12, 26, .58) !important;
}

@media (max-width: 760px) {
  #system360-app .s360-time-content .s360-prod-check-head,
  #system360-app .s360-time-content .s360-prod-check-foot,
  #system360-app .s360-time-content .s360-eff-queue-head {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  #system360-app .s360-time-content .s360-prod-check-foot .s360-btn {
    width: 100% !important;
  }
}

@media (max-width: 760px) {
  body .s360-chat-layer .s360-chat-window.is-launcher,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher {
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-width: 0 !important;
    min-height: 0 !important;
    border-radius: 0 !important;
  }

  body .s360-chat-layer .s360-chat-window-nav,
  #system360-app .s360-chat-layer .s360-chat-window-nav,
  body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
    grid-template-columns: 1fr !important;
  }
}

/* Chat hub final compact overrides */
body .s360-chat-layer .s360-chat-window,
#system360-app .s360-chat-layer .s360-chat-window {
  font-size: 12px !important;
}

body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
#system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr) minmax(190px, 240px) !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body .s360-chat-layer .s360-chat-window-head,
#system360-app .s360-chat-layer .s360-chat-window-head {
  padding: 10px 12px !important;
}

body .s360-chat-layer .s360-chat-window-head-main,
#system360-app .s360-chat-layer .s360-chat-window-head-main,
body .s360-chat-layer .s360-chat-preview-head > div,
#system360-app .s360-chat-layer .s360-chat-preview-head > div,
body .s360-chat-layer .s360-chat-info-card,
#system360-app .s360-chat-layer .s360-chat-info-card {
  min-width: 0 !important;
}

body .s360-chat-layer .s360-chat-window-head-main strong,
#system360-app .s360-chat-layer .s360-chat-window-head-main strong {
  display: block !important;
  font-size: 14px !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body .s360-chat-layer .s360-chat-window-head-main small,
#system360-app .s360-chat-layer .s360-chat-window-head-main small,
body .s360-chat-layer .s360-chat-preview-head small,
#system360-app .s360-chat-layer .s360-chat-preview-head small,
body .s360-chat-layer .s360-chat-info-card small,
#system360-app .s360-chat-layer .s360-chat-info-card small {
  display: block !important;
  font-size: 10.5px !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body .s360-chat-layer .s360-chat-directory-item,
#system360-app .s360-chat-layer .s360-chat-directory-item {
  min-height: 44px !important;
  padding: 6px 7px !important;
  grid-template-columns: 28px minmax(0, 1fr) auto !important;
  gap: 7px !important;
}

body .s360-chat-layer .s360-chat-directory-main strong,
#system360-app .s360-chat-layer .s360-chat-directory-main strong {
  font-size: 11.5px !important;
  line-height: 1.15 !important;
}

body .s360-chat-layer .s360-chat-directory-main small,
#system360-app .s360-chat-layer .s360-chat-directory-main small {
  font-size: 10px !important;
  line-height: 1.2 !important;
}

body .s360-chat-layer .s360-chat-active,
#system360-app .s360-chat-layer .s360-chat-active {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto !important;
}

body .s360-chat-layer .s360-chat-active > .s360-chat-window-messages,
#system360-app .s360-chat-layer .s360-chat-active > .s360-chat-window-messages {
  overflow-y: auto !important;
  padding: 8px 10px !important;
}

body .s360-chat-layer .s360-chat-bubble,
#system360-app .s360-chat-layer .s360-chat-bubble {
  grid-template-columns: 30px minmax(0, 1fr) !important;
  gap: 8px !important;
  max-width: min(88%, 620px) !important;
  margin: 8px 0 !important;
}

body .s360-chat-layer .s360-chat-bubble-avatar,
#system360-app .s360-chat-layer .s360-chat-bubble-avatar {
  width: 30px !important;
  height: 30px !important;
  border-radius: 10px !important;
  font-size: 10px !important;
}

body .s360-chat-layer .s360-chat-bubble-card,
#system360-app .s360-chat-layer .s360-chat-bubble-card {
  min-width: 0 !important;
  padding: 9px 10px !important;
}

body .s360-chat-layer .s360-chat-bubble-body,
#system360-app .s360-chat-layer .s360-chat-bubble-body,
body .s360-chat-layer .s360-chat-bubble-body p,
#system360-app .s360-chat-layer .s360-chat-bubble-body p {
  font-size: 12px !important;
  line-height: 1.38 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

body .s360-chat-layer .s360-chat-launcher-composer,
#system360-app .s360-chat-layer .s360-chat-launcher-composer,
body .s360-chat-layer .s360-chat-window-input,
#system360-app .s360-chat-layer .s360-chat-window-input {
  grid-template-columns: 34px minmax(0, 1fr) 42px !important;
  gap: 7px !important;
  padding: 8px !important;
}

body .s360-chat-layer .s360-chat-launcher-composer [data-chat-attach],
#system360-app .s360-chat-layer .s360-chat-launcher-composer [data-chat-attach] {
  grid-column: 1 !important;
}

body .s360-chat-layer .s360-chat-launcher-composer .s360-input[data-chat-draft-input],
#system360-app .s360-chat-layer .s360-chat-launcher-composer .s360-input[data-chat-draft-input] {
  grid-column: 2 !important;
  min-height: 34px !important;
  height: 34px !important;
  font-size: 12px !important;
}

body .s360-chat-layer .s360-chat-launcher-composer [data-chat-send],
#system360-app .s360-chat-layer .s360-chat-launcher-composer [data-chat-send] {
  grid-column: 3 !important;
  min-width: 0 !important;
  width: 42px !important;
  padding: 0 !important;
}

body .s360-chat-layer .s360-chat-send-btn .s360-svg-icon,
#system360-app .s360-chat-layer .s360-chat-send-btn .s360-svg-icon {
  margin: 0 !important;
}

body .s360-chat-layer .s360-chat-client-chip,
#system360-app .s360-chat-layer .s360-chat-client-chip {
  max-width: 100% !important;
  font-size: 10.5px !important;
  overflow-wrap: anywhere !important;
}

@media (max-width: 1180px) {
  body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
    grid-template-columns: minmax(205px, 280px) minmax(0, 1fr) !important;
  }

  body .s360-chat-layer .s360-chat-launcher-info,
  #system360-app .s360-chat-layer .s360-chat-launcher-info {
    display: none !important;
  }
}

@media (max-width: 760px) {
  body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  body .s360-chat-layer .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window-body {
    grid-template-columns: 1fr !important;
    grid-template-rows: minmax(132px, 32vh) minmax(0, 1fr) !important;
  }

  body .s360-chat-layer .s360-chat-window-directory,
  #system360-app .s360-chat-layer .s360-chat-window-directory {
    max-height: 32vh !important;
  }
}

/* Chat interno: estructura final antiencimado */
body .s360-chat-layer .s360-chat-window.is-launcher,
#system360-app .s360-chat-layer .s360-chat-window.is-launcher {
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100vh - 24px) !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
}

body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
#system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
  min-height: 0 !important;
  overflow: hidden !important;
}

body .s360-chat-layer .s360-chat-window-main,
#system360-app .s360-chat-layer .s360-chat-window-main {
  min-height: 0 !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  overflow: hidden !important;
}

body .s360-chat-layer .s360-chat-launcher-panel,
#system360-app .s360-chat-layer .s360-chat-launcher-panel {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

body .s360-chat-layer .s360-chat-launcher-panel > .s360-chat-active,
#system360-app .s360-chat-layer .s360-chat-launcher-panel > .s360-chat-active {
  height: 100% !important;
  min-height: 0 !important;
}

body .s360-chat-layer .s360-chat-launcher-foot,
#system360-app .s360-chat-layer .s360-chat-launcher-foot {
  min-height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 6px 10px !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
}

body .s360-chat-layer .s360-chat-launcher-foot span,
#system360-app .s360-chat-layer .s360-chat-launcher-foot span {
  display: block !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body .s360-chat-layer .s360-chat-active,
#system360-app .s360-chat-layer .s360-chat-active {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto !important;
  gap: 8px !important;
  padding: 12px !important;
  overflow: hidden !important;
}

body .s360-chat-layer .s360-chat-active-pinned-slot,
#system360-app .s360-chat-layer .s360-chat-active-pinned-slot {
  min-height: 0 !important;
  overflow: hidden !important;
}

body .s360-chat-layer .s360-chat-active-pinned-slot.is-empty,
#system360-app .s360-chat-layer .s360-chat-active-pinned-slot.is-empty {
  height: 0 !important;
}

body .s360-chat-layer .s360-chat-active > .s360-chat-window-messages,
#system360-app .s360-chat-layer .s360-chat-active > .s360-chat-window-messages {
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 8px 10px !important;
}

body .s360-chat-layer .s360-chat-active-search,
#system360-app .s360-chat-layer .s360-chat-active-search {
  min-height: 42px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 116px 42px !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px !important;
  border-radius: 8px !important;
}

body .s360-chat-layer .s360-chat-active-search .s360-input,
#system360-app .s360-chat-layer .s360-chat-active-search .s360-input,
body .s360-chat-layer .s360-chat-active-search > button,
#system360-app .s360-chat-layer .s360-chat-active-search > button {
  height: 34px !important;
  min-height: 34px !important;
  font-size: 12px !important;
}

body .s360-chat-layer .s360-chat-launcher-composer,
#system360-app .s360-chat-layer .s360-chat-launcher-composer {
  min-height: 48px !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 42px !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 6px !important;
  border-radius: 8px !important;
}

body .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-client-chip-row,
body .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-mention-list,
body .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-upload-state,
#system360-app .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-client-chip-row,
#system360-app .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-mention-list,
#system360-app .s360-chat-layer .s360-chat-launcher-composer > .s360-chat-upload-state {
  grid-column: 1 / -1 !important;
}

body .s360-chat-layer .s360-chat-launcher-composer [data-chat-attach],
#system360-app .s360-chat-layer .s360-chat-launcher-composer [data-chat-attach] {
  grid-column: 1 !important;
  width: 34px !important;
  height: 34px !important;
}

body .s360-chat-layer .s360-chat-launcher-composer .s360-input[data-chat-draft-input],
#system360-app .s360-chat-layer .s360-chat-launcher-composer .s360-input[data-chat-draft-input] {
  grid-column: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 34px !important;
  min-height: 34px !important;
  font-size: 12px !important;
}

body .s360-chat-layer .s360-chat-launcher-composer [data-chat-send],
#system360-app .s360-chat-layer .s360-chat-launcher-composer [data-chat-send] {
  grid-column: 3 !important;
  width: 42px !important;
  height: 34px !important;
  min-height: 34px !important;
}

@media (max-width: 980px) {
  body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
    grid-template-columns: minmax(190px, 250px) minmax(0, 1fr) !important;
  }

  body .s360-chat-layer .s360-chat-active-search,
  #system360-app .s360-chat-layer .s360-chat-active-search {
    grid-template-columns: minmax(0, 1fr) 92px 38px !important;
  }
}

@media (max-width: 760px) {
  body .s360-chat-layer .s360-chat-window.is-launcher,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher {
    max-width: 100vw !important;
    max-height: 100vh !important;
  }

  body .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body,
  #system360-app .s360-chat-layer .s360-chat-window.is-launcher .s360-chat-window-body {
    grid-template-rows: minmax(116px, 28vh) minmax(0, 1fr) !important;
  }

  body .s360-chat-layer .s360-chat-active-search,
  #system360-app .s360-chat-layer .s360-chat-active-search {
    grid-template-columns: minmax(0, 1fr) 38px !important;
  }

  body .s360-chat-layer .s360-chat-active-search select,
  #system360-app .s360-chat-layer .s360-chat-active-search select {
    display: none !important;
  }
}

/* Inicio: override final para quitar paneles blancos del centro de alertas */
#system360-app .s360-app.s360-app-system .s360-alert-center-overview,
#system360-app .s360-app.s360-app-system .s360-alert-rules-panel,
#system360-app .s360-app.s360-app-system .s360-alert-center-list {
  border-color: rgba(73, 105, 171, 0.58) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(59, 130, 246, 0.13), transparent 34%),
    radial-gradient(circle at 92% 0%, rgba(139, 92, 246, 0.12), transparent 32%),
    linear-gradient(180deg, rgba(8, 18, 39, 0.96), rgba(5, 12, 27, 0.98)) !important;
  color: #eaf2ff !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis {
  border: 1px solid rgba(89, 121, 191, 0.62) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(34, 197, 94, 0.10), transparent 38%),
    linear-gradient(180deg, rgba(10, 25, 48, 0.96), rgba(6, 16, 34, 0.98)) !important;
  color: #dce8ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 12px 22px rgba(1, 8, 20, 0.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis h4,
#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis p strong,
#system360-app .s360-app.s360-app-system .s360-alert-center-kpis .s360-card .v {
  color: #f5f8ff !important;
  -webkit-text-fill-color: #f5f8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-diagnosis p,
#system360-app .s360-app.s360-app-system .s360-alert-center-kpis .s360-card .k {
  color: #b9c9eb !important;
  -webkit-text-fill-color: #b9c9eb !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-kpis .s360-card {
  border-color: rgba(87, 116, 182, 0.58) !important;
  background: linear-gradient(180deg, rgba(12, 23, 48, 0.94), rgba(7, 15, 34, 0.98)) !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-reco-list .s360-alert.ok {
  border: 1px solid rgba(34, 197, 94, 0.36) !important;
  border-left: 3px solid rgba(48, 231, 139, 0.88) !important;
  background: linear-gradient(90deg, rgba(10, 84, 56, 0.72), rgba(8, 46, 42, 0.88)) !important;
  color: #d7ffed !important;
  -webkit-text-fill-color: #d7ffed !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-tabs {
  border: 1px solid rgba(73, 105, 171, 0.54) !important;
  border-radius: 12px !important;
  background: rgba(4, 12, 29, 0.76) !important;
  padding: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-tabs .s360-btn {
  border-color: rgba(92, 123, 190, 0.62) !important;
  background: linear-gradient(180deg, rgba(12, 23, 48, 0.9), rgba(7, 15, 34, 0.96)) !important;
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-alert-center-tabs .s360-btn.is-active {
  border-color: rgba(163, 112, 255, 0.88) !important;
  background: linear-gradient(135deg, rgba(79, 63, 232, 0.72), rgba(146, 70, 225, 0.64)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
/* Inicio: appended final right sidebar guard */
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar {
  box-sizing: border-box !important;
  position: sticky !important;
  top: 0 !important;
  align-self: start !important;
  height: auto !important;
  max-height: calc(100dvh - 36px) !important;
  gap: 14px !important;
  padding: 0 0 18px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  scrollbar-gutter: stable !important;
}

#system360-app .s360-app.s360-app-system .s360-home-layout-shell {
  grid-template-columns: minmax(0, 1fr) 320px !important;
  gap: 18px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
  grid-template-columns: minmax(0, 1fr) 92px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card,
#system360-app .s360-app.s360-app-system .s360-home-sidebar-card.s360-home-calendar-card {
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  border: 1px solid rgba(73, 105, 171, 0.62) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(56, 102, 214, 0.16), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 39, 0.96), rgba(5, 12, 27, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 14px 28px rgba(1, 8, 20, 0.36) !important;
  padding: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card-head,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-card .s360-panel-headline h3,
#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline h3 {
  margin: 0 !important;
  color: #f1f6ff !important;
  -webkit-text-fill-color: #f1f6ff !important;
  font-size: 16px !important;
  line-height: 1.15 !important;
  font-weight: 780 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-home-sidebar-toggle,
#system360-app .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed .s360-home-sidebar-toggle {
  width: auto !important;
  min-width: 62px !important;
  height: 32px !important;
  min-height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(72, 98, 156, 0.68) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(30, 45, 82, 0.96), rgba(21, 33, 65, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 8px 18px rgba(1, 8, 20, 0.28) !important;
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  padding: 0 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed .s360-home-sidebar-toggle {
  min-width: 74px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-nav .s360-home-cal-nav-btn {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  border-radius: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-month {
  margin: 0 0 10px !important;
  padding-left: 0 !important;
  color: #f1f6ff !important;
  -webkit-text-fill-color: #f1f6ff !important;
  font-size: 13px !important;
  line-height: 1.15 !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

@media (max-width: 1100px) {
  #system360-app .s360-app.s360-app-system .s360-home-layout-shell,
  #system360-app .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-app.s360-app-system .s360-home-right-sidebar {
    grid-template-columns: 1fr !important;
    position: static !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* Inicio: final correction for fixed right sidebar height */
@media (min-width: 1101px) {
  #system360-app .s360-app.s360-app-system .s360-home-right-sidebar {
    position: sticky !important;
    top: 0 !important;
    height: auto !important;
    max-height: calc(100dvh - 120px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding-bottom: 18px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-home-sidebar-card,
  #system360-app .s360-app.s360-app-system .s360-home-sidebar-card.s360-home-calendar-card {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* Mis ventas: evitar corte de las columnas finales */
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-sales-table-wrap {
  box-sizing: border-box !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding-right: 40px !important;
  padding-bottom: 14px !important;
  scrollbar-gutter: stable both-edges !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-sales-table-wrap > .s360-table-sales {
  table-layout: fixed !important;
  width: max-content !important;
  min-width: 3040px !important;
  max-width: none !important;
  margin-right: 40px !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales th:nth-last-child(2),
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td:nth-last-child(2) {
  width: 180px !important;
  min-width: 180px !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales th:last-child,
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales td:last-child {
  width: 260px !important;
  min-width: 260px !important;
  max-width: 260px !important;
  padding-right: 28px !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales .s360-sale-actions {
  width: max-content !important;
  min-width: 164px !important;
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 8px !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-table-sales .s360-sale-icon-btn {
  flex: 0 0 34px !important;
}
/* Bases DB360: override final para mantener controles en una sola hilera */
#system360-app .s360-db360-toolbar {
  display: flex !important;
  align-items: flex-end !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 10px 12px !important;
  scrollbar-gutter: stable !important;
}

#system360-app .s360-db360-toolbar-main,
#system360-app .s360-db360-toolbar-bulk {
  display: contents !important;
}

#system360-app .s360-db360-toolbar-main > label {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

#system360-app .s360-db360-toolbar-main > label:nth-child(1) {
  flex-basis: 360px !important;
  width: 360px !important;
  max-width: 360px !important;
}

#system360-app .s360-db360-toolbar-main > label:nth-child(2) {
  width: 112px !important;
}

#system360-app .s360-db360-toolbar-main > label:nth-child(3) {
  width: 160px !important;
}

#system360-app .s360-db360-toolbar-main > label :is(.s360-input, .s360-select) {
  width: 100% !important;
  height: 38px !important;
}

#system360-app .s360-db360-view-switch {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  height: 38px !important;
}

#system360-app .s360-db360-actions,
#system360-app .s360-db360-toolbar-bulk {
  flex: 0 0 auto !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  align-items: center !important;
  width: auto !important;
}

#system360-app .s360-db360-actions {
  display: inline-flex !important;
}

#system360-app .s360-db360-toolbar-bulk > span {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 6px !important;
  white-space: nowrap !important;
  font-size: 14px !important;
  line-height: 34px !important;
}

#system360-app .s360-db360-actions .s360-btn,
#system360-app .s360-db360-toolbar-bulk .s360-btn {
  flex: 0 0 auto !important;
  height: 34px !important;
  min-height: 34px !important;
  white-space: nowrap !important;
}
/* Bases DB360: toolbar estilo panel de filtros, dos filas funcionales */
#system360-app .s360-db360-toolbar {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
  margin: 10px 0 14px !important;
  padding: 20px 24px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(64, 105, 178, 0.68) !important;
  background: linear-gradient(180deg, rgba(9, 22, 45, 0.96), rgba(6, 16, 34, 0.96)) !important;
  box-shadow: inset 0 1px 0 rgba(162, 192, 255, 0.06), 0 18px 34px rgba(0, 5, 18, 0.28) !important;
  overflow: visible !important;
}

#system360-app .s360-db360-toolbar-main {
  display: grid !important;
  grid-template-columns: minmax(260px, 380px) 224px minmax(220px, 240px) auto !important;
  align-items: end !important;
  gap: 22px !important;
  min-width: 0 !important;
}

#system360-app .s360-db360-toolbar-filters {
  display: grid !important;
  grid-template-columns: auto minmax(150px, 180px) minmax(160px, 200px) minmax(170px, 220px) minmax(170px, 190px) 1fr auto auto auto auto !important;
  align-items: center !important;
  gap: 12px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(58, 89, 145, 0.38) !important;
  min-width: 0 !important;
}

#system360-app .s360-db360-field {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
  width: 100% !important;
}

#system360-app .s360-db360-field > span:first-child {
  color: #e5ecff !important;
  -webkit-text-fill-color: #e5ecff !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

#system360-app .s360-db360-input-icon {
  position: relative !important;
  display: block !important;
}

#system360-app .s360-db360-input-icon .s360-svg-icon {
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  width: 18px !important;
  height: 18px !important;
  transform: translateY(-50%) !important;
  color: #dbe8ff !important;
  opacity: 0.95 !important;
  pointer-events: none !important;
}

#system360-app .s360-db360-input-icon .s360-input {
  width: 100% !important;
  height: 42px !important;
  padding-left: 42px !important;
}

#system360-app .s360-db360-toolbar :is(.s360-input, .s360-select) {
  height: 42px !important;
  border-radius: 9px !important;
  border-color: rgba(82, 119, 190, 0.68) !important;
  background-color: rgba(8, 18, 38, 0.9) !important;
  color: #e9f1ff !important;
  -webkit-text-fill-color: #e9f1ff !important;
}

#system360-app .s360-db360-view-switch {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  height: 42px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(82, 119, 190, 0.68) !important;
  background: rgba(8, 18, 38, 0.84) !important;
  overflow: hidden !important;
}

#system360-app .s360-db360-view-switch button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 100% !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #dbe8ff !important;
  -webkit-text-fill-color: #dbe8ff !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

#system360-app .s360-db360-view-switch button.active {
  background: linear-gradient(135deg, #6e68ff, #592fd5) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(91, 61, 229, 0.34) !important;
}

#system360-app .s360-db360-toolbar .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 17px !important;
  stroke-width: 2.25 !important;
}

#system360-app .s360-db360-actions {
  display: inline-flex !important;
  align-items: end !important;
  justify-content: flex-start !important;
  gap: 20px !important;
  flex-wrap: nowrap !important;
  width: auto !important;
  min-width: max-content !important;
}

#system360-app .s360-db360-toolbar .s360-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 18px !important;
  border-radius: 9px !important;
  white-space: nowrap !important;
}

#system360-app .s360-db360-filter-btn {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 42px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(91, 126, 198, 0.7) !important;
  border-radius: 9px !important;
  background: rgba(13, 25, 49, 0.9) !important;
  color: #f0f5ff !important;
  -webkit-text-fill-color: #f0f5ff !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

#system360-app .s360-db360-filter-btn.is-active {
  border-color: rgba(122, 85, 255, 0.92) !important;
  box-shadow: 0 0 0 1px rgba(122, 85, 255, 0.28), 0 12px 22px rgba(91, 61, 229, 0.2) !important;
}

#system360-app .s360-db360-filter-btn b {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  border-radius: 999px !important;
  background: #8b5cf6 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: 10px !important;
  line-height: 1 !important;
}

#system360-app .s360-db360-filter-select {
  display: block !important;
  min-width: 0 !important;
}

#system360-app .s360-db360-filter-select .s360-select {
  width: 100% !important;
}

#system360-app .s360-db360-date-menu {
  position: relative !important;
  min-width: 0 !important;
}

#system360-app .s360-db360-date-menu summary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  width: 100% !important;
  height: 42px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(82, 119, 190, 0.68) !important;
  border-radius: 9px !important;
  background: rgba(8, 18, 38, 0.9) !important;
  color: #e9f1ff !important;
  -webkit-text-fill-color: #e9f1ff !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  list-style: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

#system360-app .s360-db360-date-menu summary::-webkit-details-marker {
  display: none !important;
}

#system360-app .s360-db360-date-menu > div {
  position: absolute !important;
  z-index: 30 !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  display: grid !important;
  gap: 10px !important;
  min-width: 250px !important;
  padding: 12px !important;
  border: 1px solid rgba(82, 119, 190, 0.68) !important;
  border-radius: 10px !important;
  background: rgba(7, 16, 34, 0.98) !important;
  box-shadow: 0 18px 34px rgba(0, 5, 18, 0.42) !important;
}

#system360-app .s360-db360-date-menu > div label {
  display: grid !important;
  gap: 5px !important;
  color: #b6c7e8 !important;
  -webkit-text-fill-color: #b6c7e8 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

#system360-app .s360-db360-selected {
  justify-self: end !important;
  color: #e7efff !important;
  -webkit-text-fill-color: #e7efff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

#system360-app .s360-db360-toolbar .s360-btn.danger {
  border-color: rgba(247, 93, 143, 0.9) !important;
  color: #ff83aa !important;
  -webkit-text-fill-color: #ff83aa !important;
  background: rgba(54, 13, 37, 0.72) !important;
}

@media (max-width: 1380px) {
  #system360-app .s360-db360-toolbar {
    overflow-x: auto !important;
  }

  #system360-app .s360-db360-toolbar-main,
  #system360-app .s360-db360-toolbar-filters {
    min-width: 1240px !important;
  }
}
#system360-app .s360-db360-toolbar select.s360-select option {
  background: #ffffff !important;
  color: #10203b !important;
  -webkit-text-fill-color: #10203b !important;
}

#system360-app .s360-db360-toolbar select.s360-select option:checked {
  background: #2563eb !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

#system360-app .s360-db360-toolbar select.s360-select option:disabled {
  color: #7b879e !important;
  -webkit-text-fill-color: #7b879e !important;
}
#system360-app .s360-db360-toolbar-main {
  grid-template-columns: minmax(260px, 380px) 150px minmax(220px, 240px) auto !important;
}

#system360-app .s360-db360-view-field {
  width: 150px !important;
  max-width: 150px !important;
}

#system360-app .s360-db360-view-field .s360-select {
  width: 100% !important;
  min-width: 0 !important;
  padding-right: 34px !important;
}
#system360-app .s360-db360-table-hidden {
  display: none !important;
}

#system360-app .s360-db360-cards {
  display: none !important;
}

#system360-app .s360-db360-cards.is-active {
  display: grid !important;
}
/* Bases DB360: acabado visual alineado a referencia */
#system360-app .s360-db360-toolbar {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
  margin: 10px 0 14px !important;
  padding: 22px 24px !important;
  border: 1px solid rgba(55, 99, 178, 0.78) !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, rgba(8, 22, 45, 0.98), rgba(6, 16, 33, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(175, 204, 255, 0.07), 0 18px 38px rgba(0, 5, 18, 0.34) !important;
  overflow: visible !important;
}

#system360-app .s360-db360-toolbar-main {
  display: grid !important;
  grid-template-columns: minmax(300px, 380px) 224px minmax(220px, 240px) auto !important;
  align-items: end !important;
  gap: 22px !important;
  min-width: 0 !important;
}

#system360-app .s360-db360-toolbar-filters {
  display: grid !important;
  grid-template-columns: auto minmax(150px, 180px) minmax(160px, 200px) minmax(170px, 220px) minmax(170px, 190px) 1fr auto auto auto auto !important;
  align-items: center !important;
  gap: 12px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(45, 76, 130, 0.46) !important;
  min-width: 0 !important;
}

#system360-app .s360-db360-field {
  display: grid !important;
  gap: 9px !important;
  width: 100% !important;
  min-width: 0 !important;
}

#system360-app .s360-db360-view-field {
  width: 224px !important;
  max-width: 224px !important;
}

#system360-app .s360-db360-field > span:first-child {
  color: #e6edff !important;
  -webkit-text-fill-color: #e6edff !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

#system360-app .s360-db360-toolbar :is(.s360-input, .s360-select) {
  height: 42px !important;
  min-height: 42px !important;
  border: 1px solid rgba(82, 123, 197, 0.7) !important;
  border-radius: 9px !important;
  background: rgba(7, 18, 38, 0.92) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
  color: #e7efff !important;
  -webkit-text-fill-color: #e7efff !important;
  font-size: 13px !important;
  font-weight: 750 !important;
}

#system360-app .s360-db360-input-icon {
  position: relative !important;
  display: block !important;
}

#system360-app .s360-db360-input-icon .s360-input {
  width: 100% !important;
  padding-left: 42px !important;
}

#system360-app .s360-db360-input-icon .s360-svg-icon {
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  width: 18px !important;
  height: 18px !important;
  transform: translateY(-50%) !important;
  color: #dce8ff !important;
  opacity: 0.95 !important;
  pointer-events: none !important;
}

#system360-app .s360-db360-view-switch {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  width: 224px !important;
  height: 42px !important;
  border: 1px solid rgba(82, 123, 197, 0.76) !important;
  border-radius: 9px !important;
  background: rgba(7, 18, 38, 0.92) !important;
  overflow: hidden !important;
}

#system360-app .s360-db360-view-switch button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

#system360-app .s360-db360-view-switch button.active {
  background: linear-gradient(135deg, #7467ff, #5b2ed4) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(91, 61, 229, 0.36) !important;
}

#system360-app .s360-db360-toolbar .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 17px !important;
  stroke-width: 2.25 !important;
}

#system360-app .s360-db360-actions {
  display: inline-flex !important;
  align-items: end !important;
  gap: 20px !important;
  flex-wrap: nowrap !important;
  min-width: max-content !important;
}

#system360-app .s360-db360-toolbar .s360-btn,
#system360-app .s360-db360-filter-btn,
#system360-app .s360-db360-date-menu summary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 16px !important;
  border: 1px solid rgba(82, 123, 197, 0.72) !important;
  border-radius: 9px !important;
  background: rgba(7, 18, 38, 0.9) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
  color: #edf4ff !important;
  -webkit-text-fill-color: #edf4ff !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

#system360-app .s360-db360-filter-btn {
  cursor: pointer !important;
}

#system360-app .s360-db360-filter-btn.is-active,
#system360-app .s360-db360-filter-btn {
  border-color: rgba(122, 85, 255, 0.9) !important;
  box-shadow: 0 0 0 1px rgba(122, 85, 255, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

#system360-app .s360-db360-filter-btn b {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  border-radius: 999px !important;
  background: #8b5cf6 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

#system360-app .s360-db360-filter-select .s360-select {
  width: 100% !important;
}

#system360-app .s360-db360-date-menu {
  position: relative !important;
  min-width: 0 !important;
}

#system360-app .s360-db360-date-menu summary {
  justify-content: space-between !important;
  width: 100% !important;
  list-style: none !important;
  cursor: pointer !important;
}

#system360-app .s360-db360-date-menu summary::-webkit-details-marker {
  display: none !important;
}

#system360-app .s360-db360-date-menu > div {
  position: absolute !important;
  z-index: 30 !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  display: grid !important;
  gap: 10px !important;
  min-width: 250px !important;
  padding: 12px !important;
  border: 1px solid rgba(82, 123, 197, 0.72) !important;
  border-radius: 10px !important;
  background: rgba(7, 16, 34, 0.98) !important;
  box-shadow: 0 18px 34px rgba(0, 5, 18, 0.42) !important;
}

#system360-app .s360-db360-date-menu > div label {
  display: grid !important;
  gap: 5px !important;
  color: #b6c7e8 !important;
  -webkit-text-fill-color: #b6c7e8 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

#system360-app .s360-db360-selected {
  justify-self: end !important;
  color: #e9f1ff !important;
  -webkit-text-fill-color: #e9f1ff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

#system360-app .s360-db360-toolbar .s360-btn.danger {
  border-color: rgba(247, 93, 143, 0.9) !important;
  background: rgba(54, 13, 37, 0.72) !important;
  color: #ff83aa !important;
  -webkit-text-fill-color: #ff83aa !important;
}

@media (max-width: 1380px) {
  #system360-app .s360-db360-toolbar {
    overflow-x: auto !important;
  }

  #system360-app .s360-db360-toolbar-main,
  #system360-app .s360-db360-toolbar-filters {
    min-width: 1240px !important;
  }
}
/* Bases DB360: columnas expansibles y encabezados fijos */
#system360-app .s360-seguimientos-wrap:has(> table.s360-db360-table),
#system360-app .s360-lb360-table-wrap:has(> table.s360-db360-table) {
  position: relative !important;
  overflow: auto !important;
  overflow-anchor: none !important;
  max-height: min(72vh, 760px) !important;
  padding-bottom: 10px !important;
  scrollbar-gutter: stable both-edges !important;
}

#system360-app table.s360-db360-table {
  table-layout: auto !important;
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

#system360-app table.s360-db360-table thead {
  position: sticky !important;
  top: 0 !important;
  z-index: 80 !important;
}

#system360-app table.s360-db360-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 90 !important;
  min-width: max-content !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  background: linear-gradient(180deg, rgba(17, 31, 58, 0.98), rgba(11, 23, 46, 0.98)) !important;
  box-shadow: 0 1px 0 rgba(73, 109, 178, 0.55), 0 10px 20px rgba(0, 5, 18, 0.24) !important;
}

#system360-app table.s360-db360-table tbody td {
  position: relative !important;
  min-width: max-content !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  padding-left: 18px !important;
  padding-right: 18px !important;
}

#system360-app table.s360-db360-table tbody td > * {
  max-width: none !important;
}

#system360-app table.s360-db360-table tbody td :is(.s360-btn, button, .s360-pill, .s360-badge) {
  position: relative !important;
  z-index: 1 !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}

#system360-app table.s360-db360-table tbody td :is(.s360-flex, .s360-sale-actions) {
  width: max-content !important;
  max-width: none !important;
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

#system360-app table.s360-db360-table thead th[data-db360-sel-col="1"],
#system360-app table.s360-db360-table tbody td[data-db360-sel-td="1"] {
  min-width: 46px !important;
  width: 46px !important;
  max-width: 46px !important;
  left: auto !important;
}

#system360-app .s360-seguimientos-wrap:has(table.s360-db360-table),
#system360-app .s360-lb360-table-wrap:has(table.s360-db360-table) {
  position: relative !important;
  overflow: auto !important;
  max-height: min(72vh, 760px) !important;
  scrollbar-gutter: stable both-edges !important;
}

#system360-app table.s360-db360-table thead th:not([data-db360-sel-col="1"]),
#system360-app table.s360-db360-table tbody td:not([data-db360-sel-td="1"]) {
  min-width: 150px !important;
}

#system360-app table.s360-db360-table tbody td:has(> .s360-btn),
#system360-app table.s360-db360-table tbody td:has(button),
#system360-app table.s360-db360-table tbody td:has(.s360-flex) {
  min-width: 190px !important;
}

#system360-app table.s360-db360-table tbody td:has(.s360-pill),
#system360-app table.s360-db360-table tbody td:has(.s360-badge) {
  min-width: 180px !important;
}
#system360-app .s360-seguimientos-wrap:has(table.s360-db360-table),
#system360-app .s360-lb360-table-wrap:has(table.s360-db360-table) {
  box-sizing: border-box !important;
  padding-right: 72px !important;
  padding-bottom: 16px !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
  scrollbar-gutter: stable both-edges !important;
}

#system360-app table.s360-db360-table {
  margin-right: 96px !important;
}

#system360-app table.s360-db360-table thead th:nth-last-child(1),
#system360-app table.s360-db360-table tbody td:nth-last-child(1) {
  min-width: 220px !important;
  width: max-content !important;
  padding-right: 44px !important;
  overflow: visible !important;
}

#system360-app table.s360-db360-table thead th:nth-last-child(2),
#system360-app table.s360-db360-table tbody td:nth-last-child(2) {
  min-width: 230px !important;
  width: max-content !important;
  overflow: visible !important;
}

#system360-app table.s360-db360-table tbody td:nth-last-child(1) :is(.s360-flex, .s360-sale-actions),
#system360-app table.s360-db360-table tbody td:nth-last-child(2) :is(.s360-flex, .s360-sale-actions) {
  min-width: max-content !important;
  width: max-content !important;
  padding-right: 18px !important;
  overflow: visible !important;
}

#system360-app table.s360-db360-table tbody td:nth-last-child(1) :is(button, .s360-btn, .s360-icon-btn),
#system360-app table.s360-db360-table tbody td:nth-last-child(2) :is(button, .s360-btn, .s360-icon-btn) {
  flex: 0 0 auto !important;
}
/* Bases DB360: scroll completo y encabezado fijo definitivo */
#system360-app .s360-db360-table-wrap {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  max-height: 64vh !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
  padding: 0 0 18px 0 !important;
  box-sizing: border-box !important;
  scrollbar-gutter: stable both-edges !important;
  overscroll-behavior: contain !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table {
  table-layout: auto !important;
  width: max-content !important;
  min-width: calc(100% + 280px) !important;
  max-width: none !important;
  margin: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

#system360-app .s360-db360-table-wrap > .s360-db360-end-spacer {
  display: block !important;
  width: 360px !important;
  min-width: 360px !important;
  height: 1px !important;
  pointer-events: none !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table thead,
#system360-app .s360-db360-table-wrap > table.s360-db360-table thead tr {
  position: sticky !important;
  top: 0 !important;
  z-index: 120 !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 130 !important;
  background: linear-gradient(180deg, rgba(18, 32, 61, 0.99), rgba(10, 22, 44, 0.99)) !important;
  box-shadow: 0 1px 0 rgba(78, 116, 184, 0.72), 0 10px 20px rgba(0, 5, 18, 0.32) !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table th,
#system360-app .s360-db360-table-wrap > table.s360-db360-table td {
  min-width: 170px !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table th:last-child,
#system360-app .s360-db360-table-wrap > table.s360-db360-table td:last-child,
#system360-app .s360-db360-table-wrap > table.s360-db360-table th:nth-last-child(2),
#system360-app .s360-db360-table-wrap > table.s360-db360-table td:nth-last-child(2) {
  min-width: 260px !important;
  padding-right: 56px !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table td :is(.s360-flex, .s360-sale-actions) {
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table td :is(button, .s360-btn, .s360-icon-btn, .s360-pill, .s360-badge) {
  flex: 0 0 auto !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
}
#system360-app .s360-db360-table-wrap {
  white-space: nowrap !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table {
  display: inline-table !important;
  vertical-align: top !important;
}

#system360-app .s360-db360-table-wrap > .s360-db360-end-spacer {
  display: inline-block !important;
  vertical-align: top !important;
  width: 460px !important;
  min-width: 460px !important;
  height: 1px !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table th:last-child,
#system360-app .s360-db360-table-wrap > table.s360-db360-table td:last-child {
  min-width: 320px !important;
  padding-right: 96px !important;
}
/* Bases DB360: sin corte vertical, la pagina baja completa */
#system360-app .s360-panel:has(.s360-db360-table-wrap),
#system360-app .s360-main:has(.s360-db360-table-wrap) {
  overflow: visible !important;
  max-height: none !important;
}

#system360-app .s360-db360-table-wrap,
#system360-app .s360-seguimientos-wrap.s360-db360-table-wrap,
#system360-app .s360-lb360-table-wrap.s360-db360-table-wrap {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding-bottom: 18px !important;
  margin-bottom: 10px !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table {
  overflow: visible !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table thead,
#system360-app .s360-db360-table-wrap > table.s360-db360-table thead tr,
#system360-app .s360-db360-table-wrap > table.s360-db360-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 180 !important;
}
/* Bases DB360: barra vertical interna para navegar la base */
#system360-app .s360-db360-table-wrap,
#system360-app .s360-seguimientos-wrap.s360-db360-table-wrap,
#system360-app .s360-lb360-table-wrap.s360-db360-table-wrap {
  max-height: min(68vh, 720px) !important;
  overflow-x: auto !important;
  overflow-y: scroll !important;
  padding-bottom: 18px !important;
  scrollbar-gutter: stable both-edges !important;
  overscroll-behavior: contain !important;
}

#system360-app .s360-db360-table-wrap > table.s360-db360-table thead,
#system360-app .s360-db360-table-wrap > table.s360-db360-table thead tr,
#system360-app .s360-db360-table-wrap > table.s360-db360-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 220 !important;
}
/* Bases DB360: ventana de scroll vertical real */
#system360-app [data-db360-table-wrap] {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 520px !important;
  max-height: 520px !important;
  min-height: 360px !important;
  overflow-x: auto !important;
  overflow-y: scroll !important;
  padding: 0 0 18px 0 !important;
  margin-bottom: 14px !important;
  box-sizing: border-box !important;
  scrollbar-gutter: stable both-edges !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}

#system360-app [data-db360-table-wrap]::-webkit-scrollbar {
  width: 12px !important;
  height: 12px !important;
}

#system360-app [data-db360-table-wrap]::-webkit-scrollbar-track {
  background: rgba(8, 18, 38, 0.92) !important;
  border-radius: 999px !important;
}

#system360-app [data-db360-table-wrap]::-webkit-scrollbar-thumb {
  background: rgba(120, 148, 198, 0.9) !important;
  border: 2px solid rgba(8, 18, 38, 0.92) !important;
  border-radius: 999px !important;
}

#system360-app [data-db360-table-wrap] > table.s360-db360-table {
  display: inline-table !important;
  table-layout: auto !important;
  width: max-content !important;
  min-width: calc(100% + 360px) !important;
  max-width: none !important;
  margin: 0 !important;
  vertical-align: top !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

#system360-app [data-db360-table-wrap] > .s360-db360-end-spacer {
  display: inline-block !important;
  width: 520px !important;
  min-width: 520px !important;
  height: 1px !important;
  vertical-align: top !important;
}

#system360-app [data-db360-table-wrap] > table.s360-db360-table thead,
#system360-app [data-db360-table-wrap] > table.s360-db360-table thead tr,
#system360-app [data-db360-table-wrap] > table.s360-db360-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 300 !important;
}

#system360-app [data-db360-table-wrap] > table.s360-db360-table thead th {
  background: linear-gradient(180deg, rgba(18, 32, 61, 1), rgba(10, 22, 44, 1)) !important;
  box-shadow: 0 1px 0 rgba(82, 123, 197, 0.85), 0 10px 22px rgba(0, 5, 18, 0.42) !important;
}
/* Mis ventas: scroll vertical real dentro de la base */
#system360-app [data-sales-table-wrap],
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-seguimientos-wrap.s360-sales-table-wrap,
#system360-app .s360-app.s360-app-system .s360-sales-panel [data-sales-table-wrap] {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 540px !important;
  max-height: 540px !important;
  min-height: 360px !important;
  overflow-x: auto !important;
  overflow-y: scroll !important;
  padding: 0 0 16px 0 !important;
  margin-bottom: 14px !important;
  box-sizing: border-box !important;
  scrollbar-gutter: stable both-edges !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}

#system360-app [data-sales-table-wrap]::-webkit-scrollbar,
#system360-app .s360-sales-table-wrap::-webkit-scrollbar {
  width: 12px !important;
  height: 12px !important;
}

#system360-app [data-sales-table-wrap]::-webkit-scrollbar-track,
#system360-app .s360-sales-table-wrap::-webkit-scrollbar-track {
  background: rgba(8, 18, 38, 0.92) !important;
  border-radius: 999px !important;
}

#system360-app [data-sales-table-wrap]::-webkit-scrollbar-thumb,
#system360-app .s360-sales-table-wrap::-webkit-scrollbar-thumb {
  background: rgba(120, 148, 198, 0.9) !important;
  border: 2px solid rgba(8, 18, 38, 0.92) !important;
  border-radius: 999px !important;
}

#system360-app [data-sales-table-wrap] > table.s360-table-sales,
#system360-app .s360-app.s360-app-system .s360-sales-panel [data-sales-table-wrap] > table.s360-table-sales {
  display: table !important;
  table-layout: auto !important;
  width: max-content !important;
  min-width: 3040px !important;
  max-width: none !important;
  margin: 0 120px 0 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

#system360-app [data-sales-table-wrap] > table.s360-table-sales thead,
#system360-app [data-sales-table-wrap] > table.s360-table-sales thead tr,
#system360-app [data-sales-table-wrap] > table.s360-table-sales thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 400 !important;
}

#system360-app [data-sales-table-wrap] > table.s360-table-sales thead th {
  background: linear-gradient(180deg, rgba(18, 32, 61, 1), rgba(10, 22, 44, 1)) !important;
  box-shadow: 0 1px 0 rgba(82, 123, 197, 0.85), 0 10px 22px rgba(0, 5, 18, 0.42) !important;
}

#system360-app [data-sales-table-wrap] > table.s360-table-sales th,
#system360-app [data-sales-table-wrap] > table.s360-table-sales td {
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

#system360-app [data-sales-table-wrap] > table.s360-table-sales th:last-child,
#system360-app [data-sales-table-wrap] > table.s360-table-sales td:last-child {
  min-width: 300px !important;
  padding-right: 80px !important;
}
/* Bases DB360: boton Eliminar vista estilo referencia */
#system360-app .s360-db360-toolbar .s360-btn.danger,
#system360-app .s360-db360-toolbar button[data-db360-bulk-delete] {
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 16px !important;
  border: 1px solid rgba(255, 82, 150, 0.92) !important;
  border-radius: 9px !important;
  background: rgba(67, 15, 47, 0.5) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
  color: #ff8ab3 !important;
  -webkit-text-fill-color: #ff8ab3 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

#system360-app .s360-db360-toolbar button[data-db360-bulk-delete] .s360-svg-icon {
  color: #ff5c99 !important;
  stroke: currentColor !important;
}

#system360-app .s360-db360-toolbar button[data-db360-bulk-delete]:hover:not(:disabled) {
  border-color: rgba(255, 105, 170, 1) !important;
  background: rgba(89, 18, 59, 0.68) !important;
  box-shadow: 0 0 0 1px rgba(255, 82, 150, 0.18), 0 12px 22px rgba(255, 82, 150, 0.12) !important;
}
/* Loading overlay: fondo semitransparente, blur y aros limpios */
#system360-app .s360-app-system .s360-loading-layer,
#system360-app .s360-loading-layer {
  background: rgba(3, 9, 26, 0.38) !important;
  backdrop-filter: blur(15px) saturate(128%) !important;
  -webkit-backdrop-filter: blur(15px) saturate(128%) !important;
  overflow: hidden !important;
}

#system360-app .s360-app-system .s360-loading-layer::before,
#system360-app .s360-app-system .s360-loading-layer::after,
#system360-app .s360-loading-layer::before,
#system360-app .s360-loading-layer::after {
  content: none !important;
  display: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360,
#system360-app .s360-loading-layer .s360-loader360 {
  --s360-loader-thickness: 7px !important;
  filter: drop-shadow(0 18px 42px rgba(4, 9, 26, 0.38)) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-halo,
#system360-app .s360-loading-layer .s360-loader360-halo {
  display: none !important;
  opacity: 0 !important;
  animation: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-track,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360-progress,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360-glow,
#system360-app .s360-loading-layer .s360-loader360-track,
#system360-app .s360-loading-layer .s360-loader360-progress,
#system360-app .s360-loading-layer .s360-loader360-glow {
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - var(--s360-loader-thickness)), #000 calc(100% - var(--s360-loader-thickness) + 1px)) !important;
  mask: radial-gradient(farthest-side, transparent calc(100% - var(--s360-loader-thickness)), #000 calc(100% - var(--s360-loader-thickness) + 1px)) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-track,
#system360-app .s360-loading-layer .s360-loader360-track {
  background: conic-gradient(from -90deg, rgba(65, 88, 188, 0.42), rgba(33, 45, 102, 0.16) 126deg, rgba(83, 49, 157, 0.24) 260deg, rgba(65, 88, 188, 0.42) 360deg) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-progress,
#system360-app .s360-loading-layer .s360-loader360-progress {
  filter:
    drop-shadow(0 0 10px rgba(126, 64, 255, 0.9))
    drop-shadow(0 0 18px rgba(255, 74, 171, 0.58))
    drop-shadow(0 0 13px rgba(30, 155, 255, 0.72)) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-glow,
#system360-app .s360-loading-layer .s360-loader360-glow {
  inset: -1px !important;
  filter: blur(10px) !important;
  opacity: 0.62 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-core,
#system360-app .s360-loading-layer .s360-loader360-core {
  background: radial-gradient(circle at 50% 48%, rgba(255, 255, 255, 0.18), rgba(30, 38, 86, 0.26) 34%, rgba(4, 10, 26, 0.12) 68%, transparent 74%) !important;
  border-radius: 50% !important;
}
#system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand.is-logo,
#system360-app .s360-loading-layer .s360-loader360-brand.is-logo {
  width: 178px !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  text-shadow: none !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand-img,
#system360-app .s360-loading-layer .s360-loader360-brand-img {
  display: block !important;
  width: 178px !important;
  max-width: min(178px, 48vw) !important;
  height: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 10px 24px rgba(0, 0, 0, 0.36)) drop-shadow(0 0 14px rgba(255, 255, 255, 0.18)) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand.is-logo .s360-loader360-brand-digits,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand.is-logo .s360-loader360-brand-zero,
#system360-app .s360-loading-layer .s360-loader360-brand.is-logo .s360-loader360-brand-digits,
#system360-app .s360-loading-layer .s360-loader360-brand.is-logo .s360-loader360-brand-zero {
  display: none !important;
}
/* Loading overlay: aros concentricos tipo referencia */
#system360-app .s360-app-system .s360-loading-layer .s360-loading-main,
#system360-app .s360-loading-layer .s360-loading-main {
  gap: 6px !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360,
#system360-app .s360-loading-layer .s360-loader360 {
  --s360-loader-size: 304px !important;
  --s360-loader-thickness: 6px !important;
  margin: 0 auto -2px !important;
  isolation: isolate !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::before,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360::after,
#system360-app .s360-loading-layer .s360-loader360::before,
#system360-app .s360-loading-layer .s360-loader360::after {
  content: "" !important;
  position: absolute !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::before,
#system360-app .s360-loading-layer .s360-loader360::before {
  inset: -36px !important;
  border: 1px solid rgba(91, 64, 206, 0.18) !important;
  border-top-color: rgba(117, 70, 255, 0.46) !important;
  border-right-color: rgba(246, 76, 179, 0.28) !important;
  border-bottom-color: rgba(30, 155, 255, 0.16) !important;
  box-shadow:
    0 0 42px rgba(91, 64, 206, 0.12),
    inset 0 0 38px rgba(30, 155, 255, 0.06) !important;
  animation: s360-ref-loader-rings-spin 12s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::after,
#system360-app .s360-loading-layer .s360-loader360::after {
  inset: -18px !important;
  border: 1px solid rgba(28, 116, 255, 0.24) !important;
  border-left-color: rgba(30, 155, 255, 0.58) !important;
  border-top-color: rgba(92, 65, 255, 0.22) !important;
  border-right-color: rgba(255, 88, 176, 0.2) !important;
  box-shadow:
    0 0 28px rgba(30, 155, 255, 0.14),
    inset 0 0 30px rgba(112, 72, 255, 0.08) !important;
  animation: s360-ref-loader-rings-spin-reverse 8.5s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-halo,
#system360-app .s360-loading-layer .s360-loader360-halo {
  display: block !important;
  opacity: 0.72 !important;
  inset: -8px !important;
  border-radius: 50% !important;
  background:
    radial-gradient(farthest-side, transparent calc(100% - 2px), rgba(117, 70, 255, 0.26) calc(100% - 2px), rgba(117, 70, 255, 0.26) 100%, transparent calc(100% + 1px)),
    radial-gradient(circle at 50% 50%, rgba(74, 55, 180, 0.12), transparent 66%) !important;
  filter: none !important;
  animation: s360-ref-loader-rings-spin 10.5s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-track,
#system360-app .s360-loading-layer .s360-loader360-track {
  background:
    conic-gradient(from -92deg,
      rgba(24, 139, 255, 0.56) 0deg,
      rgba(26, 71, 190, 0.38) 66deg,
      rgba(36, 37, 104, 0.18) 128deg,
      rgba(86, 48, 168, 0.18) 240deg,
      rgba(255, 72, 174, 0.36) 316deg,
      rgba(24, 139, 255, 0.56) 360deg) !important;
  opacity: 0.86 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-progress,
#system360-app .s360-loading-layer .s360-loader360-progress {
  background:
    conic-gradient(from -84deg,
      #742cff 0deg,
      #a43cff 46deg,
      #d94cf1 76deg,
      #ff4aa7 112deg,
      #ff713f 154deg,
      #ffae43 168deg,
      transparent 178deg,
      transparent 255deg,
      #1596ff 282deg,
      #1fb8ff 318deg,
      transparent 331deg,
      transparent 360deg) !important;
  filter:
    drop-shadow(0 0 7px rgba(116, 44, 255, 0.92))
    drop-shadow(0 0 16px rgba(217, 76, 241, 0.58))
    drop-shadow(0 0 16px rgba(255, 74, 167, 0.46))
    drop-shadow(0 0 10px rgba(31, 184, 255, 0.72)) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-glow,
#system360-app .s360-loading-layer .s360-loader360-glow {
  inset: -4px !important;
  background:
    conic-gradient(from -84deg,
      rgba(116, 44, 255, 0.0) 0deg,
      rgba(164, 60, 255, 0.34) 42deg,
      rgba(217, 76, 241, 0.36) 76deg,
      rgba(255, 74, 167, 0.32) 112deg,
      rgba(255, 113, 63, 0.26) 158deg,
      transparent 215deg,
      rgba(31, 184, 255, 0.36) 300deg,
      transparent 336deg) !important;
  filter: blur(12px) !important;
  opacity: 0.76 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-core,
#system360-app .s360-loading-layer .s360-loader360-core {
  z-index: 2 !important;
  gap: 14px !important;
  background:
    radial-gradient(circle at 50% 48%, rgba(255, 255, 255, 0.12), rgba(35, 43, 96, 0.24) 35%, rgba(4, 10, 26, 0.10) 68%, transparent 76%) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-brand-img,
#system360-app .s360-loading-layer .s360-loader360-brand-img {
  width: 158px !important;
  max-width: min(158px, 46vw) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-percent,
#system360-app .s360-loading-layer .s360-loading-percent {
  margin: -4px 0 6px !important;
  font-size: 20px !important;
  color: #8e5cff !important;
  -webkit-text-fill-color: #8e5cff !important;
  text-shadow: 0 0 14px rgba(142, 92, 255, 0.58) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress,
#system360-app .s360-loading-layer .s360-loading-progress {
  width: min(570px, 84vw) !important;
  height: 5px !important;
  margin: 0 !important;
  background: rgba(24, 31, 68, 0.76) !important;
  box-shadow: inset 0 0 8px rgba(14, 22, 55, 0.86) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress > span,
#system360-app .s360-loading-layer .s360-loading-progress > span {
  background: linear-gradient(90deg, #21cfff 0%, #1c8fff 30%, #7047ff 58%, #dc52ef 78%, #ff5a9e 92%, #ff9c43 100%) !important;
  box-shadow:
    0 0 8px rgba(33, 207, 255, 0.82),
    0 0 16px rgba(112, 71, 255, 0.58),
    0 0 15px rgba(255, 90, 158, 0.36) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-subtext,
#system360-app .s360-loading-layer .s360-loading-subtext {
  margin-top: 12px !important;
}
/* Loading overlay: centrar aros concentricos dentro del loader */
#system360-app .s360-app-system .s360-loading-layer .s360-loader360,
#system360-app .s360-loading-layer .s360-loader360 {
  --s360-loader-size: 292px !important;
  overflow: visible !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::before,
#system360-app .s360-loading-layer .s360-loader360::before {
  inset: -22px !important;
  transform: none !important;
  transform-origin: 50% 50% !important;
  border-color: rgba(91, 64, 206, 0.16) !important;
  border-top-color: rgba(117, 70, 255, 0.44) !important;
  border-right-color: rgba(246, 76, 179, 0.22) !important;
  border-bottom-color: rgba(30, 155, 255, 0.18) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::after,
#system360-app .s360-loading-layer .s360-loader360::after {
  inset: -10px !important;
  transform: none !important;
  transform-origin: 50% 50% !important;
  border-color: rgba(28, 116, 255, 0.18) !important;
  border-left-color: rgba(30, 155, 255, 0.48) !important;
  border-right-color: rgba(255, 88, 176, 0.18) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-halo,
#system360-app .s360-loading-layer .s360-loader360-halo {
  inset: 8px !important;
  opacity: 0.5 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-track,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360-progress,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360-glow,
#system360-app .s360-loading-layer .s360-loader360-track,
#system360-app .s360-loading-layer .s360-loader360-progress,
#system360-app .s360-loading-layer .s360-loader360-glow {
  z-index: 1 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-core,
#system360-app .s360-loading-layer .s360-loader360-core {
  z-index: 3 !important;
}

/* Loading overlay: los aros rotan centrados, sin salir del loader */
#system360-app .s360-app-system .s360-loading-layer .s360-loader360::before,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360::after,
#system360-app .s360-loading-layer .s360-loader360::before,
#system360-app .s360-loading-layer .s360-loader360::after,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360-halo,
#system360-app .s360-loading-layer .s360-loader360-halo {
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: auto !important;
  aspect-ratio: auto !important;
  translate: none !important;
  transform: rotate(0deg) !important;
  transform-origin: 50% 50% !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::before,
#system360-app .s360-loading-layer .s360-loader360::before {
  inset: -22px !important;
  animation: s360-loader360-centered-spin 12s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::after,
#system360-app .s360-loading-layer .s360-loader360::after {
  inset: -10px !important;
  animation: s360-loader360-centered-spin-reverse 8.5s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-halo,
#system360-app .s360-loading-layer .s360-loader360-halo {
  inset: 8px !important;
  animation: s360-loader360-centered-spin 10.5s linear infinite !important;
}

@keyframes s360-loader360-centered-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes s360-loader360-centered-spin-reverse {
  from { transform: rotate(360deg); }
  to { transform: rotate(0deg); }
}

/* Bases DB360: vista Cards tipo kanban por estatus */
#system360-app .s360-db360-cards {
  width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding: 4px 2px 14px !important;
  scrollbar-color: rgba(126, 158, 219, 0.92) rgba(10, 21, 44, 0.94) !important;
  scrollbar-width: thin !important;
}

#system360-app .s360-db360-cards.is-active {
  display: block !important;
}

#system360-app .s360-db360-kanban {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(255px, 1fr)) !important;
  gap: 12px !important;
  min-width: 1340px !important;
  align-items: stretch !important;
}

#system360-app .s360-db360-kanban-col {
  min-height: 430px !important;
  padding: 13px 12px 14px !important;
  border: 1px solid rgba(45, 82, 145, 0.72) !important;
  border-radius: 9px !important;
  background:
    linear-gradient(180deg, rgba(8, 21, 43, 0.98), rgba(5, 14, 30, 0.98)),
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--db360-status-color) 18%, transparent), transparent 48%) !important;
  box-shadow: inset 0 1px 0 rgba(187, 212, 255, 0.06), 0 14px 30px rgba(0, 6, 22, 0.24) !important;
}

#system360-app .s360-db360-kanban-head {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 4px 8px !important;
  align-items: start !important;
  margin-bottom: 12px !important;
}

#system360-app .s360-db360-kanban-head > div:first-child {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}

#system360-app .s360-db360-kanban-head > div:first-child > span {
  width: 10px !important;
  height: 10px !important;
  flex: 0 0 10px !important;
  border-radius: 50% !important;
  background: var(--db360-status-color) !important;
  box-shadow: 0 0 16px color-mix(in srgb, var(--db360-status-color) 72%, transparent) !important;
}

#system360-app .s360-db360-kanban-head strong {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #eef4ff !important;
  -webkit-text-fill-color: #eef4ff !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

#system360-app .s360-db360-kanban-head b {
  min-width: 30px !important;
  height: 22px !important;
  padding: 0 8px !important;
  display: inline-grid !important;
  place-items: center !important;
  border-radius: 7px !important;
  background: rgba(48, 61, 92, 0.86) !important;
  color: #dfe8ff !important;
  font-size: 11px !important;
  font-weight: 850 !important;
}

#system360-app .s360-db360-kanban-head small {
  grid-column: 1 / 2 !important;
  color: var(--db360-status-color) !important;
  -webkit-text-fill-color: var(--db360-status-color) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  opacity: 0.9 !important;
}

#system360-app .s360-db360-kanban-head-actions {
  grid-column: 2 / 3 !important;
  grid-row: 1 / 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

#system360-app .s360-db360-kanban-head-actions button {
  width: 24px !important;
  height: 24px !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: #b5c5e6 !important;
  -webkit-text-fill-color: #b5c5e6 !important;
  cursor: pointer !important;
}

#system360-app .s360-db360-kanban-list {
  display: grid !important;
  gap: 10px !important;
}

#system360-app .s360-db360-kanban-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  gap: 10px !important;
  min-height: 92px !important;
  padding: 12px 11px 10px !important;
  border: 1px solid rgba(38, 71, 128, 0.76) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(9, 22, 47, 0.98), rgba(7, 17, 37, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(180, 205, 255, 0.05), 0 10px 22px rgba(0, 5, 18, 0.22) !important;
  cursor: pointer !important;
}

#system360-app .s360-db360-kanban-card.is-selected {
  border-color: rgba(138, 96, 255, 0.95) !important;
  box-shadow: 0 0 0 1px rgba(138, 96, 255, 0.4), 0 0 24px rgba(101, 68, 255, 0.18) !important;
}

#system360-app .s360-db360-kanban-check {
  position: absolute !important;
  right: 9px !important;
  top: 9px !important;
  width: 14px !important;
  height: 14px !important;
  accent-color: #7f55ff !important;
}

#system360-app .s360-db360-kanban-avatar {
  width: 34px !important;
  height: 34px !important;
  margin-top: 3px !important;
  display: inline-grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: #f4f8ff !important;
  -webkit-text-fill-color: #f4f8ff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  background: linear-gradient(135deg, rgba(245, 178, 94, 0.98), rgba(94, 139, 255, 0.95)) !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08), 0 9px 20px rgba(0, 5, 18, 0.34) !important;
}

#system360-app .s360-db360-kanban-body {
  min-width: 0 !important;
}

#system360-app .s360-db360-kanban-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding-right: 16px !important;
}

#system360-app .s360-db360-kanban-top strong {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #f2f6ff !important;
  -webkit-text-fill-color: #f2f6ff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

#system360-app .s360-db360-kanban-top span,
#system360-app .s360-db360-kanban-phone {
  color: #b7c6e5 !important;
  -webkit-text-fill-color: #b7c6e5 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

#system360-app .s360-db360-kanban-phone {
  margin-top: 3px !important;
}

#system360-app .s360-db360-kanban-service {
  margin-top: 3px !important;
  color: var(--db360-status-color) !important;
  -webkit-text-fill-color: var(--db360-status-color) !important;
  font-size: 11px !important;
  font-weight: 850 !important;
}

#system360-app .s360-db360-kanban-actions {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  margin-top: 9px !important;
}

#system360-app .s360-db360-kanban-action {
  height: 26px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(39, 72, 129, 0.65) !important;
  border-radius: 7px !important;
  background: rgba(12, 27, 58, 0.92) !important;
  color: #cdd9f2 !important;
  -webkit-text-fill-color: #cdd9f2 !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

#system360-app .s360-db360-kanban-action:hover {
  border-color: color-mix(in srgb, var(--db360-status-color) 72%, rgba(112, 151, 219, 0.8)) !important;
  color: var(--db360-status-color) !important;
  -webkit-text-fill-color: var(--db360-status-color) !important;
}

#system360-app .s360-db360-kanban-action.is-disabled {
  opacity: 0.46 !important;
  pointer-events: none !important;
}

#system360-app .s360-db360-kanban-action .s360-svg-icon {
  width: 14px !important;
  height: 14px !important;
}

#system360-app .s360-db360-kanban-empty {
  display: grid !important;
  place-items: center !important;
  min-height: 92px !important;
  border: 1px dashed rgba(75, 106, 166, 0.42) !important;
  border-radius: 8px !important;
  color: #8194ba !important;
  -webkit-text-fill-color: #8194ba !important;
  font-size: 12px !important;
  font-weight: 750 !important;
}

@media (max-width: 900px) {
  #system360-app .s360-db360-kanban {
    min-width: 1240px !important;
    grid-template-columns: repeat(5, 240px) !important;
  }
}

/* Bases DB360 Kanban: ajuste fino al diseno de referencia */
#system360-app .s360-db360-cards.is-active {
  display: block !important;
  background: transparent !important;
}

#system360-app .s360-db360-kanban {
  grid-template-columns: repeat(5, minmax(226px, 1fr)) !important;
  gap: 12px !important;
  min-width: 1180px !important;
}

#system360-app .s360-db360-kanban-col {
  padding: 10px 10px 13px !important;
  border-color: rgba(28, 61, 119, 0.88) !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--db360-status-color) 13%, transparent), transparent 42%),
    linear-gradient(180deg, #07162f 0%, #061225 100%) !important;
}

#system360-app .s360-db360-kanban-head strong {
  font-size: 12px !important;
  line-height: 1.1 !important;
}

#system360-app .s360-db360-kanban-head b {
  min-width: 26px !important;
  height: 19px !important;
  border-radius: 6px !important;
  background: #1b2a45 !important;
  font-size: 10px !important;
}

#system360-app .s360-db360-kanban-head small {
  font-size: 11px !important;
}

#system360-app .s360-db360-kanban-card,
#system360-app .s360-db360-kanban-card.is-selected {
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 8px !important;
  min-height: 92px !important;
  padding: 11px 9px 9px !important;
  border: 1px solid rgba(22, 47, 91, 0.96) !important;
  border-radius: 8px !important;
  background-color: #07162f !important;
  background-image:
    radial-gradient(circle at 18% 18%, rgba(68, 125, 255, 0.08), transparent 34%),
    linear-gradient(180deg, #071832 0%, #061226 100%) !important;
  box-shadow: inset 0 1px 0 rgba(163, 193, 255, 0.045), 0 8px 18px rgba(0, 5, 20, 0.24) !important;
}

#system360-app .s360-db360-kanban-card:hover {
  border-color: color-mix(in srgb, var(--db360-status-color) 58%, rgba(29, 65, 128, 0.95)) !important;
  transform: translateY(-1px) !important;
}

#system360-app .s360-db360-kanban-avatar {
  width: 30px !important;
  height: 30px !important;
  margin-top: 1px !important;
  font-size: 10px !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background:
    radial-gradient(circle at 50% 36%, #ffd6b3 0 28%, transparent 29%),
    radial-gradient(circle at 50% 25%, #3a281f 0 22%, transparent 23%),
    linear-gradient(135deg, #2a406f, #6d4eff) !important;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.08), 0 7px 15px rgba(0, 5, 20, 0.34) !important;
}

#system360-app .s360-db360-kanban-top {
  padding-right: 13px !important;
  line-height: 1.1 !important;
}

#system360-app .s360-db360-kanban-top strong {
  font-size: 11px !important;
  font-weight: 900 !important;
}

#system360-app .s360-db360-kanban-top span,
#system360-app .s360-db360-kanban-phone {
  font-size: 10px !important;
  color: #9db0ce !important;
  -webkit-text-fill-color: #9db0ce !important;
}

#system360-app .s360-db360-kanban-service {
  margin-top: 2px !important;
  font-size: 10px !important;
}

#system360-app .s360-db360-kanban-actions {
  gap: 6px !important;
  margin-top: 8px !important;
}

#system360-app .s360-db360-kanban-action {
  height: 24px !important;
  border-radius: 6px !important;
  border-color: rgba(18, 42, 84, 0.98) !important;
  background: #081a37 !important;
  color: #9fb0cd !important;
  -webkit-text-fill-color: #9fb0cd !important;
}

#system360-app .s360-db360-kanban-action .s360-svg-icon {
  width: 13px !important;
  height: 13px !important;
  stroke-width: 2.2 !important;
}

#system360-app .s360-db360-kanban-check {
  right: 8px !important;
  top: 8px !important;
  width: 13px !important;
  height: 13px !important;
}

/* Bases DB360 Kanban: bloquear cualquier fondo claro heredado */
#system360-app .s360-db360-kanban .s360-db360-kanban-card,
#system360-app .s360-db360-kanban .s360-db360-kanban-card.is-selected,
#system360-app .s360-db360-cards.is-active .s360-db360-kanban-card,
#system360-app .s360-db360-cards.is-active .s360-db360-kanban-card.is-selected {
  background: #07162f !important;
  background-color: #07162f !important;
  background-image:
    radial-gradient(circle at 18% 18%, rgba(61, 126, 255, 0.08), transparent 34%),
    linear-gradient(180deg, #071832 0%, #061226 100%) !important;
  opacity: 1 !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Flujo de venta: popup redisenado */
#system360-app .s360-modal.s360-modal-workflow {
  width: min(1480px, calc(100vw - 28px)) !important;
  max-width: min(1480px, calc(100vw - 28px)) !important;
  height: min(92vh, 1060px) !important;
  max-height: 92vh !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(48, 78, 132, 0.86) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(72, 45, 157, 0.16), transparent 32%),
    linear-gradient(180deg, #07162e 0%, #061124 100%) !important;
  box-shadow: 0 26px 80px rgba(0, 4, 16, 0.58), inset 0 1px 0 rgba(182, 207, 255, 0.07) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-modal-head {
  flex: 0 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto auto !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 34px 36px 26px !important;
  border: 0 !important;
  background: transparent !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-head-title {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  min-width: 0 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-head-icon,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-panel-title > span,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-icon {
  width: 48px !important;
  height: 48px !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 48px !important;
  border-radius: 10px !important;
  color: #a855f7 !important;
  -webkit-text-fill-color: #a855f7 !important;
  background: linear-gradient(180deg, rgba(83, 61, 170, 0.34), rgba(17, 31, 65, 0.94)) !important;
  box-shadow: inset 0 1px 0 rgba(222, 207, 255, 0.12), 0 13px 28px rgba(0, 5, 18, 0.28) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-head-icon .s360-svg-icon,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-panel-title .s360-svg-icon,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-icon .s360-svg-icon {
  width: 24px !important;
  height: 24px !important;
  stroke-width: 2.2 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-head-title h3 {
  margin: 0 !important;
  color: #f5f7ff !important;
  -webkit-text-fill-color: #f5f7ff !important;
  font-size: 29px !important;
  line-height: 1.05 !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-head-title p {
  margin: 11px 0 0 !important;
  color: #aab8d4 !important;
  -webkit-text-fill-color: #aab8d4 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-head-title p b {
  color: #9d7cff !important;
  -webkit-text-fill-color: #9d7cff !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-head-action {
  height: 56px !important;
  min-width: 176px !important;
  padding: 0 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(65, 91, 145, 0.9) !important;
  background: #07172f !important;
  color: #f0f4ff !important;
  -webkit-text-fill-color: #f0f4ff !important;
  font-size: 15px !important;
  font-weight: 850 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-chat-action {
  min-width: 178px !important;
  border-color: transparent !important;
  background: linear-gradient(100deg, #6138f1 0%, #9d42e9 52%, #ff5b47 100%) !important;
  box-shadow: 0 14px 30px rgba(117, 72, 255, 0.24) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-modal-close {
  width: 56px !important;
  height: 56px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(65, 91, 145, 0.9) !important;
  background: #07172f !important;
  color: #f3f6ff !important;
  -webkit-text-fill-color: #f3f6ff !important;
  font-size: 34px !important;
  line-height: 1 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-modal {
  flex: 1 1 auto !important;
  display: grid !important;
  gap: 16px !important;
  padding: 0 36px 26px !important;
  overflow: auto !important;
  background: transparent !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-modal > section,
#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-modal .s360-panel {
  border: 1px solid rgba(48, 78, 132, 0.82) !important;
  border-radius: 10px !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(35, 80, 158, 0.12), transparent 42%),
    linear-gradient(180deg, rgba(8, 22, 45, 0.88), rgba(5, 15, 33, 0.9)) !important;
  box-shadow: inset 0 1px 0 rgba(181, 207, 255, 0.06) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-summary {
  padding: 18px 22px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-summary-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-card {
  min-height: 118px !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 20px 18px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(35, 61, 108, 0.82) !important;
  background: linear-gradient(180deg, rgba(8, 20, 42, 0.94), rgba(6, 17, 37, 0.96)) !important;
  box-shadow: 0 14px 34px rgba(0, 5, 20, 0.18), inset 0 1px 0 rgba(174, 205, 255, 0.05) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-next,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-progress,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-timer {
  grid-column: span 1 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-next {
  grid-column: span 1 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-card .k {
  margin: 0 0 8px !important;
  color: #b7c4df !important;
  -webkit-text-fill-color: #b7c4df !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  text-transform: none !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-card .v {
  color: #f5f7ff !important;
  -webkit-text-fill-color: #f5f7ff !important;
  font-size: 21px !important;
  line-height: 1.24 !important;
  font-weight: 900 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-card small {
  display: block !important;
  margin-top: 4px !important;
  color: #94a3c1 !important;
  -webkit-text-fill-color: #94a3c1 !important;
  font-size: 14px !important;
  font-weight: 750 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-days .v,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-progress .v {
  font-size: 38px !important;
  line-height: 0.94 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-pill {
  min-height: 42px !important;
  padding: 0 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  border-radius: 999px !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(90deg, rgba(96, 60, 214, 0.95), rgba(51, 33, 126, 0.96)) !important;
  border: 0 !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-pill::before {
  content: "" !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: #9d5cff !important;
  box-shadow: 0 0 12px rgba(157, 92, 255, 0.72) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-owner-avatar {
  position: relative !important;
  width: 58px !important;
  height: 58px !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 58px !important;
  border-radius: 50% !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  background: linear-gradient(135deg, #f2c2a4, #536bb9) !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08), 0 14px 24px rgba(0, 5, 20, 0.34) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-owner-avatar i {
  position: absolute !important;
  right: 1px !important;
  bottom: 4px !important;
  width: 14px !important;
  height: 14px !important;
  border: 2px solid #07142b !important;
  border-radius: 50% !important;
  background: #42df5d !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-progress-ring {
  width: 58px !important;
  height: 58px !important;
  flex: 0 0 58px !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at center, #07142b 0 54%, transparent 55%),
    conic-gradient(#ef4fbd calc(var(--wf-progress) * 1%), #7249ff 0 31%, rgba(75, 92, 143, 0.5) 0 100%) !important;
  box-shadow: 0 0 18px rgba(132, 87, 255, 0.18) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-chevron {
  margin-left: auto !important;
  color: #8798bb !important;
  -webkit-text-fill-color: #8798bb !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-main-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-transition-panel,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-comments-panel {
  padding: 24px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-panel-title {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  margin-bottom: 24px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-panel-title h3 {
  margin: 0 !important;
  color: #f5f7ff !important;
  -webkit-text-fill-color: #f5f7ff !important;
  font-size: 21px !important;
  line-height: 1.15 !important;
  font-weight: 900 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-panel-title p {
  margin: 6px 0 0 !important;
  color: #a8b5ce !important;
  -webkit-text-fill-color: #a8b5ce !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-grid-admin {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px 24px !important;
}

#system360-app .s360-modal.s360-modal-workflow :is(.s360-label, label.s360-label) {
  margin-bottom: 10px !important;
  color: #d7e0f5 !important;
  -webkit-text-fill-color: #d7e0f5 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
}

#system360-app .s360-modal.s360-modal-workflow :is(.s360-input, .s360-select, .s360-textarea) {
  border: 1px solid rgba(65, 91, 145, 0.92) !important;
  border-radius: 8px !important;
  background: rgba(5, 16, 34, 0.78) !important;
  color: #e8eefc !important;
  -webkit-text-fill-color: #e8eefc !important;
  box-shadow: inset 0 1px 0 rgba(176, 206, 255, 0.05) !important;
}

#system360-app .s360-modal.s360-modal-workflow :is(.s360-input, .s360-select) {
  height: 52px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-textarea {
  min-height: 82px !important;
  resize: vertical !important;
}

#system360-app .s360-modal.s360-modal-workflow #s360-wf-apply-transition {
  width: 238px !important;
  height: 52px !important;
  margin-top: 12px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: linear-gradient(100deg, #5738e8 0%, #a742e8 55%, #ff5b47 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  box-shadow: 0 14px 30px rgba(132, 72, 255, 0.28) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-comments-panel {
  min-height: 220px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-comments,
#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-feed,
#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-tasks {
  margin-top: 16px !important;
  display: grid !important;
  gap: 10px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-comment,
#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-feed-item,
#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-task {
  border: 1px solid rgba(46, 76, 130, 0.72) !important;
  border-radius: 8px !important;
  background: rgba(7, 20, 43, 0.84) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-modal-footer {
  flex: 0 0 auto !important;
  display: flex !important;
  justify-content: flex-end !important;
  padding: 18px 24px !important;
  border-top: 1px solid rgba(48, 78, 132, 0.82) !important;
  background: rgba(5, 15, 32, 0.96) !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-modal-footer .s360-btn {
  min-width: 92px !important;
  height: 48px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(65, 91, 145, 0.9) !important;
  background: #07172f !important;
  color: #f1f5ff !important;
  -webkit-text-fill-color: #f1f5ff !important;
  font-weight: 850 !important;
}

@media (max-width: 980px) {
  #system360-app .s360-modal.s360-modal-workflow .s360-wf-modal-head {
    grid-template-columns: 1fr auto !important;
    padding: 22px !important;
  }

  #system360-app .s360-modal.s360-modal-workflow .s360-wf-head-action {
    min-width: 0 !important;
    width: 100% !important;
  }

  #system360-app .s360-modal.s360-modal-workflow .s360-wf-summary-grid,
  #system360-app .s360-modal.s360-modal-workflow .s360-grid-admin {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-modal {
    padding: 0 18px 20px !important;
  }
}

/* Flujo de venta: estabilizar acomodo sin encimar secciones */
#system360-app .s360-modal.s360-modal-workflow,
#system360-app #s360-modal.s360-modal-workflow {
  width: min(1440px, calc(100vw - 40px)) !important;
  max-width: min(1440px, calc(100vw - 40px)) !important;
  height: min(92vh, 1060px) !important;
  max-height: 92vh !important;
  min-height: 720px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-modal-body.s360-sale-workflow-modal,
#system360-app #s360-modal.s360-modal-workflow .s360-modal-body.s360-sale-workflow-modal {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  grid-auto-rows: max-content !important;
  align-items: start !important;
  align-content: start !important;
  gap: 16px !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0 24px 26px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-modal > section,
#system360-app #s360-modal.s360-modal-workflow .s360-sale-workflow-modal > section,
#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-modal > .s360-grid,
#system360-app #s360-modal.s360-modal-workflow .s360-sale-workflow-modal > .s360-grid {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  grid-column: 1 / -1 !important;
  grid-row: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  z-index: auto !important;
  clear: both !important;
  overflow: visible !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-summary,
#system360-app #s360-modal.s360-modal-workflow .s360-sale-workflow-summary {
  display: block !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: visible !important;
  padding: 18px 20px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-summary-grid,
#system360-app #s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-summary-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-rows: minmax(116px, auto) !important;
  grid-auto-flow: row !important;
  gap: 16px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  align-items: stretch !important;
  align-content: start !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-card,
#system360-app #s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-card {
  position: relative !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 16px !important;
  min-height: 116px !important;
  height: auto !important;
  padding: 20px 18px !important;
  overflow: visible !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-card > div,
#system360-app #s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-card > div {
  min-width: 0 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-card .v,
#system360-app #s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-card .v {
  color: #f5f7ff !important;
  -webkit-text-fill-color: #f5f7ff !important;
  overflow-wrap: anywhere !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-next,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-progress,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-card-timer,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-card-next,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-card-progress,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-card-timer {
  grid-column: span 1 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-main-grid,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-main-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-auto-rows: max-content !important;
  gap: 16px !important;
  overflow: visible !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-transition-panel,
#system360-app .s360-modal.s360-modal-workflow .s360-wf-comments-panel,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-transition-panel,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-comments-panel {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 24px !important;
  overflow: visible !important;
  z-index: auto !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-transition-panel .s360-grid-admin,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-transition-panel .s360-grid-admin {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px 24px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-comments-panel .s360-grid-admin,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-comments-panel .s360-grid-admin {
  grid-template-columns: minmax(240px, 520px) minmax(0, 1fr) !important;
  gap: 18px 24px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-panel-title,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-panel-title {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 16px !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-history-btn,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-history-btn {
  min-width: 150px !important;
  height: 46px !important;
  justify-self: end !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(65, 91, 145, 0.9) !important;
  background: #07172f !important;
  color: #f1f5ff !important;
  -webkit-text-fill-color: #f1f5ff !important;
  font-weight: 850 !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-transition-panel :is(input.s360-input, select.s360-select, textarea.s360-textarea),
#system360-app .s360-modal.s360-modal-workflow .s360-wf-comments-panel :is(input.s360-input, select.s360-select, textarea.s360-textarea),
#system360-app #s360-modal.s360-modal-workflow .s360-wf-transition-panel :is(input.s360-input, select.s360-select, textarea.s360-textarea),
#system360-app #s360-modal.s360-modal-workflow .s360-wf-comments-panel :is(input.s360-input, select.s360-select, textarea.s360-textarea) {
  background: rgba(5, 16, 34, 0.96) !important;
  background-color: rgba(5, 16, 34, 0.96) !important;
  color: #e8eefc !important;
  -webkit-text-fill-color: #e8eefc !important;
}

#system360-app .s360-modal.s360-modal-workflow .s360-wf-transition-panel textarea.s360-textarea,
#system360-app #s360-modal.s360-modal-workflow .s360-wf-transition-panel textarea.s360-textarea {
  min-height: 82px !important;
}

@media (max-width: 1180px) {
  #system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-summary-grid,
  #system360-app #s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  #system360-app .s360-modal.s360-modal-workflow .s360-wf-modal-head,
  #system360-app #s360-modal.s360-modal-workflow .s360-wf-modal-head,
  #system360-app .s360-modal.s360-modal-workflow .s360-wf-panel-title,
  #system360-app #s360-modal.s360-modal-workflow .s360-wf-panel-title,
  #system360-app .s360-modal.s360-modal-workflow .s360-wf-transition-panel .s360-grid-admin,
  #system360-app #s360-modal.s360-modal-workflow .s360-wf-transition-panel .s360-grid-admin,
  #system360-app .s360-modal.s360-modal-workflow .s360-wf-comments-panel .s360-grid-admin,
  #system360-app #s360-modal.s360-modal-workflow .s360-wf-comments-panel .s360-grid-admin,
  #system360-app .s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-summary-grid,
  #system360-app #s360-modal.s360-modal-workflow .s360-sale-workflow-summary .s360-wf-summary-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Nuevo Cliente: modal amplio y formulario sin columnas aplastadas */
body #s360-modal.s360-modal-form360,
#system360-app #s360-modal.s360-modal-form360,
#system360-app .s360-modal.s360-modal-form360 {
  width: min(1360px, calc(100vw - 36px)) !important;
  max-width: min(1360px, calc(100vw - 36px)) !important;
  height: min(92vh, 980px) !important;
  max-height: 92vh !important;
  min-height: min(720px, calc(100vh - 36px)) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

body #s360-modal.s360-modal-form360 .s360-modal-head.s360-form360-head,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-head.s360-form360-head,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-head.s360-form360-head {
  flex: 0 0 auto !important;
  padding: 30px 36px 18px !important;
}

body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body {
  flex: 1 1 auto !important;
  display: grid !important;
  grid-template-columns: minmax(760px, 1fr) minmax(320px, 380px) !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  gap: 18px 20px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  max-height: none !important;
  overflow: auto !important;
  padding: 0 36px 30px !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-steps.s360-wizard-tabs,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-steps.s360-wizard-tabs,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-steps.s360-wizard-tabs {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(150px, 1fr)) !important;
  gap: 10px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 4px 0 8px !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-step,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-step,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-step {
  min-width: 0 !important;
  min-height: 42px !important;
  height: 42px !important;
  justify-content: flex-start !important;
  align-items: center !important;
  padding: 8px 14px !important;
  box-sizing: border-box !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-step-label,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-step-label,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-label {
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  line-height: 1.2 !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-step-pane,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-step-pane,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-pane {
  grid-column: 1 / 2 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-step-pane:not(.active),
#system360-app #s360-modal.s360-modal-form360 .s360-form360-step-pane:not(.active),
#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-pane:not(.active) {
  display: none !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-step-pane.active,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-step-pane.active,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-step-pane.active {
  display: block !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-side-legacy,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-side-legacy,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-side-legacy {
  grid-column: 2 / 3 !important;
  grid-row: 2 !important;
  align-self: start !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 380px !important;
  display: grid !important;
  gap: 12px !important;
  position: sticky !important;
  top: 0 !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-body.s360-form360-body-no-side,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-body.s360-form360-body-no-side,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-body.s360-form360-body-no-side {
  grid-template-columns: minmax(0, 1fr) !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-body.s360-form360-body-no-side .s360-form360-step-pane,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-body.s360-form360-body-no-side .s360-form360-step-pane,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-body.s360-form360-body-no-side .s360-form360-step-pane {
  grid-column: 1 / -1 !important;
}

body #s360-modal.s360-modal-form360 .s360-step1-tabs.s360-form360-substeps,
#system360-app #s360-modal.s360-modal-form360 .s360-step1-tabs.s360-form360-substeps,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-tabs.s360-form360-substeps {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(180px, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

body #s360-modal.s360-modal-form360 .s360-step1-subtab,
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #s360-modal.s360-modal-form360 .s360-step1-subtab.active,
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab.active,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab.active {
  width: 100% !important;
  display: block !important;
}

body #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-grid-admin,
#system360-app #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-grid-admin,
#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-grid-admin {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"],
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"],
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"],
body #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-medical,
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-medical,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-medical {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

body #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row {
  grid-template-columns: 40px minmax(360px, 1fr) minmax(190px, auto) minmax(150px, auto) !important;
  gap: 12px 16px !important;
  align-items: start !important;
  overflow: visible !important;
}

body #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-copy,
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-copy,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-copy {
  min-width: 0 !important;
  max-width: none !important;
}

body #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-q,
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-q,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-q {
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  line-height: 1.35 !important;
  max-width: none !important;
}

body #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-group,
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-group,
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-dot-group {
  min-width: 190px !important;
  display: inline-grid !important;
  grid-template-columns: repeat(2, minmax(84px, 1fr)) !important;
}

body #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items),
#system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items),
#system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items) {
  grid-column: 2 / -1 !important;
  width: 100% !important;
  min-width: 0 !important;
}

@media (max-width: 1180px) {
  body #s360-modal.s360-modal-form360,
  #system360-app #s360-modal.s360-modal-form360,
  #system360-app .s360-modal.s360-modal-form360 {
    width: min(980px, calc(100vw - 24px)) !important;
    max-width: min(980px, calc(100vw - 24px)) !important;
  }

  body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
  #system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
  #system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body {
    grid-template-columns: minmax(0, 1fr) !important;
    padding: 0 24px 26px !important;
  }

  body #s360-modal.s360-modal-form360 .s360-form360-side-legacy,
  #system360-app #s360-modal.s360-modal-form360 .s360-form360-side-legacy,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-side-legacy,
  body #s360-modal.s360-modal-form360 .s360-form360-step-pane,
  #system360-app #s360-modal.s360-modal-form360 .s360-form360-step-pane,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-step-pane {
    grid-column: 1 / -1 !important;
    position: static !important;
    max-width: none !important;
  }
}

@media (max-width: 760px) {
  body #s360-modal.s360-modal-form360 .s360-form360-steps.s360-wizard-tabs,
  #system360-app #s360-modal.s360-modal-form360 .s360-form360-steps.s360-wizard-tabs,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-steps.s360-wizard-tabs,
  body #s360-modal.s360-modal-form360 .s360-step1-tabs.s360-form360-substeps,
  #system360-app #s360-modal.s360-modal-form360 .s360-step1-tabs.s360-form360-substeps,
  #system360-app .s360-modal.s360-modal-form360 .s360-step1-tabs.s360-form360-substeps {
    grid-template-columns: 1fr !important;
  }

  body #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-grid-admin,
  #system360-app #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-grid-admin,
  #system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] .s360-grid-admin,
  body #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
  #system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row,
  #system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] .s360-wz-med-row {
    grid-template-columns: 1fr !important;
  }

  body #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-dot-group, .s360-wz-med-status, .s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items),
  #system360-app #s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-dot-group, .s360-wz-med-status, .s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items),
  #system360-app .s360-modal.s360-modal-form360 .s360-step1-subtab[data-s1-tab$="dico"] :is(.s360-dot-group, .s360-wz-med-status, .s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items) {
    grid-column: 1 / -1 !important;
    justify-self: stretch !important;
  }
}

/* Nuevo Cliente: el paso de pago no invade el resumen lateral */
body #s360-modal.s360-modal-form360,
#system360-app #s360-modal.s360-modal-form360,
#system360-app .s360-modal.s360-modal-form360 {
  width: min(1480px, calc(100vw - 24px)) !important;
  max-width: min(1480px, calc(100vw - 24px)) !important;
}

body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body {
  grid-template-columns: minmax(900px, 1fr) minmax(340px, 400px) !important;
  column-gap: 24px !important;
  overflow-x: hidden !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-side-legacy,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-side-legacy,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-side-legacy {
  z-index: 3 !important;
  max-width: 400px !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step {
  min-width: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  overflow: hidden !important;
  position: relative !important;
  z-index: 1 !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step > *,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step > *,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-tabs,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-tabs,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-tabs {
  max-width: 100% !important;
  padding-bottom: 6px !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-field,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-field,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-field {
  grid-column: span 2 !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-upload-card,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-upload-card,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-upload-card {
  grid-column: span 2 !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-notes-card,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-notes-card,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-notes-card {
  grid-column: span 4 !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step :is(.s360-input, .s360-select, .s360-textarea),
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step :is(.s360-input, .s360-select, .s360-textarea),
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step :is(.s360-input, .s360-select, .s360-textarea) {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  min-height: 40px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(51, 75, 120, 0.72) !important;
  background: linear-gradient(180deg, rgba(6, 15, 31, 0.98), rgba(3, 10, 22, 0.96)) !important;
  background-color: #050d1c !important;
  color: #f1f7ff !important;
  -webkit-text-fill-color: #f1f7ff !important;
  box-shadow: inset 0 1px 0 rgba(124, 153, 210, 0.08) !important;
  color-scheme: dark !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step :is(.s360-input, .s360-select, .s360-textarea)::placeholder,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step :is(.s360-input, .s360-select, .s360-textarea)::placeholder,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step :is(.s360-input, .s360-select, .s360-textarea)::placeholder {
  color: #8ea2bf !important;
  -webkit-text-fill-color: #8ea2bf !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step select.s360-select option,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step select.s360-select option,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step select.s360-select option {
  background: #071225 !important;
  color: #f1f7ff !important;
}

body #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-input option,
body #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-select option,
#system360-app #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-input option,
#system360-app #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-select option,
#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-input option,
#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-select option {
  background: #071225 !important;
  color: #f1f7ff !important;
}

body #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-input option:checked,
body #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-select option:checked,
#system360-app #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-input option:checked,
#system360-app #s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-select option:checked,
#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-input option:checked,
#system360-app .s360-modal.s360-modal-form360 .s360-wz-step[data-wz-step="1"] select.s360-select option:checked {
  background: #2563eb !important;
  color: #ffffff !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step input[type="date"]::-webkit-calendar-picker-indicator,
body #s360-modal.s360-modal-form360 .s360-form360-pay-step input[type="datetime-local"]::-webkit-calendar-picker-indicator,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step input[type="date"]::-webkit-calendar-picker-indicator,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step input[type="datetime-local"]::-webkit-calendar-picker-indicator,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step input[type="date"]::-webkit-calendar-picker-indicator,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  filter: invert(0.92) sepia(0.14) saturate(0.65) hue-rotate(180deg) brightness(1.05) !important;
  opacity: 0.9 !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-table-card,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-table-card,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-table-card {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  margin-top: 2px !important;
  border: 1px solid rgba(50, 76, 122, 0.72) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(7, 17, 35, 0.96), rgba(4, 12, 26, 0.96)) !important;
  background-color: #061226 !important;
  padding: 0 !important;
  box-shadow: inset 0 1px 0 rgba(129, 157, 210, 0.07) !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-table-card .s360-subtitle,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-table-card .s360-subtitle,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-table-card .s360-subtitle {
  margin: 0 !important;
  padding: 12px 14px 14px !important;
  color: #eef6ff !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-table-card .s360-seguimientos-wrap,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-table-card .s360-seguimientos-wrap,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-table-card .s360-seguimientos-wrap,
#system360-app .s360-seguimientos-wrap:has(> table.s360-form360-pay-table) {
  border: 1px solid rgba(57, 84, 133, 0.62) !important;
  border-right: 0 !important;
  border-left: 0 !important;
  border-bottom: 0 !important;
  border-radius: 8px !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  overflow: hidden !important;
  background: linear-gradient(180deg, rgba(8, 18, 36, 0.78), rgba(4, 12, 27, 0.84)) !important;
  background-color: #061224 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table,
#system360-app .s360-seguimientos-wrap:has(> table.s360-form360-pay-table) > table.s360-form360-pay-table {
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table thead,
body #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table thead tr,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table thead,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table thead tr,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table thead,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table thead tr {
  background: transparent !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table thead th,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table thead th,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table thead th {
  background: linear-gradient(180deg, rgba(13, 26, 50, 0.88), rgba(8, 20, 41, 0.88)) !important;
  color: #aabbd8 !important;
  border-bottom: 1px solid rgba(56, 82, 130, 0.58) !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table tbody,
body #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table tbody tr,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table tbody,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table tbody tr,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table tbody,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table tbody tr {
  background: transparent !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table tbody td,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table tbody td,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step table.s360-form360-pay-table tbody td {
  background: rgba(5, 14, 29, 0.82) !important;
  color: #ebf4ff !important;
  border-bottom: 0 !important;
}

@media (max-width: 1320px) {
  body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
  #system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
  #system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body #s360-modal.s360-modal-form360 .s360-form360-side-legacy,
  #system360-app #s360-modal.s360-modal-form360 .s360-form360-side-legacy,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-side-legacy {
    grid-column: 1 / -1 !important;
    position: static !important;
    max-width: none !important;
  }
}

@media (max-width: 1140px) {
  body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid,
  #system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-field,
  #system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-field,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-field,
  body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-upload-card,
  #system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-upload-card,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-upload-card,
  body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-notes-card,
  #system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-notes-card,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid > .s360-form360-pay-notes-card {
    grid-column: span 1 !important;
  }
}

@media (max-width: 820px) {
  body #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid,
  #system360-app #s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid,
  #system360-app .s360-modal.s360-modal-form360 .s360-form360-pay-step .s360-form360-pay-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Nuevo Cliente: separacion definitiva entre formulario y resumen */
body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body {
  grid-template-columns: minmax(0, 1fr) minmax(340px, 400px) !important;
  grid-template-rows: auto auto !important;
  align-items: start !important;
  overflow-x: hidden !important;
}

body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-steps,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-steps,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-steps {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
}

body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-step-pane,
body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-wz-step,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-step-pane,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-wz-step,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-step-pane,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-wz-step {
  grid-column: 1 / 2 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-step-pane.active,
body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-wz-step.active,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-step-pane.active,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-wz-step.active,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-step-pane.active,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-wz-step.active {
  display: block !important;
}

body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-pay-step.active,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-pay-step.active,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-pay-step.active {
  display: grid !important;
}

body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-side-legacy,
#system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-side-legacy,
#system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-side-legacy {
  grid-column: 2 / 3 !important;
  grid-row: 2 !important;
  width: 100% !important;
  max-width: 400px !important;
  min-width: 0 !important;
  justify-self: stretch !important;
  align-self: start !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 2 !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-doc-layout,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-doc-layout,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-layout {
  grid-template-columns: 1fr !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-doc-upload,
body #s360-modal.s360-modal-form360 .s360-form360-doc-categories,
body #s360-modal.s360-modal-form360 .s360-form360-doc-table,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-doc-upload,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-doc-categories,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-doc-table,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-upload,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-categories,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-table {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-doc-table.s360-form360-doc-table-card,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-doc-table.s360-form360-doc-table-card,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-table.s360-form360-doc-table-card {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 10px !important;
  border: 1px solid rgba(50, 76, 122, 0.72) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(7, 17, 35, 0.96), rgba(4, 12, 26, 0.96)) !important;
  padding: 0 !important;
  overflow: hidden !important;
  box-shadow: inset 0 1px 0 rgba(129, 157, 210, 0.07) !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-doc-table.s360-form360-doc-table-card > .s360-subtitle,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-doc-table.s360-form360-doc-table-card > .s360-subtitle,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-table.s360-form360-doc-table-card > .s360-subtitle {
  margin: 0 !important;
  padding: 12px 14px 14px !important;
  color: #eef6ff !important;
}

body #s360-modal.s360-modal-form360 .s360-form360-doc-table.s360-form360-doc-table-card .s360-seguimientos-wrap,
#system360-app #s360-modal.s360-modal-form360 .s360-form360-doc-table.s360-form360-doc-table-card .s360-seguimientos-wrap,
#system360-app .s360-modal.s360-modal-form360 .s360-form360-doc-table.s360-form360-doc-table-card .s360-seguimientos-wrap,
#system360-app .s360-seguimientos-wrap:has(> table.s360-form360-doc-list-table) {
  border: 1px solid rgba(57, 84, 133, 0.62) !important;
  border-right: 0 !important;
  border-left: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(8, 18, 36, 0.78), rgba(4, 12, 27, 0.84)) !important;
  padding: 0 !important;
  overflow: hidden !important;
  box-shadow: none !important;
}

body #s360-modal.s360-modal-form360 table.s360-form360-doc-list-table,
#system360-app #s360-modal.s360-modal-form360 table.s360-form360-doc-list-table,
#system360-app .s360-modal.s360-modal-form360 table.s360-form360-doc-list-table {
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body #s360-modal.s360-modal-form360 table.s360-form360-doc-list-table thead th,
#system360-app #s360-modal.s360-modal-form360 table.s360-form360-doc-list-table thead th,
#system360-app .s360-modal.s360-modal-form360 table.s360-form360-doc-list-table thead th {
  background: linear-gradient(180deg, rgba(13, 26, 50, 0.88), rgba(8, 20, 41, 0.88)) !important;
  color: #aabbd8 !important;
  border-bottom: 1px solid rgba(56, 82, 130, 0.58) !important;
}

body #s360-modal.s360-modal-form360 table.s360-form360-doc-list-table tbody td,
#system360-app #s360-modal.s360-modal-form360 table.s360-form360-doc-list-table tbody td,
#system360-app .s360-modal.s360-modal-form360 table.s360-form360-doc-list-table tbody td {
  background: rgba(5, 14, 29, 0.82) !important;
  color: #ebf4ff !important;
  border-bottom: 0 !important;
}

@media (max-width: 1100px) {
  body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
  #system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body,
  #system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-step-pane,
  body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-wz-step,
  #system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-step-pane,
  #system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-wz-step,
  #system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-step-pane,
  #system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-wz-step {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
  }

  body #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-side-legacy,
  #system360-app #s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-side-legacy,
  #system360-app .s360-modal.s360-modal-form360 .s360-modal-body.s360-sale-wizard.s360-form360-body > .s360-form360-side-legacy {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    position: static !important;
    max-width: none !important;
  }
}

/* Layout principal: sidebar izquierdo desde arriba y topbar recorrida */
@media (min-width: 981px) {
  #system360-app .s360-shell {
    --s360-left-rail-w: 256px;
    display: grid !important;
    grid-template-columns: var(--s360-left-rail-w) minmax(0, 1fr) !important;
    grid-template-rows: 60px minmax(0, 1fr) !important;
    gap: 12px !important;
    align-items: stretch !important;
  }

  #system360-app .s360-shell.collapsed {
    --s360-left-rail-w: 92px;
  }

  #system360-app .s360-shell > .s360-topbar.s360-topbar-global {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    align-self: stretch !important;
  }

  #system360-app .s360-shell > .s360-workarea {
    display: contents !important;
  }

  #system360-app .s360-shell > .s360-workarea > .s360-sidebar {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 3 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    align-self: stretch !important;
    margin: 0 !important;
  }

  #system360-app .s360-shell > .s360-workarea > .s360-main {
    grid-column: 2 / 3 !important;
    grid-row: 2 / 3 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    margin: 0 !important;
  }

  #system360-app .s360-shell > .s360-workarea > .s360-lock-screen,
  #system360-app .s360-shell > .s360-workarea > .s360-work-lock {
    grid-column: 2 / 3 !important;
    grid-row: 2 / 3 !important;
  }
}

/* Loader 360: anillos secundarios en movimiento y desvanecido inferior */
#system360-app .s360-app-system .s360-loading-layer .s360-loading-main {
  position: relative !important;
  gap: 4px !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-main::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: min(286px, 45vw) !important;
  width: min(600px, 90vw) !important;
  height: 150px !important;
  transform: translateX(-50%) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  background:
    radial-gradient(ellipse at center,
      rgba(2, 6, 18, 0.98) 0%,
      rgba(2, 7, 20, 0.88) 34%,
      rgba(3, 8, 24, 0.62) 55%,
      rgba(3, 8, 24, 0.18) 74%,
      transparent 100%) !important;
  filter: blur(15px) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360,
#system360-app .s360-app-system .s360-loading-layer .s360-loading-percent,
#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress,
#system360-app .s360-app-system .s360-loading-layer .s360-loading-subtext {
  position: relative !important;
  z-index: 2 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-track {
  animation: s360-ref-loader-track-drift 12s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-halo {
  animation: s360-ref-loader-halo-drift 13.5s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::before,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360::after {
  content: "" !important;
  position: absolute !important;
  inset: -34px !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 0 !important;
  border: 1px solid rgba(104, 66, 255, 0.20) !important;
  opacity: 0.78 !important;
  transform-origin: 50% 50% !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::before {
  border-left-color: rgba(31, 155, 255, 0.38) !important;
  border-top-color: rgba(128, 71, 255, 0.30) !important;
  animation: s360-ref-loader-outer-drift 16s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::after {
  inset: -54px !important;
  border-right-color: rgba(255, 79, 177, 0.26) !important;
  border-bottom-color: rgba(38, 199, 255, 0.24) !important;
  opacity: 0.55 !important;
  animation: s360-ref-loader-outer-drift-reverse 20s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-percent {
  margin: -24px 0 8px !important;
  transform: translateY(-18px) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress {
  margin: -6px 0 0 !important;
  transform: translateY(-18px) !important;
  position: relative !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: min(650px, 92vw) !important;
  height: 82px !important;
  transform: translate(-50%, -50%) !important;
  border-radius: 999px !important;
  pointer-events: none !important;
  z-index: -1 !important;
  background: radial-gradient(ellipse at center, rgba(1, 5, 16, 0.78), rgba(2, 7, 22, 0.48) 48%, transparent 76%) !important;
  filter: blur(13px) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-subtext {
  margin-top: -10px !important;
  transform: translateY(-18px) !important;
}

@keyframes s360-ref-loader-track-drift {
  from { transform: rotate(0deg); }
  to { transform: rotate(-360deg); }
}

@keyframes s360-ref-loader-halo-drift {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes s360-ref-loader-outer-drift {
  from { transform: rotate(0deg) translate3d(0, 0, 0); }
  to { transform: rotate(360deg) translate3d(0, 0, 0); }
}

@keyframes s360-ref-loader-outer-drift-reverse {
  from { transform: rotate(360deg) translate3d(0, 0, 0); }
  to { transform: rotate(0deg) translate3d(0, 0, 0); }
}

/* Loader 360: brillo reforzado, arcos laterales y sombra inferior visible */
#system360-app .s360-app-system .s360-loading-layer .s360-loading-main {
  gap: 0 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-main::before {
  top: min(318px, 50vw) !important;
  width: min(700px, 94vw) !important;
  height: 230px !important;
  z-index: 2 !important;
  background:
    radial-gradient(ellipse at 50% 30%,
      rgba(1, 5, 16, 0.98) 0%,
      rgba(2, 7, 22, 0.94) 28%,
      rgba(2, 8, 25, 0.78) 48%,
      rgba(3, 9, 27, 0.42) 66%,
      transparent 86%) !important;
  filter: blur(18px) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-main::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: min(366px, 56vw) !important;
  width: min(760px, 96vw) !important;
  height: 120px !important;
  transform: translateX(-50%) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 2 !important;
  background: radial-gradient(ellipse at center, rgba(0, 3, 13, 0.88), rgba(3, 8, 23, 0.44) 52%, transparent 78%) !important;
  filter: blur(16px) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360,
#system360-app .s360-app-system .s360-loading-layer .s360-loading-percent,
#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress,
#system360-app .s360-app-system .s360-loading-layer .s360-loading-subtext {
  z-index: 4 !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360 {
  --s360-loader-thickness: 5px !important;
  margin-bottom: -8px !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-progress {
  background:
    conic-gradient(from -82deg,
      #9b55ff 0deg,
      #d94cff 58deg,
      #ff55b7 112deg,
      #ff9843 166deg,
      transparent 190deg,
      transparent 252deg,
      #20c8ff 282deg,
      #2482ff 318deg,
      transparent 332deg,
      transparent 360deg) !important;
  filter:
    drop-shadow(0 0 10px rgba(155, 85, 255, 0.98))
    drop-shadow(0 0 24px rgba(217, 76, 255, 0.74))
    drop-shadow(0 0 18px rgba(255, 85, 183, 0.62))
    drop-shadow(0 0 16px rgba(32, 200, 255, 0.76)) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360-glow {
  opacity: 1 !important;
  filter: blur(15px) saturate(1.28) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::before,
#system360-app .s360-app-system .s360-loading-layer .s360-loader360::after {
  border: 0 !important;
  opacity: 1 !important;
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px), #000 100%, transparent calc(100% + 1px)) !important;
  mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px), #000 100%, transparent calc(100% + 1px)) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::before {
  inset: -44px !important;
  background:
    conic-gradient(from -90deg,
      transparent 0deg,
      rgba(116, 66, 255, 0.08) 18deg,
      rgba(132, 72, 255, 0.95) 42deg,
      rgba(218, 72, 255, 0.98) 94deg,
      rgba(255, 75, 178, 0.86) 132deg,
      rgba(255, 143, 63, 0.70) 160deg,
      transparent 188deg,
      transparent 360deg) !important;
  filter:
    drop-shadow(0 0 9px rgba(132, 72, 255, 0.9))
    drop-shadow(0 0 20px rgba(255, 75, 178, 0.58)) !important;
  animation: s360-ref-loader-right-arc 4.8s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loader360::after {
  inset: -70px !important;
  background:
    conic-gradient(from -90deg,
      transparent 0deg,
      transparent 206deg,
      rgba(27, 115, 255, 0.05) 224deg,
      rgba(28, 147, 255, 0.78) 252deg,
      rgba(33, 203, 255, 0.95) 279deg,
      rgba(38, 128, 255, 0.55) 306deg,
      transparent 326deg,
      transparent 360deg) !important;
  filter:
    drop-shadow(0 0 8px rgba(33, 203, 255, 0.86))
    drop-shadow(0 0 19px rgba(38, 128, 255, 0.44)) !important;
  animation: s360-ref-loader-left-arc 6.6s linear infinite !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-percent {
  margin: -32px 0 5px !important;
  transform: translateY(-22px) !important;
  font-size: 22px !important;
  text-shadow:
    0 0 18px rgba(140, 82, 255, 0.9),
    0 10px 34px rgba(1, 5, 16, 0.95) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress {
  transform: translateY(-22px) !important;
  box-shadow:
    0 0 0 1px rgba(48, 53, 92, 0.18),
    0 8px 26px rgba(0, 3, 14, 0.76),
    inset 0 0 8px rgba(14, 22, 55, 0.95) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-progress::before {
  width: min(720px, 96vw) !important;
  height: 132px !important;
  background:
    radial-gradient(ellipse at 50% 35%,
      rgba(0, 3, 14, 0.92) 0%,
      rgba(2, 7, 22, 0.76) 42%,
      rgba(3, 8, 24, 0.28) 68%,
      transparent 88%) !important;
  filter: blur(18px) !important;
}

#system360-app .s360-app-system .s360-loading-layer .s360-loading-subtext {
  margin-top: 22px !important;
  transform: translateY(0) !important;
  color: #b5bfd4 !important;
  -webkit-text-fill-color: #b5bfd4 !important;
  font-size: 18px !important;
  text-shadow: 0 8px 30px rgba(0, 3, 14, 0.86) !important;
}

@keyframes s360-ref-loader-right-arc {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes s360-ref-loader-left-arc {
  from { transform: rotate(360deg); }
  to { transform: rotate(0deg); }
}

#system360-app .s360-app-system .s360-quote-builder .s360-grid-admin > div {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-grid-admin > div:focus-within {
  border-color: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-workspace {
  display: grid !important;
  grid-template-columns: minmax(720px, 1.18fr) minmax(500px, 0.82fr) !important;
  gap: 22px !important;
  align-items: start !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane {
  min-width: 0 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-sales-dashboard-split {
  grid-template-columns: 1fr !important;
  gap: 18px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-sales-dashboard-split > .s360-panel {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-grid-admin {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 18px 20px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-grid-admin > * {
  grid-column: auto !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-panel {
  overflow: hidden !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane :is(.s360-input, .s360-select, .s360-textarea) {
  width: 100% !important;
  min-width: 0 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-seguimientos-wrap {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  position: relative !important;
  z-index: 1 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-seguimientos-wrap > table {
  min-width: 820px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-seguimientos-wrap :is(th, td) {
  white-space: nowrap !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-quote-summary-grid,
#system360-app .s360-app-system .s360-quote-builder .s360-quote-form-pane .s360-quote-recap-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-pane {
  position: sticky !important;
  top: 16px !important;
  min-width: 0 !important;
  max-height: calc(100vh - 96px) !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  border: 1px solid rgba(63, 99, 158, 0.72) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 86% 6%, rgba(90, 56, 178, 0.13), transparent 36%),
    linear-gradient(145deg, rgba(8, 19, 39, 0.95), rgba(3, 12, 29, 0.92)) !important;
  box-shadow:
    0 18px 38px rgba(1, 7, 20, 0.24),
    inset 0 1px 0 rgba(121, 157, 222, 0.13) !important;
  overflow: hidden !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 16px 16px 14px !important;
  border-bottom: 1px solid rgba(63, 99, 158, 0.62) !important;
  background: rgba(4, 13, 30, 0.44) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-head h3 {
  margin: 0 !important;
  color: #f2f6ff !important;
  font-size: 16px !important;
  line-height: 1.22 !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-head p {
  margin: 4px 0 0 !important;
  color: #aebbd2 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-head .s360-btn {
  min-height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-head .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-frame-wrap {
  min-height: 0 !important;
  height: min(82vh, 920px) !important;
  padding: 14px !important;
  background:
    linear-gradient(180deg, rgba(4, 10, 24, 0.38), rgba(2, 8, 20, 0.64)),
    repeating-linear-gradient(45deg, rgba(255,255,255,0.025) 0 1px, transparent 1px 10px) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-pdf-preview {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #dce4ef !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
  margin-top: 18px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-notes-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
  margin-top: 20px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-card,
#system360-app .s360-app-system .s360-quote-builder .s360-quote-note-card {
  position: relative !important;
  min-width: 0 !important;
  border: 1px solid rgba(64, 101, 163, 0.72) !important;
  border-radius: 10px !important;
  background:
    radial-gradient(circle at 88% 26%, rgba(94, 50, 174, 0.16), transparent 34%),
    linear-gradient(145deg, rgba(8, 19, 39, 0.94), rgba(3, 13, 31, 0.9)) !important;
  box-shadow:
    0 18px 34px rgba(1, 7, 20, 0.22),
    inset 0 1px 0 rgba(122, 158, 220, 0.14) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-card {
  min-height: 110px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 18px 20px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-card.is-total {
  min-height: 134px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-copy {
  min-width: 0 !important;
  display: grid !important;
  gap: 14px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-card .s360-label,
#system360-app .s360-app-system .s360-quote-builder .s360-quote-note-card .s360-label {
  margin: 0 !important;
  color: #eef4ff !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-value,
#system360-app .s360-app-system .s360-quote-builder .s360-quote-input-wrap {
  min-width: 0 !important;
  color: #f4f7ff !important;
  font-size: clamp(23px, 2.1vw, 28px) !important;
  line-height: 1.08 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-shadow: 0 10px 24px rgba(0, 0, 0, 0.26) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-card.is-total .s360-quote-summary-value {
  color: #27d07a !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-card small {
  color: #aebbd2 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-input-wrap {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 1px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-card-input {
  width: 9ch !important;
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  font: inherit !important;
  letter-spacing: inherit !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-card-input:focus {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-icon {
  width: 56px !important;
  height: 56px !important;
  flex: 0 0 56px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 20px !important;
  color: #d7c9ff !important;
  background: linear-gradient(145deg, rgba(88, 51, 156, 0.78), rgba(39, 31, 83, 0.82)) !important;
  box-shadow: inset 0 1px 0 rgba(210, 190, 255, 0.14), 0 12px 26px rgba(23, 9, 54, 0.32) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-icon.is-green {
  color: #34d98b !important;
  background: linear-gradient(145deg, rgba(20, 96, 72, 0.78), rgba(5, 51, 43, 0.86)) !important;
  box-shadow: inset 0 1px 0 rgba(96, 255, 178, 0.14), 0 12px 26px rgba(2, 39, 31, 0.34) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-icon .s360-svg-icon {
  width: 27px !important;
  height: 27px !important;
  stroke-width: 2.25 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-note-card {
  min-height: 160px !important;
  padding: 20px 18px 18px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-note-card .s360-textarea {
  width: 100% !important;
  min-height: 86px !important;
  margin-top: 14px !important;
  padding: 14px 12px !important;
  border: 1px solid rgba(73, 111, 176, 0.76) !important;
  border-radius: 9px !important;
  background: rgba(4, 13, 30, 0.78) !important;
  box-shadow: inset 0 1px 0 rgba(115, 153, 218, 0.1) !important;
  color: #dce7fb !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  resize: vertical !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-note-card .s360-textarea::placeholder {
  color: #a9b7cc !important;
}

@media (max-width: 1100px) {
  #system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  #system360-app .s360-app-system .s360-quote-builder .s360-quote-summary-grid,
  #system360-app .s360-app-system .s360-quote-builder .s360-quote-notes-grid {
    grid-template-columns: 1fr !important;
  }
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-card {
  margin-top: 22px !important;
  padding: 24px 20px 22px !important;
  border: 1px solid rgba(63, 99, 158, 0.72) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 78% 8%, rgba(38, 88, 162, 0.12), transparent 35%),
    linear-gradient(145deg, rgba(7, 18, 37, 0.96), rgba(3, 12, 29, 0.94)) !important;
  box-shadow:
    0 18px 38px rgba(1, 7, 20, 0.24),
    inset 0 1px 0 rgba(121, 157, 222, 0.13) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-card > h3 {
  margin: 0 0 24px !important;
  color: #f2f6ff !important;
  font-size: clamp(22px, 2vw, 26px) !important;
  line-height: 1.18 !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-metrics {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 18px !important;
  padding: 28px 22px !important;
  border: 1px solid rgba(61, 97, 157, 0.68) !important;
  border-radius: 11px !important;
  background: linear-gradient(145deg, rgba(7, 18, 38, 0.76), rgba(4, 13, 30, 0.68)) !important;
  box-shadow: inset 0 1px 0 rgba(122, 158, 220, 0.11) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-metric {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-icon {
  width: 54px !important;
  height: 54px !important;
  flex: 0 0 54px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: #b9d8ff !important;
  background: rgba(14, 75, 146, 0.54) !important;
  box-shadow: inset 0 1px 0 rgba(180, 218, 255, 0.1), 0 10px 22px rgba(3, 12, 28, 0.22) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-icon.is-green {
  color: #57e19e !important;
  background: rgba(10, 91, 64, 0.62) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-icon.is-yellow {
  color: #ffd65d !important;
  background: rgba(96, 82, 16, 0.64) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-icon.is-red {
  color: #ff7b6f !important;
  background: rgba(101, 35, 41, 0.64) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-icon .s360-svg-icon {
  width: 25px !important;
  height: 25px !important;
  stroke-width: 2.45 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-metric span:not(.s360-quote-recap-icon) {
  display: block !important;
  margin-bottom: 8px !important;
  color: #aebbd2 !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-metric strong {
  display: block !important;
  overflow-wrap: anywhere !important;
  color: #f5f8ff !important;
  font-size: clamp(22px, 1.9vw, 26px) !important;
  line-height: 1.12 !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-ready-card {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 18px !important;
  margin-top: 28px !important;
  padding: 24px 26px !important;
  border: 1px solid rgba(37, 143, 91, 0.6) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 24% 36%, rgba(18, 137, 92, 0.18), transparent 44%),
    linear-gradient(145deg, rgba(7, 58, 45, 0.62), rgba(5, 31, 32, 0.5)) !important;
  box-shadow: inset 0 1px 0 rgba(86, 231, 151, 0.12) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-ready-icon {
  width: 48px !important;
  height: 48px !important;
  display: grid !important;
  place-items: center !important;
  border: 3px solid #27d07a !important;
  border-radius: 999px !important;
  color: #27d07a !important;
  background: rgba(2, 39, 31, 0.2) !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-ready-icon .s360-svg-icon {
  width: 30px !important;
  height: 30px !important;
  stroke-width: 2.6 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-ready-card strong {
  display: block !important;
  margin-bottom: 8px !important;
  color: #f3f8ff !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-ready-card p {
  margin: 0 !important;
  color: #b9c5d8 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-ready-send {
  min-width: 224px !important;
  min-height: 56px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(71, 218, 133, 0.42) !important;
  background: linear-gradient(145deg, #16a65f, #0f7e4b) !important;
  color: #f1fff8 !important;
  box-shadow: 0 14px 26px rgba(6, 88, 54, 0.34), inset 0 1px 0 rgba(173, 255, 207, 0.2) !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

#system360-app .s360-app-system .s360-quote-builder .s360-quote-ready-send .s360-svg-icon {
  width: 21px !important;
  height: 21px !important;
  stroke-width: 2.35 !important;
}

@media (max-width: 1200px) {
  #system360-app .s360-app-system .s360-quote-builder .s360-quote-workspace {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-pane {
    position: relative !important;
    top: auto !important;
    max-height: none !important;
  }

  #system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-frame-wrap {
    height: min(80vh, 820px) !important;
  }

  #system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  #system360-app .s360-app-system .s360-quote-builder .s360-quote-recap-metrics {
    grid-template-columns: 1fr !important;
    padding: 20px 16px !important;
  }

  #system360-app .s360-app-system .s360-quote-builder .s360-quote-ready-card {
    grid-template-columns: auto minmax(0, 1fr) !important;
    padding: 20px 16px !important;
  }

  #system360-app .s360-app-system .s360-quote-builder .s360-quote-ready-send {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  #system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-head {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  #system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-head .s360-btn {
    width: 100% !important;
  }

  #system360-app .s360-app-system .s360-quote-builder .s360-quote-preview-frame-wrap {
    height: 72vh !important;
    padding: 10px !important;
  }
}

/* Form360 group policy controls: keep additional clients matching the main dark design. */
body #s360-modal.s360-modal-form360 .s360-group-member-pane .s360-form360-policy-field .s360-form360-policy-control > :is([data-group-policy-field], [data-group-policy-price], .s360-select, .s360-input, select, input),
#system360-app #s360-modal.s360-modal-form360 .s360-group-member-pane .s360-form360-policy-field .s360-form360-policy-control > :is([data-group-policy-field], [data-group-policy-price], .s360-select, .s360-input, select, input),
#system360-app .s360-modal.s360-modal-form360 .s360-group-member-pane .s360-form360-policy-field .s360-form360-policy-control > :is([data-group-policy-field], [data-group-policy-price], .s360-select, .s360-input, select, input) {
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  border: 1px solid rgba(56, 82, 132, 0.78) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #081224 0%, #050d1c 100%) !important;
  background-color: #071225 !important;
  background-image: linear-gradient(180deg, #081224 0%, #050d1c 100%) !important;
  color: #edf5ff !important;
  -webkit-text-fill-color: #edf5ff !important;
  box-shadow: inset 0 1px 0 rgba(128, 157, 214, 0.08) !important;
  opacity: 1 !important;
  color-scheme: dark !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

body #s360-modal.s360-modal-form360 .s360-group-member-pane .s360-form360-policy-field .s360-form360-policy-control > select option,
#system360-app #s360-modal.s360-modal-form360 .s360-group-member-pane .s360-form360-policy-field .s360-form360-policy-control > select option,
#system360-app .s360-modal.s360-modal-form360 .s360-group-member-pane .s360-form360-policy-field .s360-form360-policy-control > select option {
  background: #071225 !important;
  color: #edf5ff !important;
}

/* Mis ventas: compact dark cells for alert/action block. */
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-alert-cell,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-next-cell {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
  min-width: 180px !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-alert-pill {
  appearance: none !important;
  border: 1px solid rgba(145, 111, 255, .34) !important;
  background: rgba(94, 61, 214, .22) !important;
  color: #a98bff !important;
  border-radius: 999px !important;
  height: 30px !important;
  padding: 0 12px 0 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-alert-pill i {
  width: 9px !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: #8f6cff !important;
  box-shadow: 0 0 0 3px rgba(143, 108, 255, .14) !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-alert-pill.is-ok {
  border-color: rgba(34, 197, 94, .3) !important;
  background: rgba(16, 185, 129, .13) !important;
  color: #35d58f !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-alert-pill.is-ok i {
  background: #35d58f !important;
  box-shadow: 0 0 0 3px rgba(53, 213, 143, .14) !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-alert-pill.is-danger {
  border-color: rgba(248, 113, 113, .36) !important;
  background: rgba(127, 29, 29, .22) !important;
  color: #ff8b8b !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-alert-pill.is-danger i {
  background: #ff6b6b !important;
  box-shadow: 0 0 0 3px rgba(255, 107, 107, .14) !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-cell-sub,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-next-cell span,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-comment-text {
  color: #91a3c5 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-next-cell strong {
  color: #edf3ff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-next-cell b.is-high {
  color: #b78cff !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-next-cell b.is-medium {
  color: #f4b04f !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-next-cell b.is-low {
  color: #53d89f !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-link-btn,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-action-primary {
  height: 40px !important;
  min-height: 40px !important;
  border-radius: 14px !important;
  padding: 0 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  background: rgba(85, 48, 184, .16) !important;
  border: 1px solid rgba(151, 115, 255, .45) !important;
  color: #a98bff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-action-primary {
  min-width: 164px !important;
  background: rgba(16, 185, 129, .08) !important;
  border-color: rgba(16, 185, 129, .46) !important;
  color: #34d399 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-check-cell {
  width: 56px !important;
  min-width: 56px !important;
  text-align: center !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-check-cell input[type="checkbox"] {
  width: 19px !important;
  height: 19px !important;
  border-radius: 5px !important;
  accent-color: #8b6cff !important;
}

/* Mis ventas: first columns with icon layout from the current base design. */
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-sales-table-wrap {
  border: 1px solid rgba(63, 101, 170, .58) !important;
  border-radius: 10px !important;
  background: #050d1b !important;
  box-shadow: inset 0 1px 0 rgba(132, 160, 219, .06) !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table {
  background: #050d1b !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th {
  height: 72px !important;
  padding: 0 16px !important;
  background: linear-gradient(180deg, #0b172d 0%, #061021 100%) !important;
  border-bottom: 1px solid rgba(64, 107, 186, .68) !important;
  border-right: 1px solid rgba(19, 35, 63, .72) !important;
  color: #dce7fb !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td {
  height: 88px !important;
  padding: 14px 16px !important;
  background: #061020 !important;
  border-bottom: 1px solid rgba(27, 53, 91, .82) !important;
  border-right: 1px solid rgba(18, 34, 61, .78) !important;
  color: #edf4ff !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
  vertical-align: middle !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th:nth-child(1),
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td:nth-child(1) { width: 198px !important; min-width: 198px !important; }
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th:nth-child(2),
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td:nth-child(2) { width: 190px !important; min-width: 190px !important; }
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th:nth-child(3),
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td:nth-child(3) { width: 224px !important; min-width: 224px !important; }
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th:nth-child(4),
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td:nth-child(4) { width: 170px !important; min-width: 170px !important; }
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th:nth-child(5),
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td:nth-child(5) { width: 200px !important; min-width: 200px !important; }
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th:nth-child(6),
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td:nth-child(6) { width: 178px !important; min-width: 178px !important; }
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th:nth-child(7),
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td:nth-child(7) { width: 222px !important; min-width: 222px !important; }
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th:nth-child(8),
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td:nth-child(8) { width: 124px !important; min-width: 124px !important; }

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-sort-icon {
  display: inline-flex !important;
  margin-left: 8px !important;
  color: #8fa3c6 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  opacity: .92 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-id-cell,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-person-cell,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-phone-cell,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-service-cell {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-phone-cell,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-service-cell {
  justify-content: space-between !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-id-cell strong,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-person-cell strong,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-service-cell strong,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-phone-cell span:first-child,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-client-link {
  color: #f4f8ff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-date-cell {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 5px !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-date-cell strong {
  color: #f4f8ff !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-date-cell span {
  color: #91a3c5 !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1.1 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-cell-icon {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(132, 103, 255, .12) !important;
  background: rgba(73, 48, 155, .24) !important;
  color: #9f7aff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-cell-icon svg,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-cell-icon .material-symbols-rounded {
  width: 20px !important;
  height: 20px !important;
  font-size: 21px !important;
  color: currentColor !important;
  stroke-width: 2.2 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-cell-icon.is-phone,
#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-cell-icon.is-shield {
  background: rgba(21, 60, 122, .34) !important;
  border-color: rgba(57, 134, 255, .15) !important;
  color: #2f8dff !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-status-pill {
  appearance: none !important;
  border: 1px solid rgba(145, 111, 255, .28) !important;
  background: rgba(94, 61, 214, .22) !important;
  color: #a98bff !important;
  border-radius: 999px !important;
  height: 30px !important;
  padding: 0 13px 0 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-status-pill i {
  width: 9px !important;
  height: 9px !important;
  min-width: 9px !important;
  border-radius: 999px !important;
  background: #8f6cff !important;
  box-shadow: 0 0 0 3px rgba(143, 108, 255, .14) !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-status-pill.is-ok {
  border-color: rgba(34, 197, 94, .28) !important;
  background: rgba(16, 185, 129, .13) !important;
  color: #35d58f !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-status-pill.is-ok i {
  background: #35d58f !important;
  box-shadow: 0 0 0 3px rgba(53, 213, 143, .14) !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-status-pill.is-warn {
  border-color: rgba(168, 139, 250, .3) !important;
  background: rgba(109, 40, 217, .18) !important;
  color: #b69aff !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-status-pill.is-danger {
  border-color: rgba(248, 113, 113, .34) !important;
  background: rgba(127, 29, 29, .2) !important;
  color: #ff8b8b !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-status-pill.is-danger i {
  background: #ff6b6b !important;
  box-shadow: 0 0 0 3px rgba(255, 107, 107, .14) !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-info-cell {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  min-width: 0 !important;
  width: 100% !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-info-cell.is-icon-right {
  justify-content: space-between !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-value {
  color: #f4f8ff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(132, 103, 255, .14) !important;
  background: rgba(73, 48, 155, .24) !important;
  color: #9f7aff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon svg {
  width: 19px !important;
  height: 19px !important;
  color: currentColor !important;
  stroke-width: 2.2 !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-phone,
#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-email,
#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-shield {
  background: rgba(21, 60, 122, .34) !important;
  border-color: rgba(57, 134, 255, .15) !important;
  color: #2f8dff !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-money,
#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-receipt {
  background: rgba(13, 101, 82, .22) !important;
  border-color: rgba(45, 212, 191, .16) !important;
  color: #2dd4bf !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-advisor {
  background: rgba(76, 45, 135, .24) !important;
  border-color: rgba(168, 139, 250, .16) !important;
  color: #b69aff !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-age,
#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-date,
#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-schedule {
  background: rgba(14, 64, 110, .24) !important;
  border-color: rgba(125, 211, 252, .16) !important;
  color: #7dd3fc !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-dependents,
#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-target {
  background: rgba(88, 62, 20, .26) !important;
  border-color: rgba(251, 191, 36, .18) !important;
  color: #fbbf24 !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-medical,
#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-cell-icon.is-comment {
  background: rgba(30, 64, 175, .22) !important;
  border-color: rgba(129, 140, 248, .17) !important;
  color: #818cf8 !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-status-pill {
  border: 1px solid rgba(145, 111, 255, .28) !important;
  background: rgba(94, 61, 214, .22) !important;
  color: #a98bff !important;
  border-radius: 999px !important;
  height: 30px !important;
  padding: 0 13px 0 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-status-pill i {
  width: 9px !important;
  height: 9px !important;
  min-width: 9px !important;
  border-radius: 999px !important;
  background: currentColor !important;
  box-shadow: 0 0 0 3px rgba(143, 108, 255, .14) !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-status-pill.is-ok {
  border-color: rgba(34, 197, 94, .28) !important;
  background: rgba(16, 185, 129, .13) !important;
  color: #35d58f !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-status-pill.is-warn {
  border-color: rgba(168, 139, 250, .3) !important;
  background: rgba(109, 40, 217, .18) !important;
  color: #b69aff !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-iconified-table .s360-db360-status-pill.is-danger {
  border-color: rgba(248, 113, 113, .34) !important;
  background: rgba(127, 29, 29, .2) !important;
  color: #ff8b8b !important;
}

#system360-app .s360-app.s360-app-system .s360-backoffice-upload-modal {
  max-height: min(78vh, 820px) !important;
  overflow: auto !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-upload-status {
  position: sticky !important;
  top: 0 !important;
  z-index: 6 !important;
  background: rgba(5, 15, 34, .94) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(82, 126, 204, .22) !important;
  border-radius: 8px !important;
  margin-bottom: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-upload-status > b {
  min-width: 92px !important;
  text-align: center !important;
  color: #7dd3fc !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  letter-spacing: .02em !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-upload-tabs {
  margin-bottom: 10px !important;
  overflow-x: auto !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-upload-actions {
  margin-bottom: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-upload-body {
  min-height: 260px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-read-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 10px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-read-field {
  min-height: 72px !important;
  border: 1px solid rgba(82, 126, 204, .18) !important;
  background: rgba(6, 18, 38, .72) !important;
  border-radius: 8px !important;
  padding: 10px 44px 10px 12px !important;
  position: relative !important;
  display: grid !important;
  gap: 7px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-read-field > span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #91a3c5 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-read-field > span svg {
  width: 15px !important;
  height: 15px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-read-field > b {
  color: #f4f8ff !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  line-height: 1.25 !important;
  word-break: break-word !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-copy-field {
  position: absolute !important;
  right: 9px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(57, 134, 255, .2) !important;
  background: rgba(21, 60, 122, .34) !important;
  color: #7dd3fc !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-copy-field:disabled {
  opacity: .38 !important;
  cursor: default !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-copy-field svg {
  width: 15px !important;
  height: 15px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-row-actions {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-row-actions .s360-bo-copy-field {
  position: static !important;
  transform: none !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-btn {
  min-height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(125, 211, 252, .32) !important;
  background: rgba(14, 47, 86, .38) !important;
  color: #c8f1ff !important;
  padding: 5px 9px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-btn svg {
  width: 15px !important;
  height: 15px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-btn strong {
  font-weight: 900 !important;
  font-size: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-btn small {
  color: rgba(226, 246, 255, .7) !important;
  font-size: 11px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-btn.is-warn {
  border-color: rgba(251, 191, 36, .38) !important;
  background: rgba(120, 76, 10, .34) !important;
  color: #ffe3a3 !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-btn.is-danger {
  border-color: rgba(248, 113, 113, .42) !important;
  background: rgba(127, 29, 29, .38) !important;
  color: #ffc4c4 !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-modal {
  display: grid !important;
  gap: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-hero {
  border: 1px solid rgba(125, 211, 252, .28) !important;
  background: linear-gradient(180deg, rgba(14, 47, 86, .48), rgba(6, 18, 38, .72)) !important;
  border-radius: 8px !important;
  padding: 14px !important;
  display: grid !important;
  gap: 6px !important;
  justify-items: center !important;
  text-align: center !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-hero > span {
  width: 38px !important;
  height: 38px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(125, 211, 252, .16) !important;
  color: #7dd3fc !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-hero strong {
  color: #f4f8ff !important;
  font-size: 26px !important;
  font-weight: 950 !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-hero small {
  color: #9eb3d6 !important;
  font-weight: 750 !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-beneficiaries {
  border: 1px solid rgba(82, 126, 204, .2) !important;
  background: rgba(6, 18, 38, .62) !important;
  border-radius: 8px !important;
  padding: 10px !important;
  display: grid !important;
  gap: 8px !important;
  max-height: 180px !important;
  overflow: auto !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-beneficiaries[hidden] {
  display: none !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-beneficiaries article {
  border: 1px solid rgba(125, 211, 252, .18) !important;
  border-radius: 8px !important;
  padding: 8px 10px !important;
  background: rgba(14, 47, 86, .22) !important;
  display: grid !important;
  gap: 4px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-beneficiaries strong {
  color: #f4f8ff !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-beneficiaries span {
  color: #9eb3d6 !important;
  font-size: 12px !important;
}

#system360-app .s360-app.s360-app-system .s360-bo-counter-actions {
  justify-content: flex-end !important;
  gap: 8px !important;
}

#system360-app #s360-wz-add-member {
  min-height: 42px !important;
  border: 1px solid rgba(34, 197, 94, .36) !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, rgba(12, 96, 60, .44), rgba(6, 55, 39, .38)) !important;
  color: #35d58f !important;
  box-shadow: inset 0 1px 0 rgba(162, 255, 206, .08), 0 12px 24px rgba(0, 0, 0, .18) !important;
  font-weight: 850 !important;
}

#system360-app #s360-wz-add-member:hover {
  border-color: rgba(53, 213, 143, .56) !important;
  background: linear-gradient(180deg, rgba(13, 120, 72, .56), rgba(7, 68, 47, .46)) !important;
  color: #77f5b9 !important;
  transform: translateY(-1px) !important;
}

#system360-app #s360-wz-add-dependent {
  min-height: 42px !important;
  border: 1px solid rgba(34, 197, 94, .42) !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, rgba(7, 124, 78, .5), rgba(4, 75, 51, .44)) !important;
  color: #77f5b9 !important;
  box-shadow: inset 0 1px 0 rgba(162, 255, 206, .1), 0 12px 24px rgba(0, 0, 0, .18) !important;
  font-weight: 850 !important;
}

#system360-app #s360-wz-add-dependent:hover {
  border-color: rgba(53, 213, 143, .62) !important;
  background: linear-gradient(180deg, rgba(12, 148, 89, .6), rgba(7, 86, 58, .5)) !important;
  color: #b7ffd7 !important;
  transform: translateY(-1px) !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup {
  width: min(640px, 100%) !important;
  border: 1px solid rgba(57, 89, 143, .72) !important;
  border-radius: 12px !important;
  background: radial-gradient(circle at 0 0, rgba(76, 91, 194, .2), transparent 34%), linear-gradient(145deg, rgba(8, 18, 39, .98), rgba(3, 12, 29, .99)) !important;
  box-shadow: inset 0 1px 0 rgba(150, 177, 229, .09), 0 28px 80px rgba(0, 0, 0, .5) !important;
  color: #e8f1ff !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup header {
  border-bottom: 1px solid rgba(57, 89, 143, .42) !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup .s360-message-popup-icon {
  border-radius: 50% !important;
  background: linear-gradient(145deg, rgba(61, 67, 150, .72), rgba(33, 43, 103, .72)) !important;
  color: #d9e5ff !important;
  box-shadow: inset 0 0 0 1px rgba(139, 165, 255, .18), 0 10px 22px rgba(42, 45, 125, .24) !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup .s360-message-popup-close {
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(58, 86, 137, .78) !important;
  border-radius: 9px !important;
  background: linear-gradient(180deg, rgba(9, 21, 42, .94), rgba(6, 15, 31, .9)) !important;
  color: #cbd9f0 !important;
  box-shadow: none !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup .s360-message-popup-close:hover {
  border-color: rgba(112, 139, 198, .82) !important;
  background: linear-gradient(180deg, rgba(13, 29, 56, .98), rgba(8, 18, 37, .94)) !important;
  color: #eef5ff !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-body {
  padding: 18px !important;
  display: grid !important;
  gap: 14px !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup .s360-label {
  display: grid !important;
  gap: 7px !important;
  color: #9db8e2 !important;
  font-size: 12px !important;
  font-weight: 760 !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup .s360-label b {
  color: #ff6687 !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup :is(.s360-input, .s360-select, input, select) {
  width: 100% !important;
  min-height: 40px !important;
  border: 1px solid rgba(51, 75, 120, .72) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(6, 15, 31, .98), rgba(3, 10, 22, .96)) !important;
  background-color: #050d1c !important;
  color: #f1f7ff !important;
  -webkit-text-fill-color: #f1f7ff !important;
  box-shadow: inset 0 1px 0 rgba(124, 153, 210, .08) !important;
  color-scheme: dark !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup :is(.s360-input, input)::placeholder {
  color: #8ea2bf !important;
  -webkit-text-fill-color: #8ea2bf !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup :is(.s360-input, .s360-select, input, select):focus {
  outline: none !important;
  border-color: rgba(111, 152, 224, .84) !important;
  box-shadow: 0 0 0 3px rgba(74, 114, 189, .22), inset 0 1px 0 rgba(124, 153, 210, .08) !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup select option {
  background: #071225 !important;
  color: #f1f7ff !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup footer {
  gap: 12px !important;
  border-top: 1px solid rgba(57, 89, 143, .36) !important;
  padding: 16px 18px 18px !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup footer .s360-btn {
  min-width: 126px !important;
  min-height: 42px !important;
  height: 42px !important;
  border-radius: 9px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 760 !important;
  box-shadow: none !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup footer .s360-btn.sec {
  border: 1px solid rgba(58, 86, 137, .78) !important;
  background: linear-gradient(180deg, rgba(9, 21, 42, .94), rgba(6, 15, 31, .9)) !important;
  color: #cbd9f0 !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup footer .s360-btn.ok {
  border: 1px solid rgba(34, 197, 94, .36) !important;
  background: linear-gradient(180deg, rgba(12, 96, 60, .5), rgba(6, 55, 39, .44)) !important;
  color: #35d58f !important;
}

#system360-app #s360-add-member-popup-host .s360-add-member-popup footer .s360-btn:hover {
  transform: translateY(-1px) !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-popup {
  width: min(1180px, calc(100vw - 32px)) !important;
  max-width: min(1180px, calc(100vw - 32px)) !important;
  max-height: min(90vh, 900px) !important;
  overflow: auto !important;
  border: 1px solid rgba(57, 89, 143, .72) !important;
  border-radius: 12px !important;
  background: radial-gradient(circle at 0 0, rgba(76, 91, 194, .2), transparent 34%), linear-gradient(145deg, rgba(8, 18, 39, .98), rgba(3, 12, 29, .99)) !important;
  box-shadow: inset 0 1px 0 rgba(150, 177, 229, .09), 0 28px 80px rgba(0, 0, 0, .5) !important;
  color: #e8f1ff !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-popup header,
#system360-app #s360-add-dependent-popup-host .s360-add-member-popup footer {
  border-color: rgba(57, 89, 143, .42) !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-popup .s360-message-popup-icon {
  border-radius: 50% !important;
  background: linear-gradient(145deg, rgba(12, 96, 60, .62), rgba(7, 58, 42, .72)) !important;
  color: #c8ffdf !important;
  box-shadow: inset 0 0 0 1px rgba(139, 255, 183, .18), 0 10px 22px rgba(7, 80, 48, .24) !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-popup .s360-message-popup-close,
#system360-app #s360-add-dependent-popup-host .s360-add-member-popup footer .s360-btn.sec {
  border: 1px solid rgba(58, 86, 137, .78) !important;
  background: linear-gradient(180deg, rgba(9, 21, 42, .94), rgba(6, 15, 31, .9)) !important;
  color: #cbd9f0 !important;
  box-shadow: none !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-popup footer .s360-btn.ok {
  border: 1px solid rgba(34, 197, 94, .4) !important;
  background: linear-gradient(180deg, rgba(12, 96, 60, .5), rgba(6, 55, 39, .44)) !important;
  color: #77f5b9 !important;
  box-shadow: none !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-body {
  padding: 20px 24px !important;
  display: grid !important;
  gap: 16px !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-dependent-tabs {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(180px, 1fr)) !important;
  gap: 10px !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-dependent-pane {
  min-width: 0 !important;
  width: 100% !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-dependent-pane[data-add-dependent-pane="historial"] {
  background: linear-gradient(180deg, rgba(8, 19, 40, .96), rgba(5, 14, 31, .98)) !important;
  border: 1px solid rgba(70, 103, 162, .46) !important;
  border-radius: 12px !important;
  padding: 18px !important;
  color: #edf5ff !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-dependent-pane[data-add-dependent-pane="historial"] .s360-subtitle {
  color: #f4f8ff !important;
  margin: 0 0 14px !important;
}

#system360-app #s360-add-dependent-popup-host .s360-wz-medical {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
}

#system360-app #s360-add-dependent-popup-host .s360-wz-med-row {
  display: grid !important;
  grid-template-columns: 40px minmax(420px, 1fr) minmax(190px, auto) !important;
  gap: 12px 16px !important;
  align-items: start !important;
  padding: 16px !important;
  border: 1px solid rgba(72, 105, 164, .48) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(11, 26, 52, .98), rgba(7, 18, 38, .98)) !important;
  color: #eaf2ff !important;
  box-shadow: inset 0 1px 0 rgba(157, 184, 226, .08) !important;
}

#system360-app #s360-add-dependent-popup-host .s360-wz-med-copy,
#system360-app #s360-add-dependent-popup-host .s360-wz-med-q {
  min-width: 0 !important;
  max-width: none !important;
  color: #f1f6ff !important;
}

#system360-app #s360-add-dependent-popup-host .s360-wz-med-q {
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

#system360-app #s360-add-dependent-popup-host .s360-wz-med-required {
  color: #93c5fd !important;
}

#system360-app #s360-add-dependent-popup-host .s360-wz-med-index span {
  background: rgba(37, 99, 216, .24) !important;
  border-color: rgba(95, 139, 224, .52) !important;
  color: #dceaff !important;
}

#system360-app #s360-add-dependent-popup-host .s360-dot-group {
  min-width: 190px !important;
  display: inline-grid !important;
  grid-template-columns: repeat(2, minmax(84px, 1fr)) !important;
}

#system360-app #s360-add-dependent-popup-host :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items) {
  grid-column: 2 / -1 !important;
  width: 100% !important;
  min-width: 0 !important;
}

#system360-app #s360-add-dependent-popup-host .s360-wz-item-row {
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) minmax(160px, .5fr) minmax(150px, .4fr) auto !important;
  gap: 10px !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-popup .s360-label {
  display: grid !important;
  gap: 7px !important;
  color: #9db8e2 !important;
  font-size: 12px !important;
  font-weight: 760 !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-popup :is(.s360-input, .s360-select, input, select) {
  width: 100% !important;
  min-height: 40px !important;
  border: 1px solid rgba(51, 75, 120, .72) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(6, 15, 31, .98), rgba(3, 10, 22, .96)) !important;
  background-color: #050d1c !important;
  color: #f1f7ff !important;
  -webkit-text-fill-color: #f1f7ff !important;
  box-shadow: inset 0 1px 0 rgba(124, 153, 210, .08) !important;
  color-scheme: dark !important;
}

#system360-app #s360-add-dependent-popup-host .s360-add-member-popup select option {
  background: #071225 !important;
  color: #f1f7ff !important;
}

@media (max-width: 720px) {
  #system360-app #s360-add-member-popup-host .s360-add-member-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #system360-app #s360-add-dependent-popup-host .s360-add-member-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #system360-app #s360-add-dependent-popup-host .s360-add-dependent-tabs,
  #system360-app #s360-add-dependent-popup-host .s360-wz-med-row,
  #system360-app #s360-add-dependent-popup-host .s360-wz-item-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #system360-app #s360-add-dependent-popup-host :is(.s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items) {
    grid-column: 1 / -1 !important;
  }
}
/* Mis ventas: accesos visuales junto a pestañas. */
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  gap: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-view-tabs {
  width: auto !important;
  max-width: max-content !important;
  flex: 0 1 auto !important;
  margin: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-title-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 14px !important;
  margin-left: auto !important;
  flex: 0 0 auto !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel button.s360-my-sales-icon-action {
  width: 40px !important;
  min-width: 40px !important;
  min-height: 0 !important;
  height: auto !important;
  display: grid !important;
  place-items: center !important;
  gap: 5px !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel button.s360-my-sales-icon-action > span {
  width: 38px !important;
  height: 38px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: var(--s360-sales-access-color, #8b5cf6) !important;
  border: 1px solid color-mix(in srgb, var(--s360-sales-access-color, #8b5cf6) 72%, transparent) !important;
  background:
    radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--s360-sales-access-color, #8b5cf6) 18%, transparent), transparent 45%),
    linear-gradient(145deg, rgba(9, 21, 52, .98), rgba(3, 11, 29, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 0 16px color-mix(in srgb, var(--s360-sales-access-color, #8b5cf6) 24%, transparent),
    0 10px 22px rgba(0,0,0,.28) !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel button.s360-my-sales-icon-action .s360-my-sales-access-svg {
  width: 22px !important;
  height: 22px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 4 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel button.s360-my-sales-icon-action strong {
  display: none !important;
}

/* Mis ventas resumen: evitar fondos grises heredados y mantener dashboard oscuro. */
#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-summary :is(.s360-my-sales-kpi, .s360-my-sales-chart-card, .s360-my-sales-mini-card) {
  border: 1px solid rgba(34, 74, 135, .62) !important;
  border-radius: 10px !important;
  background:
    radial-gradient(circle at 78% 0%, rgba(31, 74, 145, .20), transparent 36%),
    linear-gradient(180deg, rgba(7, 18, 42, .98) 0%, rgba(4, 12, 29, .98) 100%) !important;
  background-color: #061126 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 18px 40px rgba(0,0,0,.28) !important;
  color: #eef5ff !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-summary :is(.s360-my-sales-kpi, .s360-my-sales-chart-card, .s360-my-sales-mini-card) * {
  background-color: transparent;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-summary .s360-my-sales-kpi > i {
  background: color-mix(in srgb, currentColor 14%, rgba(255,255,255,.04)) !important;
  border: 1px solid color-mix(in srgb, currentColor 24%, transparent) !important;
  color: currentColor !important;
  box-shadow: 0 0 22px color-mix(in srgb, currentColor 24%, transparent) !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-summary .s360-my-sales-kpi > i svg {
  width: 24px !important;
  height: 24px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 4 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-summary .s360-my-sales-line-chart {
  height: 220px !important;
  background: linear-gradient(180deg, rgba(91, 115, 179, .08), rgba(91, 115, 179, .02)) !important;
  border: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-summary .s360-my-sales-line-goal {
  fill: none !important;
  stroke: rgba(14, 116, 255, .82) !important;
  stroke-width: 3 !important;
  stroke-dasharray: 14 12 !important;
}

#system360-app .s360-app.s360-app-system .s360-sales-panel .s360-my-sales-summary .s360-my-sales-line-real {
  fill: none !important;
  stroke: #8b5cf6 !important;
  stroke-width: 5 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* Calidad DB360 toolbar: keep controls inside the panel */
#system360-app .s360-quality-shell .s360-db360-toolbar {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  padding: 16px 18px !important;
}

#system360-app .s360-quality-shell .s360-db360-toolbar-main {
  display: grid !important;
  grid-template-columns: minmax(300px, 360px) 224px 190px minmax(300px, 1fr) !important;
  gap: 18px 28px !important;
  align-items: end !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

#system360-app .s360-quality-shell .s360-db360-toolbar-main > label,
#system360-app .s360-quality-shell .s360-db360-toolbar-filters > label,
#system360-app .s360-quality-shell .s360-db360-date-menu {
  min-width: 0 !important;
  max-width: 100% !important;
}

#system360-app .s360-quality-shell .s360-db360-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 18px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding-bottom: 0 !important;
}

#system360-app .s360-quality-shell .s360-db360-toolbar-filters {
  display: grid !important;
  grid-template-columns: 124px 150px 160px 170px 170px max-content max-content max-content 140px max-content !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

#system360-app .s360-quality-shell .s360-db360-filter-select {
  min-width: 0 !important;
  max-width: none !important;
}

#system360-app .s360-quality-shell .s360-db360-date-menu {
  min-width: 0 !important;
  max-width: none !important;
}

#system360-app .s360-quality-shell .s360-db360-selected {
  white-space: nowrap !important;
  min-width: 112px !important;
  text-align: center !important;
}

#system360-app .s360-quality-shell .s360-db360-toolbar .s360-btn,
#system360-app .s360-quality-shell .s360-db360-filter-btn,
#system360-app .s360-quality-shell .s360-db360-date-menu summary {
  flex: 0 0 auto !important;
  min-width: 104px !important;
  max-width: 180px !important;
  white-space: nowrap !important;
}

#system360-app .s360-quality-shell .s360-db360-toolbar button[data-db360-bulk-delete] {
  width: 140px !important;
  min-width: 140px !important;
  max-width: 140px !important;
}

#system360-app .s360-quality-shell .s360-db360-toolbar :is(.s360-input, .s360-select) {
  width: 100% !important;
  min-width: 0 !important;
}

#system360-app .s360-quality-shell .s360-db360-view-switch {
  width: 100% !important;
  min-width: 214px !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(98px, 1fr)) !important;
  gap: 0 !important;
  overflow: hidden !important;
}

#system360-app .s360-quality-shell .s360-db360-view-switch button {
  min-width: 98px !important;
  width: 100% !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  white-space: nowrap !important;
}

#system360-app .s360-quality-shell .s360-db360-view-switch button .s360-svg-icon {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
}

#system360-app .s360-quality-shell .s360-db360-view-switch button span {
  display: inline-block !important;
  min-width: max-content !important;
}

@media (max-width: 1280px) {
  #system360-app .s360-quality-shell .s360-db360-toolbar-main {
    grid-template-columns: minmax(280px, 1fr) 224px !important;
  }

  #system360-app .s360-quality-shell .s360-db360-actions {
    grid-column: 1 / -1 !important;
    justify-content: flex-start !important;
  }

  #system360-app .s360-quality-shell .s360-db360-toolbar-filters {
    grid-template-columns: repeat(4, minmax(150px, 1fr)) !important;
  }

  #system360-app .s360-quality-shell .s360-db360-selected {
    text-align: left !important;
  }
}

@media (max-width: 760px) {
  #system360-app .s360-quality-shell .s360-db360-toolbar-main {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-quality-shell .s360-db360-actions,
  #system360-app .s360-quality-shell .s360-db360-toolbar-filters {
    align-items: stretch !important;
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-quality-shell .s360-db360-toolbar .s360-btn,
  #system360-app .s360-quality-shell .s360-db360-filter-btn,
  #system360-app .s360-quality-shell .s360-db360-filter-select,
  #system360-app .s360-quality-shell .s360-db360-date-menu,
  #system360-app .s360-quality-shell .s360-db360-date-menu summary {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Calidad: flat table surface, no nested card containers */
#system360-app .s360-quality-shell {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#system360-app .s360-quality-shell .s360-quality-topbar {
  padding: 0 0 14px !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-quality-shell .s360-quality-table-panel {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: grid !important;
  gap: 14px !important;
}

#system360-app .s360-quality-shell .s360-db360-toolbar {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 0 14px !important;
}

#system360-app .s360-quality-shell .s360-db360-toolbar-main,
#system360-app .s360-quality-shell .s360-db360-toolbar-filters {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-quality-shell .s360-seguimientos-wrap.s360-db360-table-wrap,
#system360-app .s360-quality-shell .s360-db360-table-wrap {
  border: 1px solid rgba(80, 112, 184, .58) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(120% 120% at 50% -40%, rgba(65, 105, 210, .12), transparent 56%),
    linear-gradient(180deg, rgba(8, 16, 36, .96), rgba(5, 11, 27, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 12px 26px rgba(0, 6, 20, .28) !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
}

#system360-app .s360-quality-shell .s360-seguimientos-wrap.s360-db360-table-wrap > table.s360-db360-table,
#system360-app .s360-quality-shell .s360-db360-table-wrap > table.s360-db360-table {
  border-radius: 0 !important;
  overflow: visible !important;
}

#system360-app .s360-quality-shell .s360-db360-table-wrap > .s360-db360-end-spacer {
  height: 12px !important;
}

#system360-app .s360-quality-shell .s360-atcdb-pager,
#system360-app .s360-quality-shell .s360-table-pager,
#system360-app .s360-quality-shell .s360-pager {
  margin-top: 2px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Calidad: misma composicion visual que Mis ventas */
#system360-app .s360-app.s360-app-system .s360-quality-shell {
  border: 1px solid rgba(72, 105, 176, .66) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 80% -10%, rgba(44, 83, 172, .16), transparent 34%),
    linear-gradient(180deg, rgba(8, 17, 39, .98), rgba(4, 11, 28, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 18px 38px rgba(0, 0, 0, .26) !important;
  padding: 22px !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-quality-topbar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-quality-tabs {
  margin: 0 !important;
  width: auto !important;
  max-width: max-content !important;
  flex: 0 1 auto !important;
  align-self: center !important;
  display: inline-flex !important;
  gap: 0 !important;
  padding: 8px !important;
  border: 1px solid rgba(62, 96, 166, .66) !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, rgba(8, 20, 48, .96), rgba(5, 13, 34, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-quality-tabs .s360-folder-tab {
  min-height: 52px !important;
  height: 52px !important;
  padding: 0 24px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: rgba(205, 220, 247, .74) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-quality-tabs .s360-folder-tab.active,
#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-quality-tabs .s360-folder-tab.is-active {
  color: #fff !important;
  background: linear-gradient(135deg, #2563eb 0%, #b936bf 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 10px 24px rgba(88, 84, 236, .28) !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-db360-toolbar {
  border: 1px solid rgba(64, 102, 178, .72) !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 50% -60%, rgba(48, 87, 184, .16), transparent 52%),
    linear-gradient(180deg, rgba(7, 18, 42, .98), rgba(4, 12, 29, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
  padding: 22px 24px !important;
  margin: 0 0 14px !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-db360-toolbar-main,
#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-db360-toolbar-filters {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-db360-toolbar-main {
  padding: 0 !important;
  border-bottom: 0 !important;
  margin-bottom: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-db360-toolbar-filters {
  padding-top: 18px !important;
  border-top: 1px solid rgba(45, 76, 130, 0.46) !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-quality-table-panel {
  margin-top: 0 !important;
  display: grid !important;
  gap: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-seguimientos-wrap.s360-db360-table-wrap,
#system360-app .s360-app.s360-app-system .s360-quality-shell .s360-db360-table-wrap {
  border: 1px solid rgba(64, 102, 178, .72) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(7, 18, 42, .98), rgba(4, 12, 29, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell table.s360-db360-table thead th {
  background: linear-gradient(180deg, rgba(12, 25, 54, .98), rgba(8, 18, 42, .98)) !important;
  border-bottom: 1px solid rgba(79, 127, 220, .82) !important;
}

#system360-app .s360-app.s360-app-system .s360-quality-shell table.s360-db360-table tbody td {
  background: rgba(5, 13, 30, .86) !important;
  border-bottom: 1px solid rgba(43, 70, 124, .34) !important;
}

/* Atencion a clientes: one shell, flat table blocks */
#system360-app .s360-app.s360-app-system .s360-atc-shell {
  border: 1px solid rgba(72, 105, 176, .66) !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 80% -10%, rgba(44, 83, 172, .16), transparent 34%),
    linear-gradient(180deg, rgba(8, 17, 39, .98), rgba(4, 11, 28, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .055),
    0 18px 38px rgba(0, 0, 0, .26) !important;
  padding: 22px !important;
}

#system360-app .s360-app.s360-app-system .s360-atcdb-shell {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell > .s360-agenda-toolbar,
#system360-app .s360-app.s360-app-system .s360-atcdb-shell > .s360-agenda-toolbar {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 0 14px !important;
  margin: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-table-panel,
#system360-app .s360-app.s360-app-system .s360-atc-table-surface,
#system360-app .s360-app.s360-app-system .s360-atcdb-table-wrap,
#system360-app .s360-app.s360-app-system .s360-atcdb-config {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: grid !important;
  gap: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-subtable {
  min-width: 0 !important;
  display: grid !important;
  gap: 12px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-atc-table-panel, .s360-atc-subtable, .s360-atcdb-config) > h3,
#system360-app .s360-app.s360-app-system .s360-atcdb-config .s360-agenda-toolbar h3 {
  margin: 0 !important;
  color: #e7f0ff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell .s360-seguimientos-wrap,
#system360-app .s360-app.s360-app-system .s360-atcdb-shell .s360-seguimientos-wrap {
  border: 1px solid rgba(64, 102, 178, .72) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(7, 18, 42, .98), rgba(4, 12, 29, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell .s360-seguimientos-wrap > table,
#system360-app .s360-app.s360-app-system .s360-atcdb-shell .s360-seguimientos-wrap > table {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell .s360-atcdb-pager,
#system360-app .s360-app.s360-app-system .s360-atcdb-shell .s360-atcdb-pager {
  margin-top: 2px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Tablas globales: mismo estilo visual que Mis ventas */
#system360-app .s360-app.s360-app-system .s360-db360-toolbar {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 0 14px !important;
  padding: 22px 24px !important;
  border: 1px solid rgba(64, 102, 178, .72) !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 50% -60%, rgba(48, 87, 184, .16), transparent 52%),
    linear-gradient(180deg, rgba(7, 18, 42, .98), rgba(4, 12, 29, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-toolbar-main {
  display: grid !important;
  grid-template-columns: minmax(300px, 360px) 224px 190px minmax(300px, 1fr) !important;
  gap: 18px 28px !important;
  align-items: end !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-toolbar-filters {
  display: grid !important;
  grid-template-columns: 124px 150px 160px 170px 170px max-content max-content max-content 140px max-content !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(45, 76, 130, 0.46) !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-field,
#system360-app .s360-app.s360-app-system .s360-db360-toolbar-main > label,
#system360-app .s360-app.s360-app-system .s360-db360-toolbar-filters > label,
#system360-app .s360-app.s360-app-system .s360-db360-date-menu {
  min-width: 0 !important;
  max-width: 100% !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-field > span:first-child {
  color: #e6edff !important;
  -webkit-text-fill-color: #e6edff !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-view-field {
  width: 224px !important;
  max-width: 224px !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-view-switch {
  width: 224px !important;
  min-width: 224px !important;
  height: 42px !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(82, 123, 197, 0.76) !important;
  border-radius: 9px !important;
  background: rgba(7, 18, 38, 0.92) !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-view-switch button {
  min-width: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #dce8ff !important;
  -webkit-text-fill-color: #dce8ff !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-view-switch button.active {
  background: linear-gradient(135deg, #7467ff, #5b2ed4) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 10px 24px rgba(91, 61, 229, .36) !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 18px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding-bottom: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-filter-select {
  min-width: 0 !important;
  max-width: none !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-selected {
  white-space: nowrap !important;
  min-width: 112px !important;
  text-align: center !important;
  justify-self: center !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-toolbar .s360-btn,
#system360-app .s360-app.s360-app-system .s360-db360-filter-btn,
#system360-app .s360-app.s360-app-system .s360-db360-date-menu summary {
  height: 42px !important;
  min-height: 42px !important;
  min-width: 104px !important;
  max-width: 180px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 16px !important;
  border: 1px solid rgba(82, 123, 197, .72) !important;
  border-radius: 9px !important;
  background: rgba(7, 18, 38, .9) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  color: #edf4ff !important;
  -webkit-text-fill-color: #edf4ff !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  white-space: nowrap !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-toolbar button[data-db360-bulk-delete] {
  width: 140px !important;
  min-width: 140px !important;
  max-width: 140px !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-toolbar :is(.s360-input, .s360-select) {
  width: 100% !important;
  min-width: 0 !important;
  height: 42px !important;
  min-height: 42px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-lb360-table-wrap).s360-db360-table-wrap {
  border: 1px solid rgba(64, 102, 178, .72) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, rgba(7, 18, 42, .98), rgba(4, 12, 29, .98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-table thead th {
  background: linear-gradient(180deg, rgba(12, 25, 54, .98), rgba(8, 18, 42, .98)) !important;
  border-bottom: 1px solid rgba(79, 127, 220, .82) !important;
}

#system360-app .s360-app.s360-app-system table.s360-db360-table tbody td {
  background: rgba(5, 13, 30, .86) !important;
  border-bottom: 1px solid rgba(43, 70, 124, .34) !important;
}

@media (max-width: 1280px) {
  #system360-app .s360-app.s360-app-system .s360-db360-toolbar-main {
    grid-template-columns: minmax(280px, 1fr) 224px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-db360-actions {
    grid-column: 1 / -1 !important;
    justify-content: flex-start !important;
  }

  #system360-app .s360-app.s360-app-system .s360-db360-toolbar-filters {
    grid-template-columns: repeat(4, minmax(150px, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  #system360-app .s360-app.s360-app-system .s360-db360-toolbar-main,
  #system360-app .s360-app.s360-app-system .s360-db360-toolbar-filters {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-app.s360-app-system .s360-db360-actions,
  #system360-app .s360-app.s360-app-system .s360-db360-toolbar-filters {
    align-items: stretch !important;
  }

  #system360-app .s360-app.s360-app-system .s360-db360-toolbar .s360-btn,
  #system360-app .s360-app.s360-app-system .s360-db360-filter-btn,
  #system360-app .s360-app.s360-app-system .s360-db360-filter-select,
  #system360-app .s360-app.s360-app-system .s360-db360-date-menu,
  #system360-app .s360-app.s360-app-system .s360-db360-date-menu summary {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Light mode final overrides: placed last to win over legacy dark module styles. */
#system360-app.s360-theme-light .s360-app.s360-app-system,
#system360-app.s360-theme-light .s360-app-system {
  color-scheme: light !important;
  color: #102033 !important;
  background:
    radial-gradient(980px 540px at -10% -12%, rgba(83, 154, 255, .2), transparent 64%),
    radial-gradient(720px 440px at 112% 110%, rgba(34, 197, 143, .14), transparent 62%),
    linear-gradient(145deg, #f8fbff 0%, #edf4fc 54%, #e2edf8 100%) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-shell, .s360-sidebar, .s360-topbar, .s360-panel, .s360-card, .s360-box, .s360-modal, .s360-dropdown, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-table-panel, .s360-atc-subtable, .s360-atcdb-config, .s360-quality-table-panel, .s360-home-sidebar-card, .s360-form360-side-legacy, .s360-db360-toolbar, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell) {
  background: linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(246, 250, 255, .9)) !important;
  border-color: rgba(145, 166, 196, .5) !important;
  color: #102033 !important;
  box-shadow: 0 18px 44px rgba(43, 70, 108, .13) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-title-text, h1, h2, h3, h4, h5, h6, strong, b, .v, th) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-muted, small, .k, .meta, .s360-label, .s360-topbar-user, .s360-live-datetime, p) {
  color: #5a6d84 !important;
  -webkit-text-fill-color: #5a6d84 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea) {
  background: #ffffff !important;
  border-color: rgba(112, 135, 170, .62) !important;
  color: #13283f !important;
  -webkit-text-fill-color: #13283f !important;
  color-scheme: light !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn, .s360-icon-btn, button, .s360-live-time, .s360-badge, .s360-pill, .s360-folder-tab, .s360-db360-filter-btn, .s360-db360-date-menu summary) {
  background: linear-gradient(180deg, #ffffff, #edf5ff) !important;
  border-color: rgba(145, 166, 196, .52) !important;
  color: #14385f !important;
  -webkit-text-fill-color: #14385f !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-nav-item.active, .s360-folder-tab.active, .s360-folder-tab.is-active, .s360-view-tab.active, .s360-btn.ok, .s360-btn.sale) {
  background: linear-gradient(180deg, #e9f2ff, #cfe3ff) !important;
  border-color: rgba(36, 99, 216, .52) !important;
  color: #073f83 !important;
  -webkit-text-fill-color: #073f83 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table-sales, .s360-db360-table, .s360-atc-subtable) {
  background: #ffffff !important;
  color: #102033 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table-sales, .s360-db360-table, .s360-atc-subtable) thead th {
  background: #e8f1fc !important;
  color: #1f3854 !important;
  border-color: rgba(113, 136, 166, .46) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table-sales, .s360-db360-table, .s360-atc-subtable) tbody td {
  background: rgba(255, 255, 255, .97) !important;
  color: #182f49 !important;
  border-color: rgba(178, 193, 214, .58) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table-sales, .s360-db360-table, .s360-atc-subtable) tbody tr:nth-child(even) td {
  background: rgba(246, 250, 255, .97) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-brand-logo, .s360-brand-logo-full, .s360-brand-logo-short) {
  filter: invert(1) hue-rotate(180deg) brightness(.55) contrast(1.25) !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-toggle-btn {
  min-height: 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(112, 142, 209, .55) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(18, 32, 64, .94), rgba(9, 18, 39, .94)) !important;
  color: #edf4ff !important;
  -webkit-text-fill-color: #edf4ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 24px rgba(0, 0, 0, .18) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-toggle-btn .s360-svg-icon {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 auto !important;
}

/* Light mode polish for topbar and dashboard widgets. */
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-group,
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-group-tools,
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-group-status,
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-group-meta,
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-topbar-group-actions {
  background: linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(239, 246, 255, .9)) !important;
  border-color: rgba(151, 172, 205, .58) !important;
  color: #143253 !important;
  box-shadow: 0 12px 30px rgba(58, 86, 130, .13), inset 0 1px 0 rgba(255, 255, 255, .88) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(.s360-live-time, .s360-work-period-badge, .s360-call-top-pill, .s360-topbar-user, .s360-aircall-top-btn, .s360-top-action-btn, .s360-theme-toggle-btn) {
  background: linear-gradient(180deg, #ffffff, #edf5ff) !important;
  border-color: rgba(139, 162, 198, .58) !important;
  color: #143253 !important;
  -webkit-text-fill-color: #143253 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 8px 18px rgba(56, 82, 124, .12) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(.s360-live-datetime, .s360-live-time span, .s360-work-period-badge, .s360-topbar-user, .s360-theme-toggle-btn span) {
  color: #143253 !important;
  -webkit-text-fill-color: #143253 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(.s360-svg-icon, .s360-theme-toggle-btn .s360-svg-icon) {
  color: #245986 !important;
  stroke: currentColor !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-tabs, .s360-folder-tabs, .s360-time-tabs, .s360-alert-center-tabs) {
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(238, 246, 255, .92)) !important;
  border-color: rgba(142, 164, 198, .62) !important;
  box-shadow: 0 14px 34px rgba(44, 75, 120, .14) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-tab-btn, .s360-folder-tab, .s360-time-tab, .s360-view-tab) {
  background: transparent !important;
  color: #23405f !important;
  -webkit-text-fill-color: #23405f !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-tab-btn.active, .s360-folder-tab.active, .s360-folder-tab.is-active, .s360-time-tab.active, .s360-view-tab.active) {
  background: linear-gradient(180deg, #f9fcff, #e6f1ff) !important;
  color: #0c4585 !important;
  -webkit-text-fill-color: #0c4585 !important;
  box-shadow: inset 0 -3px 0 rgba(112, 108, 255, .42) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-kpi-super-panel, .s360-home-tab-panel, .s360-component-card, .s360-profile-card, .s360-home-sidebar-card, .s360-home-calendar-card) {
  background: linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(247, 251, 255, .93)) !important;
  border-color: rgba(150, 171, 205, .56) !important;
  color: #102033 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-card, .s360-kpi-card, .s360-metric-card, .s360-component-kpi, .s360-profile-meta > div, .s360-home-cal-selected, .s360-home-cal-selected-metrics > div, .s360-home-cal-agenda-item) {
  background: linear-gradient(180deg, #ffffff, #f1f7ff) !important;
  border-color: rgba(150, 171, 205, .56) !important;
  color: #12243a !important;
  -webkit-text-fill-color: #12243a !important;
  box-shadow: 0 10px 24px rgba(50, 81, 124, .1) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-card .v, .s360-card .k, .s360-component-kpi .v, .s360-component-kpi .k, .s360-kpi-card .v, .s360-kpi-card .k, .s360-profile-meta strong, .s360-home-cal-selected-head strong, .s360-home-cal-selected-metrics strong, .s360-home-cal-agenda-item strong) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-card .k, .s360-component-kpi .k, .s360-kpi-card .k, .s360-profile-meta span, .s360-home-cal-selected-head span, .s360-home-cal-selected-metrics span, .s360-home-cal-agenda-item span, .s360-home-cal-weekdays > span) {
  color: #58708d !important;
  -webkit-text-fill-color: #58708d !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day {
  background: linear-gradient(180deg, #ffffff, #edf5ff) !important;
  border-color: rgba(142, 164, 198, .58) !important;
  color: #153657 !important;
  -webkit-text-fill-color: #153657 !important;
  box-shadow: 0 8px 16px rgba(53, 78, 118, .14) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-empty {
  background: rgba(236, 244, 253, .64) !important;
  box-shadow: none !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-selected {
  background: linear-gradient(145deg, #8668ff, #56b7ff) !important;
  border-color: rgba(95, 111, 255, .62) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-today:not(.is-selected) {
  background: linear-gradient(180deg, #fffdf6, #fff0c2) !important;
  border-color: rgba(217, 154, 36, .48) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card :is(.s360-home-cal-num, .s360-home-cal-meta > small) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

@media (max-width: 980px) {
  #system360-app .s360-app.s360-app-system .s360-theme-toggle-btn span {
    display: none !important;
  }

  #system360-app .s360-app.s360-app-system .s360-theme-toggle-btn {
    width: 40px !important;
    padding: 0 !important;
  }
}

/* Light mode hard overrides for controls that still inherit the dark palette. */
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(#s360-notif-btn, #s360-chat-btn, #s360-drive-files-btn, #s360-refresh, #s360-logout, .s360-topbar-group-tools .s360-icon-btn, .s360-topbar-group-actions .s360-icon-btn, .s360-topbar-group-status .s360-icon-btn, .s360-live-time, .s360-live-datetime, .s360-work-period-badge, .s360-aircall-top-btn) {
  background: linear-gradient(180deg, #ffffff 0%, #eef6ff 100%) !important;
  border: 1px solid rgba(132, 157, 195, .68) !important;
  color: #12385c !important;
  -webkit-text-fill-color: #12385c !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), 0 8px 18px rgba(55, 84, 128, .14) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(#s360-notif-btn, #s360-chat-btn, #s360-drive-files-btn, #s360-refresh, #s360-logout, .s360-icon-btn, .s360-live-time, .s360-live-datetime, .s360-work-period-badge, .s360-aircall-top-btn) :is(.s360-svg-icon, svg),
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(#s360-notif-btn, #s360-chat-btn, #s360-drive-files-btn, #s360-refresh, #s360-logout, .s360-icon-btn, .s360-live-time, .s360-live-datetime, .s360-work-period-badge, .s360-aircall-top-btn) {
  color: #12385c !important;
  stroke: currentColor !important;
  fill: none !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos #s360-logout {
  background: linear-gradient(180deg, #fff7fb 0%, #f5eaff 100%) !important;
  border-color: rgba(164, 137, 192, .62) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(.s360-icon-badge, .s360-topbar-loader, .s360-call-top-ring) {
  -webkit-text-fill-color: #ffffff !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar :is(.s360-nav-icon, .s360-nav-meta, .s360-side-toggle, .s360-user-arrow) {
  background: linear-gradient(180deg, #ffffff, #edf5ff) !important;
  border-color: rgba(137, 162, 199, .56) !important;
  color: #1f5c96 !important;
  -webkit-text-fill-color: #1f5c96 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar :is(.s360-nav-icon, .s360-nav-meta, .s360-side-toggle, .s360-user-arrow) :is(.s360-svg-icon, svg) {
  color: #1f5c96 !important;
  stroke: currentColor !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-kpi-value, .s360-kpi-card .s360-kpi-value, .s360-component-kpi .s360-kpi-value) {
  color: #163a5f !important;
  -webkit-text-fill-color: #163a5f !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-kpi-label, .s360-kpi-card .s360-kpi-label, .s360-component-kpi .s360-kpi-label) {
  color: #426285 !important;
  -webkit-text-fill-color: #426285 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-profile-card .s360-panel-headline h3, .s360-home-calendar-card .s360-panel-headline h3, .s360-profile-card h4, .s360-home-cal-month) {
  color: #143253 !important;
  -webkit-text-fill-color: #143253 !important;
  opacity: 1 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-profile-card p, .s360-profile-meta span, .s360-home-sidebar-card .s360-muted, .s360-home-cal-weekdays > span) {
  color: #5b718a !important;
  -webkit-text-fill-color: #5b718a !important;
  opacity: 1 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-profile-meta > div strong {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-nav .s360-home-cal-nav-btn {
  background: linear-gradient(180deg, #ffffff, #edf5ff) !important;
  border-color: rgba(132, 157, 195, .68) !important;
  color: #12385c !important;
  -webkit-text-fill-color: #12385c !important;
  box-shadow: 0 8px 18px rgba(55, 84, 128, .14) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-nav .s360-home-cal-nav-btn .s360-svg-icon {
  color: #12385c !important;
  stroke: currentColor !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-sidebar-toggle {
  background: linear-gradient(180deg, #ffffff, #edf5ff) !important;
  border-color: rgba(132, 157, 195, .68) !important;
  color: #12385c !important;
  -webkit-text-fill-color: #12385c !important;
}

/* Light mode complete readability pass: tables, forms, popups and module-specific dark rules. */
body #system360-app.s360-theme-light .s360-app.s360-app-system {
  --s360g-bg-0: #f8fbff !important;
  --s360g-bg-1: #edf4fc !important;
  --s360g-bg-2: #e2edf8 !important;
  --s360g-panel: rgba(255, 255, 255, .96) !important;
  --s360g-panel-strong: rgba(255, 255, 255, .98) !important;
  --s360g-panel-soft: rgba(244, 249, 255, .9) !important;
  --s360g-line: rgba(139, 162, 198, .58) !important;
  --s360g-line-strong: rgba(98, 128, 178, .68) !important;
  --s360g-text: #102033 !important;
  --s360g-text-soft: #5b718a !important;
  --s360-ui-card-bg: linear-gradient(180deg, #ffffff, #f4f9ff) !important;
  --s360-ui-card-hover-bg: linear-gradient(180deg, #ffffff, #eaf4ff) !important;
  --s360-ui-text: #102033 !important;
  --s360-ui-muted: #5b718a !important;
  --s360-ink: #102033 !important;
  --s360-ink-soft: #5b718a !important;
  --s8-text: #102033 !important;
  --s8-soft: #5b718a !important;
  --ink: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-main, .s360-content-scroll, .s360-panel, .s360-card, .s360-box, .s360-section, .s360-dash-section, .s360-config-section, .s360-form-section, .s360-toolbar, .s360-db-toolbar, .s360-db360-toolbar, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-quote-builder) {
  background-color: transparent !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-section, .s360-dash-section, .s360-config-section, .s360-form-section, .s360-db360-toolbar, .s360-db-toolbar, .s360-toolbar, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-quote-builder .s360-panel) {
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(246, 250, 255, .93)) !important;
  border-color: rgba(139, 162, 198, .58) !important;
  color: #102033 !important;
  box-shadow: 0 14px 34px rgba(44, 75, 120, .11) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(h1, h2, h3, h4, h5, h6, .s360-title-text, .s360-panel-headline h3, .s360-section-title, .s360-card-title, .s360-modal-title, strong, b) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(p, label, .s360-label, small, .s360-muted, .meta, .k, .s360-help, .s360-hint, [class*="muted"], [class*="subtitle"], [class*="description"]) {
  color: #5b718a !important;
  -webkit-text-fill-color: #5b718a !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea),
body #system360-app.s360-theme-light #s360-modal :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea),
body #system360-app.s360-theme-light :is(#s360-add-member-popup-host, #s360-add-dependent-popup-host) .s360-add-member-popup :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea) {
  background: linear-gradient(180deg, #ffffff, #f2f7ff) !important;
  border: 1px solid rgba(126, 151, 190, .72) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  caret-color: #102033 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92), 0 8px 18px rgba(55, 84, 128, .08) !important;
  color-scheme: light !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea)::placeholder,
body #system360-app.s360-theme-light #s360-modal :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea)::placeholder {
  color: #7b8ea8 !important;
  -webkit-text-fill-color: #7b8ea8 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system select option,
body #system360-app.s360-theme-light #s360-modal select option,
body #system360-app.s360-theme-light :is(#s360-add-member-popup-host, #s360-add-dependent-popup-host) select option {
  background: #ffffff !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn, .s360-icon-btn, button:not(.s360-home-tab-btn):not(.s360-folder-tab):not(.s360-time-tab):not(.s360-nav-item)),
body #system360-app.s360-theme-light #s360-modal :is(.s360-btn, .s360-icon-btn, button),
body #system360-app.s360-theme-light :is(#s360-add-member-popup-host, #s360-add-dependent-popup-host) .s360-add-member-popup :is(.s360-btn, .s360-icon-btn, button) {
  color: #12385c !important;
  -webkit-text-fill-color: #12385c !important;
  border-color: rgba(126, 151, 190, .66) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn.ok, .s360-btn.primary, .s360-btn.sale, .s360-btn.danger, .s360-btn.warn, button.is-primary, button.is-danger) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-table-panel, .s360-quality-table-panel),
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel .s360-sales-table-wrap {
  background: #ffffff !important;
  border-color: rgba(126, 151, 190, .7) !important;
  box-shadow: 0 16px 36px rgba(44, 75, 120, .12) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table),
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table {
  background: #ffffff !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  border-color: rgba(126, 151, 190, .62) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table) thead th,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table th {
  background: linear-gradient(180deg, #edf5ff, #dfeeff) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  border-color: rgba(126, 151, 190, .68) !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table) tbody td,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table td {
  background: #ffffff !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  border-color: rgba(186, 199, 218, .78) !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table) tbody tr:nth-child(even) td,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table tbody tr:nth-child(even) td {
  background: #f4f8fd !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table) tbody tr:hover td,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table tbody tr:hover td {
  background: #eaf3ff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table) :is(td, th) :is(span, strong, small, b, em, a, div),
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table :is(.s360-sales-id-cell strong, .s360-sales-person-cell strong, .s360-sales-service-cell strong, .s360-sales-phone-cell span:first-child, .s360-sales-client-link, .s360-sales-date-cell strong, .s360-sales-next-cell strong, .s360-sales-comment-text, .s360-sales-cell-sub) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table .s360-sales-date-cell span,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table :is(.s360-sales-cell-sub, .s360-sales-next-cell span, .s360-sales-comment-text) {
  color: #607690 !important;
  -webkit-text-fill-color: #607690 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table :is(.s360-sales-cell-icon, .s360-sales-cell-icon.is-phone, .s360-sales-cell-icon.is-shield),
body #system360-app.s360-theme-light .s360-app.s360-app-system table :is(.s360-sales-cell-icon, .s360-icon-btn) {
  background: linear-gradient(180deg, #e9f3ff, #d4e8ff) !important;
  border-color: rgba(70, 130, 210, .35) !important;
  color: #1f6eb9 !important;
  -webkit-text-fill-color: #1f6eb9 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sales-panel table.s360-mis-ventas-table :is(.s360-sales-cell-icon, .s360-sales-cell-icon.is-phone, .s360-sales-cell-icon.is-shield) :is(svg, .s360-svg-icon),
body #system360-app.s360-theme-light .s360-app.s360-app-system table :is(.s360-sales-cell-icon, .s360-icon-btn) :is(svg, .s360-svg-icon) {
  color: #1f6eb9 !important;
  stroke: currentColor !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-sales-status-pill, .s360-badge, .s360-pill, .s360-status-pill, .s360-tag) {
  background: linear-gradient(180deg, #ede7ff, #dcd0ff) !important;
  border-color: rgba(122, 88, 220, .35) !important;
  color: #5b35d6 !important;
  -webkit-text-fill-color: #5b35d6 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-sales-status-pill, .s360-badge, .s360-pill, .s360-status-pill, .s360-tag) * {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body #system360-app.s360-theme-light #s360-modal.s360-modal,
body #system360-app.s360-theme-light .s360-modal,
body #system360-app.s360-theme-light :is(#s360-add-member-popup-host, #s360-add-dependent-popup-host) .s360-add-member-popup,
body #system360-app.s360-theme-light :is(.s360-message-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown) {
  background:
    radial-gradient(circle at 0 0, rgba(82, 143, 255, .16), transparent 42%),
    linear-gradient(180deg, #ffffff 0%, #f4f9ff 100%) !important;
  border-color: rgba(126, 151, 190, .7) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 28px 70px rgba(37, 62, 98, .24), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  color-scheme: light !important;
}

body #system360-app.s360-theme-light #s360-modal :is(.s360-modal-head, .s360-modal-body, .s360-modal-footer, .s360-wf-modal-footer, .s360-form360-head, .s360-form360-body, .s360-sale-wizard, .s360-sale-workflow-modal),
body #system360-app.s360-theme-light .s360-modal :is(.s360-modal-head, .s360-modal-body, .s360-modal-footer, .s360-wf-modal-footer, .s360-form360-head, .s360-form360-body, .s360-sale-wizard, .s360-sale-workflow-modal),
body #system360-app.s360-theme-light :is(#s360-add-member-popup-host, #s360-add-dependent-popup-host) .s360-add-member-popup :is(.s360-add-member-popup-head, .s360-add-member-popup-body, .s360-add-member-popup-footer, .s360-add-member-medical-panel, .s360-add-member-medical-card) {
  background: transparent !important;
  border-color: rgba(126, 151, 190, .52) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light #s360-modal :is(.s360-panel, .s360-card, .s360-box, .s360-wf-card, .s360-form360-policy-card, .s360-form360-product-details, .s360-form360-important-note, .s360-sale-workflow-summary, .s360-sale-workflow-feed-item, .s360-sale-workflow-comment, .s360-sale-workflow-task),
body #system360-app.s360-theme-light .s360-modal :is(.s360-panel, .s360-card, .s360-box, .s360-wf-card, .s360-form360-policy-card, .s360-form360-product-details, .s360-form360-important-note, .s360-sale-workflow-summary, .s360-sale-workflow-feed-item, .s360-sale-workflow-comment, .s360-sale-workflow-task),
body #system360-app.s360-theme-light :is(#s360-add-member-popup-host, #s360-add-dependent-popup-host) .s360-add-member-popup :is(.s360-panel, .s360-card, .s360-box, .s360-add-member-medical-panel, .s360-add-member-medical-card) {
  background: linear-gradient(180deg, #ffffff, #f2f7ff) !important;
  border-color: rgba(126, 151, 190, .58) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 10px 24px rgba(55, 84, 128, .1) !important;
}

body #system360-app.s360-theme-light #s360-modal :is(h1, h2, h3, h4, h5, h6, strong, b, .s360-modal-head h3, .s360-modal-head h2, .s360-wf-panel-title h3, .s360-form360-policy-head h4, .s360-form360-product-grid strong, .s360-form360-important-note strong),
body #system360-app.s360-theme-light .s360-modal :is(h1, h2, h3, h4, h5, h6, strong, b, .s360-modal-head h3, .s360-modal-head h2, .s360-wf-panel-title h3, .s360-form360-policy-head h4, .s360-form360-product-grid strong, .s360-form360-important-note strong),
body #system360-app.s360-theme-light :is(#s360-add-member-popup-host, #s360-add-dependent-popup-host) .s360-add-member-popup :is(h1, h2, h3, h4, h5, h6, strong, b) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light #s360-modal :is(p, label, small, span, .s360-label, .s360-muted, .s360-modal-head p, .s360-modal-head small, .s360-wf-panel-title p, .s360-form360-policy-head p, .s360-form360-product-grid span, .s360-form360-product-grid small, .s360-form360-important-note p),
body #system360-app.s360-theme-light .s360-modal :is(p, label, small, span, .s360-label, .s360-muted, .s360-modal-head p, .s360-modal-head small, .s360-wf-panel-title p, .s360-form360-policy-head p, .s360-form360-product-grid span, .s360-form360-product-grid small, .s360-form360-important-note p),
body #system360-app.s360-theme-light :is(#s360-add-member-popup-host, #s360-add-dependent-popup-host) .s360-add-member-popup :is(p, label, small, span, .s360-label, .s360-muted) {
  color: #5b718a !important;
  -webkit-text-fill-color: #5b718a !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light #s360-modal :is(table, .s360-table, .s360-form360-doc-list-table) :is(th, td),
body #system360-app.s360-theme-light .s360-modal :is(table, .s360-table, .s360-form360-doc-list-table) :is(th, td) {
  background: #ffffff !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  border-color: rgba(186, 199, 218, .78) !important;
}

body #system360-app.s360-theme-light #s360-modal :is(table, .s360-table, .s360-form360-doc-list-table) thead th,
body #system360-app.s360-theme-light .s360-modal :is(table, .s360-table, .s360-form360-doc-list-table) thead th {
  background: linear-gradient(180deg, #edf5ff, #dfeeff) !important;
}

body #system360-app.s360-theme-light #s360-modal :is(.s360-modal-close, #s360-modal-close),
body #system360-app.s360-theme-light .s360-modal :is(.s360-modal-close, #s360-modal-close) {
  background: linear-gradient(180deg, #ffffff, #edf5ff) !important;
  border-color: rgba(126, 151, 190, .66) !important;
  color: #12385c !important;
  -webkit-text-fill-color: #12385c !important;
}

/* External modal hosts also receive the body theme class from app.js. */
body.s360-theme-light :is(#s360-modal.s360-modal, .s360-modal, #s360-add-member-popup-host .s360-add-member-popup, #s360-add-dependent-popup-host .s360-add-member-popup, .s360-message-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown) {
  background:
    radial-gradient(circle at 0 0, rgba(82, 143, 255, .16), transparent 42%),
    linear-gradient(180deg, #ffffff 0%, #f4f9ff 100%) !important;
  border-color: rgba(126, 151, 190, .7) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 28px 70px rgba(37, 62, 98, .24), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  color-scheme: light !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, #s360-add-member-popup-host, #s360-add-dependent-popup-host) :is(.s360-modal-head, .s360-modal-body, .s360-modal-footer, .s360-wf-modal-footer, .s360-form360-head, .s360-form360-body, .s360-sale-wizard, .s360-sale-workflow-modal, .s360-add-member-popup-head, .s360-add-member-popup-body, .s360-add-member-popup-footer) {
  background: transparent !important;
  border-color: rgba(126, 151, 190, .52) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, #s360-add-member-popup-host, #s360-add-dependent-popup-host) :is(.s360-panel, .s360-card, .s360-box, .s360-wf-card, .s360-form360-policy-card, .s360-form360-product-details, .s360-form360-important-note, .s360-sale-workflow-summary, .s360-sale-workflow-feed-item, .s360-sale-workflow-comment, .s360-sale-workflow-task, .s360-add-member-medical-panel, .s360-add-member-medical-card, .s360-wz-med-row, .s360-dot-group, .s360-wz-med-detail, .s360-wz-med-month, .s360-wz-med-obs, .s360-wz-med-items) {
  background: linear-gradient(180deg, #ffffff, #f2f7ff) !important;
  border-color: rgba(126, 151, 190, .58) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 10px 24px rgba(55, 84, 128, .1) !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, #s360-add-member-popup-host, #s360-add-dependent-popup-host) :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea) {
  background: linear-gradient(180deg, #ffffff, #f2f7ff) !important;
  border: 1px solid rgba(126, 151, 190, .72) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  caret-color: #102033 !important;
  color-scheme: light !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, #s360-add-member-popup-host, #s360-add-dependent-popup-host) select option {
  background: #ffffff !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, #s360-add-member-popup-host, #s360-add-dependent-popup-host) :is(h1, h2, h3, h4, h5, h6, strong, b, .s360-modal-head h3, .s360-modal-head h2, .s360-wf-panel-title h3, .s360-form360-policy-head h4, .s360-form360-product-grid strong, .s360-form360-important-note strong, .s360-wz-med-q) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, #s360-add-member-popup-host, #s360-add-dependent-popup-host) :is(p, label, small, span, .s360-label, .s360-muted, .s360-modal-head p, .s360-modal-head small, .s360-wf-panel-title p, .s360-form360-policy-head p, .s360-form360-product-grid span, .s360-form360-product-grid small, .s360-form360-important-note p, .s360-wz-med-copy) {
  color: #5b718a !important;
  -webkit-text-fill-color: #5b718a !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal) :is(table, .s360-table, .s360-form360-doc-list-table) :is(th, td) {
  background: #ffffff !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  border-color: rgba(186, 199, 218, .78) !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal) :is(table, .s360-table, .s360-form360-doc-list-table) thead th {
  background: linear-gradient(180deg, #edf5ff, #dfeeff) !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal) :is(.s360-modal-close, #s360-modal-close),
body.s360-theme-light :is(#s360-add-member-popup-host, #s360-add-dependent-popup-host) :is(.s360-message-popup-close, .s360-modal-close, .s360-icon-btn) {
  background: linear-gradient(180deg, #ffffff, #edf5ff) !important;
  border-color: rgba(126, 151, 190, .66) !important;
  color: #12385c !important;
  -webkit-text-fill-color: #12385c !important;
}

/* System 360 stability patch: keep dense CRM screens usable on narrow viewports. */
#system360-app,
#system360-client-portal {
  overflow-x: clip !important;
}

#system360-app *,
#system360-client-portal * {
  box-sizing: border-box;
}

#system360-app :is(button, input, select, textarea, a),
#system360-client-portal :is(button, input, select, textarea, a) {
  max-width: 100%;
}

#system360-app :is(.s360-btn, .s360-icon-btn, .button, button),
#system360-client-portal :is(button, .s360c-benefits-cta, .s360c-group-tab-action, .s360c-group-tab-action-link) {
  min-width: 0;
  overflow-wrap: anywhere;
}

#system360-app :is(.s360-card, .s360-panel, .s360-box, .s360-modal, .s360-message-popup, .s360-toolbar, .s360-filters),
#system360-client-portal :is(.s360c-card, .s360c-process-card, .s360c-policy-strip, .s360c-customer-strip, .s360c-popup, .s360c-nextflow-card) {
  min-width: 0 !important;
  max-width: 100% !important;
}

#system360-app :is(.s360-table-wrap, .s360-seguimientos-wrap, .s360-atc-horizontal-wrap),
#system360-client-portal :is(.s360c-wf-feed-list, .s360c-policy-breakdown, .s360c-benefits-list) {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}

#system360-app :is(.s360-modal, #s360-modal, .s360-message-popup),
#system360-client-portal :is(.s360c-popup, .s360c-contact-popup, .s360c-advisor-popup) {
  max-height: min(92vh, 980px) !important;
  overflow: auto !important;
}

#system360-app :is(h1, h2, h3, h4, p, span, small, strong, label, td, th),
#system360-client-portal :is(h1, h2, h3, h4, p, span, small, strong, label, td, th) {
  overflow-wrap: anywhere;
}

@media (max-width: 760px) {
  #system360-app {
    overflow-x: hidden !important;
  }

  #system360-app :is(.s360-toolbar, .s360-filters, .s360-actions, .s360-inline-actions),
  #system360-client-portal :is(.s360c-customer-strip, .s360c-policy-strip, .s360c-group-tab-meta, .s360c-benefits-panel-head) {
    flex-wrap: wrap !important;
  }

  #system360-app :is(.s360-toolbar > *, .s360-filters > *, .s360-actions > *, .s360-inline-actions > *),
  #system360-client-portal :is(.s360c-customer-strip > *, .s360c-policy-strip > *, .s360c-group-tab-meta > *) {
    min-width: 0 !important;
  }

  #system360-app :is(.s360-btn, .button, button),
  #system360-client-portal :is(button, .s360c-benefits-cta, .s360c-group-tab-action, .s360c-group-tab-action-link) {
    white-space: normal !important;
  }
}

/* Theme switch: visual state follows the active light/dark mode. */
#system360-app .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch,
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-theme-toggle-btn.s360-theme-switch,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch {
  width: 76px !important;
  min-width: 76px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-track {
  position: relative;
  display: block;
  width: 76px;
  height: 38px;
  border-radius: 999px;
  border: 3px solid #173443;
  background: #173443;
  box-shadow: 0 12px 24px rgba(6, 18, 30, .22), inset 0 1px 0 rgba(255, 255, 255, .16);
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch.is-light .s360-theme-switch-track {
  background: #ffffff;
  border-color: #173443;
  box-shadow: 0 10px 22px rgba(20, 52, 67, .14), inset 0 1px 0 rgba(255, 255, 255, .9);
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-thumb {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 0 2px 9px rgba(4, 16, 24, .22);
  transition: transform .22s ease, background .22s ease, box-shadow .22s ease;
  z-index: 2;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch.is-light .s360-theme-switch-thumb {
  transform: translateX(38px);
  background: #173443;
  box-shadow: 0 3px 10px rgba(11, 32, 44, .2);
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol {
  position: absolute;
  top: 50%;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  transform: translateY(-50%);
  z-index: 1;
  transition: opacity .18s ease, transform .2s ease;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol.is-sun {
  left: 10px;
  color: #ffd91f;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol.is-moon {
  right: 10px;
  color: #ffd91f;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol .s360-svg-icon {
  width: 22px !important;
  height: 22px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2.5 !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol.is-sun .s360-svg-icon circle {
  fill: currentColor !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol.is-moon .s360-svg-icon {
  fill: currentColor !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch.is-light .s360-theme-switch-symbol.is-moon,
#system360-app .s360-app.s360-app-system .s360-theme-switch.is-dark .s360-theme-switch-symbol.is-sun {
  opacity: 0;
  transform: translateY(-50%) scale(.82);
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch:focus-visible .s360-theme-switch-track {
  outline: 3px solid rgba(255, 217, 31, .42);
  outline-offset: 3px;
}

@media (max-width: 980px) {
  #system360-app .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch {
    width: 76px !important;
    min-width: 76px !important;
  }
}

/* Theme switch V2: compact glass control aligned with the System 360 topbar. */
#system360-app .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch,
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-theme-toggle-btn.s360-theme-switch,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch {
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 72px !important;
  min-width: 72px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-text-fill-color: currentColor !important;
  cursor: pointer !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-track {
  position: relative !important;
  display: block !important;
  width: 72px !important;
  height: 36px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(125, 164, 214, .46) !important;
  background:
    radial-gradient(circle at 80% 20%, rgba(90, 190, 255, .26), transparent 32%),
    linear-gradient(135deg, rgba(13, 26, 49, .98), rgba(20, 45, 71, .96)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .12),
    inset 0 -12px 26px rgba(0, 0, 0, .18),
    0 10px 22px rgba(5, 16, 29, .28) !important;
  overflow: hidden !important;
  transition: background .22s ease, border-color .22s ease, box-shadow .22s ease !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch.is-light .s360-theme-switch-track {
  border-color: rgba(90, 127, 173, .48) !important;
  background:
    radial-gradient(circle at 20% 25%, rgba(255, 218, 31, .38), transparent 30%),
    linear-gradient(135deg, #ffffff, #edf6ff) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .96),
    inset 0 -10px 24px rgba(127, 163, 205, .14),
    0 10px 22px rgba(42, 75, 116, .16) !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-thumb {
  position: absolute !important;
  top: 4px !important;
  left: 4px !important;
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  background: linear-gradient(145deg, #ffffff, #dceaff) !important;
  border: 1px solid rgba(255, 255, 255, .72) !important;
  box-shadow: 0 5px 13px rgba(3, 14, 24, .34), inset 0 1px 0 rgba(255, 255, 255, .9) !important;
  transform: translateX(0) !important;
  transition: transform .24s cubic-bezier(.2, .8, .2, 1), background .22s ease, box-shadow .22s ease !important;
  z-index: 3 !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch.is-light .s360-theme-switch-thumb {
  transform: translateX(36px) !important;
  background: linear-gradient(145deg, #19394b, #0d2634) !important;
  border-color: rgba(20, 52, 67, .32) !important;
  box-shadow: 0 5px 13px rgba(30, 65, 91, .25), inset 0 1px 0 rgba(255, 255, 255, .13) !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol {
  position: absolute !important;
  top: 50% !important;
  display: grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  transform: translateY(-50%) scale(1) !important;
  opacity: 1 !important;
  z-index: 2 !important;
  pointer-events: none !important;
  transition: opacity .18s ease, transform .22s ease !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol.is-sun {
  left: 8px !important;
  color: #ffd91f !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol.is-moon {
  right: 8px !important;
  color: #ffd91f !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch.is-light .s360-theme-switch-symbol.is-moon,
#system360-app .s360-app.s360-app-system .s360-theme-switch.is-dark .s360-theme-switch-symbol.is-sun {
  opacity: 0 !important;
  transform: translateY(-50%) scale(.76) !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol .s360-svg-icon,
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos .s360-theme-switch-symbol .s360-svg-icon {
  display: block !important;
  width: 21px !important;
  height: 21px !important;
  color: currentColor !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2.55 !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol.is-sun .s360-svg-icon circle {
  fill: currentColor !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-symbol.is-moon .s360-svg-icon {
  fill: currentColor !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-switch-label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch:hover .s360-theme-switch-track {
  border-color: rgba(129, 204, 255, .66) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .14),
    0 12px 26px rgba(20, 80, 132, .22) !important;
}

@media (max-width: 980px) {
  #system360-app .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch {
    width: 72px !important;
    min-width: 72px !important;
    padding: 0 !important;
  }

  #system360-app .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch :is(.s360-theme-switch-track, .s360-theme-switch-thumb) {
    display: block !important;
  }

  #system360-app .s360-app.s360-app-system .s360-theme-toggle-btn.s360-theme-switch .s360-theme-switch-symbol {
    display: grid !important;
  }
}

/* Light mode final hard pass: override late dark component styles. */
body #system360-app.s360-theme-light .s360-app.s360-app-system,
body #system360-app.s360-theme-light .s360-app.s360-app-system * {
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-shell, .s360-workarea, .s360-main, .s360-content-scroll) {
  background:
    radial-gradient(circle at 88% 8%, rgba(50, 171, 255, .13), transparent 34%),
    linear-gradient(180deg, #f8fbff 0%, #edf5fd 100%) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card, .s360-home-tab-panel, .s360-kpi-super-panel) {
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(245, 250, 255, .94)) !important;
  border: 1px solid rgba(128, 156, 198, .58) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 18px 42px rgba(45, 74, 112, .12), inset 0 1px 0 rgba(255, 255, 255, .94) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel-headline h3, .s360-title-text, .s360-section-title, .s360-card-title, h1, h2, h3, h4, h5, h6, strong, b, .v) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-muted, .k, .meta, p, small, label, .s360-help, .s360-hint) {
  color: #627895 !important;
  -webkit-text-fill-color: #627895 !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-svg-icon, svg) {
  color: currentColor !important;
  stroke: currentColor !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar {
  background:
    radial-gradient(circle at 90% 78%, rgba(55, 200, 210, .16), transparent 30%),
    linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(242, 248, 255, .94)) !important;
  border-color: rgba(128, 156, 198, .62) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, .5), rgba(220, 239, 255, .2)) !important;
  opacity: .78 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-section-label {
  color: #7a8ea8 !important;
  -webkit-text-fill-color: #7a8ea8 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item.s360-sub-item {
  background: linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(238, 246, 255, .88)) !important;
  border: 1px solid rgba(132, 160, 201, .58) !important;
  color: #12385c !important;
  -webkit-text-fill-color: #12385c !important;
  box-shadow: 0 6px 16px rgba(47, 78, 118, .08), inset 0 1px 0 rgba(255, 255, 255, .86) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item:hover {
  background: linear-gradient(180deg, #ffffff, #e9f4ff) !important;
  border-color: rgba(76, 137, 225, .58) !important;
  color: #0c4f8e !important;
  -webkit-text-fill-color: #0c4f8e !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item.active,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item.s360-sub-item.active {
  background: linear-gradient(180deg, #e7f1ff, #d5e8ff) !important;
  border-color: rgba(70, 133, 255, .82) !important;
  color: #073e77 !important;
  -webkit-text-fill-color: #073e77 !important;
  box-shadow: 0 8px 18px rgba(57, 122, 220, .15), inset 0 0 0 1px rgba(255, 255, 255, .72) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item :is(.s360-nav-label, .s360-nav-icon, .s360-nav-icon .s360-svg-icon) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-meta:empty {
  display: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-nav-meta, .s360-chevron, .s360-side-toggle, .s360-side-user-menu-toggle) {
  background: linear-gradient(180deg, #ffffff, #e7f1ff) !important;
  border-color: rgba(121, 154, 202, .62) !important;
  color: #28639c !important;
  -webkit-text-fill-color: #28639c !important;
  box-shadow: 0 4px 12px rgba(38, 75, 118, .12), inset 0 1px 0 rgba(255, 255, 255, .9) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-badge,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-icon-badge {
  background: linear-gradient(135deg, #8a5cff, #5d8cff) !important;
  border-color: rgba(255, 255, 255, .72) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(.s360-topbar-group, .s360-topbar-group-tools, .s360-topbar-group-status, .s360-topbar-group-meta, .s360-topbar-group-actions) {
  background: linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(240, 247, 255, .92)) !important;
  border-color: rgba(132, 160, 201, .58) !important;
  color: #12385c !important;
  -webkit-text-fill-color: #12385c !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-top-action-btn, .s360-icon-btn, .s360-live-time, .s360-live-datetime, .s360-work-period-badge, .s360-aircall-top-btn, .s360-call-top-pill, .s360-btn, .button, button:not(.s360-nav-item):not(.s360-theme-switch)) {
  background: linear-gradient(180deg, #ffffff, #edf6ff) !important;
  border-color: rgba(128, 156, 198, .66) !important;
  color: #12385c !important;
  -webkit-text-fill-color: #12385c !important;
  box-shadow: 0 8px 18px rgba(48, 82, 128, .1), inset 0 1px 0 rgba(255, 255, 255, .9) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn.ok, .s360-btn.primary, .s360-btn.sale, .s360-btn.danger, .s360-btn.warn, button.is-primary, button.is-danger) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-list, .s360-kpi-funnel) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-chart-row,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-kpi-funnel-step {
  background: linear-gradient(180deg, #ffffff, #f0f7ff) !important;
  border: 1px solid rgba(132, 160, 201, .56) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 10px 24px rgba(44, 75, 120, .1), inset 0 1px 0 rgba(255, 255, 255, .9) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row span, .s360-chart-row b, .s360-kpi-funnel-head strong, .s360-kpi-funnel-head span, .s360-kpi-funnel-step b) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-chart-track {
  background: #d8e5f4 !important;
  box-shadow: inset 0 1px 3px rgba(42, 78, 120, .13) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-chart-track :is(i, .s360-progress-fill) {
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .28), 0 6px 14px rgba(0, 122, 255, .18) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-host > #s360-notif-dropdown.s360-notif-dropdown,
body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-host > #s360-notif-dropdown.s360-notif-dropdown-modern,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-notif-dropdown {
  background:
    radial-gradient(circle at 12% 0%, rgba(86, 157, 255, .18), transparent 36%),
    linear-gradient(180deg, #ffffff 0%, #f3f8ff 100%) !important;
  border: 1px solid rgba(128, 156, 198, .66) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 28px 70px rgba(34, 61, 96, .28), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  color-scheme: light !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown :is(.s360-notif-dropdown-head, .s360-notif-toolbar, .s360-notif-panel, .s360-notif-stack) {
  background: transparent !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  border-color: rgba(128, 156, 198, .42) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown :is(.s360-notif-card, .s360-notif-card.is-unread, .s360-notif-card.is-read) {
  background: linear-gradient(180deg, #ffffff, #f1f7ff) !important;
  border: 1px solid rgba(132, 160, 201, .56) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 8px 20px rgba(44, 75, 120, .1), inset 0 1px 0 rgba(255, 255, 255, .92) !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown .s360-notif-card:hover {
  background: linear-gradient(180deg, #ffffff, #e7f2ff) !important;
  border-color: rgba(70, 133, 255, .52) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown :is(.s360-notif-dropdown-head h4, .s360-notif-title, .s360-notif-cluster-label strong, .s360-notif-history-wrap h5) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown :is(.s360-notif-desc, .s360-notif-subdesc, .s360-notif-age, .s360-notif-meta, .s360-notif-meta span, .s360-notif-cluster-label small) {
  color: #627895 !important;
  -webkit-text-fill-color: #627895 !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown :is(.s360-notif-tab, .s360-notif-filter-btn, .s360-notif-head-link, .s360-notif-head-close, .s360-notif-more, .s360-notif-read, .s360-notif-footer-link, .s360-notif-footer-arrow, .s360-notif-cluster-toggle) {
  background: linear-gradient(180deg, #ffffff, #edf6ff) !important;
  border-color: rgba(128, 156, 198, .62) !important;
  color: #174a78 !important;
  -webkit-text-fill-color: #174a78 !important;
  box-shadow: 0 6px 16px rgba(44, 75, 120, .1), inset 0 1px 0 rgba(255, 255, 255, .92) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown :is(.s360-notif-tab.is-active, .s360-notif-filter-btn.is-active, .s360-notif-filter-btn.is-open) {
  background: linear-gradient(135deg, #7c5cff, #4f8dff) !important;
  border-color: rgba(120, 99, 255, .72) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown :is(.s360-notif-tab span, .s360-notif-tab small, .s360-notif-filter-btn span, .s360-notif-filter-btn small, .s360-notif-head-link span) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown .s360-notif-icon {
  background: linear-gradient(180deg, #e9f3ff, #d9eaff) !important;
  border-color: rgba(70, 130, 210, .34) !important;
  color: #1f6eb9 !important;
  -webkit-text-fill-color: #1f6eb9 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown .s360-notif-menu,
body #system360-app.s360-theme-light .s360-app.s360-app-system #s360-notif-dropdown .s360-notif-filter-menu {
  background: #ffffff !important;
  border-color: rgba(128, 156, 198, .66) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 18px 42px rgba(44, 75, 120, .2) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(input, select, textarea, .s360-input, .s360-select, .s360-textarea) {
  background: linear-gradient(180deg, #ffffff, #f2f7ff) !important;
  border-color: rgba(128, 156, 198, .66) !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  color-scheme: light !important;
}

/* Light mode sidebar icon cleanup: remove extra boxes behind nav icons. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-nav-icon,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-nav-icon .s360-svg-icon {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-nav-meta {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  min-width: 0 !important;
  padding: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-chevron {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #28639c !important;
  -webkit-text-fill-color: #28639c !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item.active .s360-chevron {
  color: #075ea8 !important;
  -webkit-text-fill-color: #075ea8 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-nav-badge {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  border-radius: 999px !important;
}

/* Light Theme V3: complete polished system skin. */
body #system360-app.s360-theme-light,
body #system360-app.s360-theme-light .s360-app.s360-app-system {
  --s360-light-page: #eef5fd;
  --s360-light-page-2: #f8fbff;
  --s360-light-surface: rgba(255, 255, 255, .94);
  --s360-light-surface-strong: #ffffff;
  --s360-light-surface-soft: #f4f8fe;
  --s360-light-surface-blue: #edf6ff;
  --s360-light-border: rgba(127, 155, 198, .52);
  --s360-light-border-soft: rgba(174, 193, 220, .62);
  --s360-light-text: #102033;
  --s360-light-muted: #5e748f;
  --s360-light-blue: #0b64b7;
  --s360-light-blue-soft: #e4f1ff;
  --s360-light-purple: #7158f5;
  --s360-light-shadow: 0 18px 44px rgba(45, 74, 112, .12);
  --s360-light-shadow-soft: 0 8px 22px rgba(45, 74, 112, .08);
  --s360-light-radius-xl: 22px;
  --s360-light-radius-lg: 18px;
  --s360-light-radius-md: 14px;
  color-scheme: light !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system {
  background:
    radial-gradient(900px 520px at 8% -12%, rgba(88, 160, 255, .18), transparent 58%),
    radial-gradient(820px 520px at 98% 4%, rgba(54, 198, 210, .13), transparent 54%),
    linear-gradient(180deg, var(--s360-light-page-2) 0%, var(--s360-light-page) 100%) !important;
  color: var(--s360-light-text) !important;
  -webkit-text-fill-color: var(--s360-light-text) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell {
  background: rgba(255, 255, 255, .42) !important;
  border: 1px solid rgba(132, 160, 201, .42) !important;
  border-radius: var(--s360-light-radius-xl) !important;
  box-shadow: 0 24px 60px rgba(40, 69, 105, .12) !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-main, .s360-content-scroll, .s360-workarea) {
  background: transparent !important;
  color: var(--s360-light-text) !important;
  -webkit-text-fill-color: var(--s360-light-text) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
  padding: 28px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-greeting-section, .s360-dash-section.s360-home-greeting-section) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 2px 2px 8px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-greeting-text {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #536d8d !important;
  -webkit-text-fill-color: #536d8d !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-tabs-section, .s360-folder-tabs, .s360-home-tabs, .s360-time-tabs, .s360-alert-center-tabs) {
  background: rgba(255, 255, 255, .72) !important;
  border: 1px solid var(--s360-light-border-soft) !important;
  border-radius: var(--s360-light-radius-lg) !important;
  box-shadow: var(--s360-light-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, .92) !important;
  padding: 10px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-tab-btn, .s360-folder-tab, .s360-time-tab, .s360-view-tab) {
  min-height: 42px !important;
  border-radius: 12px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #21415f !important;
  -webkit-text-fill-color: #21415f !important;
  box-shadow: none !important;
  font-weight: 800 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-tab-btn:hover, .s360-folder-tab:hover, .s360-time-tab:hover, .s360-view-tab:hover) {
  background: rgba(232, 243, 255, .78) !important;
  border-color: rgba(132, 160, 201, .42) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-tab-btn.active, .s360-folder-tab.active, .s360-folder-tab.is-active, .s360-time-tab.active, .s360-view-tab.active) {
  background: linear-gradient(180deg, #ffffff, #edf6ff) !important;
  border-color: rgba(72, 139, 231, .55) !important;
  color: #103d68 !important;
  -webkit-text-fill-color: #103d68 !important;
  box-shadow: 0 8px 20px rgba(54, 100, 160, .12), inset 0 -3px 0 rgba(128, 88, 255, .42) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-tab-btn)::before,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-tab-btn)::after,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-folder-tab)::before,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-folder-tab)::after,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-time-tab)::before,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-time-tab)::after {
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card, .s360-kpi-card, .s360-kpi-smart-card, .s360-kpi-rank-card, .s360-dash-section, .s360-home-tab-panel, .s360-kpi-super-panel, .s360-config-section, .s360-form-section, .s360-toolbar, .s360-db-toolbar, .s360-db360-toolbar, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-quote-builder, .s360-home-sidebar-card) {
  background: linear-gradient(180deg, var(--s360-light-surface-strong), var(--s360-light-surface-soft)) !important;
  border: 1px solid var(--s360-light-border) !important;
  border-radius: var(--s360-light-radius-lg) !important;
  color: var(--s360-light-text) !important;
  -webkit-text-fill-color: var(--s360-light-text) !important;
  box-shadow: var(--s360-light-shadow), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel {
  padding: 28px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card):hover {
  border-color: rgba(93, 142, 209, .58) !important;
  box-shadow: 0 20px 48px rgba(45, 74, 112, .14), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-dash-section-head, .s360-panel-headline, .s360-home-sidebar-card-head, .s360-modal-head) {
  background: transparent !important;
  border-color: rgba(174, 193, 220, .42) !important;
  color: var(--s360-light-text) !important;
  -webkit-text-fill-color: var(--s360-light-text) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-dash-section-head h2, .s360-panel-headline h3, .s360-panel-headline h4, .s360-card-title, .s360-modal-title, .s360-kpi-value, .s360-kpi-smart-value, .s360-kpi-rank-card .v, .s360-card .v) {
  color: #11375a !important;
  -webkit-text-fill-color: #11375a !important;
  font-weight: 850 !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-kpi-label, .s360-kpi-smart-label, .s360-kpi-smart-hint, .s360-kpi-rank-card .k, .s360-card .k, .s360-muted, [class*="muted"], .meta, small, p) {
  color: var(--s360-light-muted) !important;
  -webkit-text-fill-color: var(--s360-light-muted) !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-grid, .s360-grid-admin, .s360-dash-grid, .s360-kpi-smart-grid, .s360-kpi-insights-grid) {
  gap: 24px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row, .s360-kpi-funnel-step, .s360-kpi-live-item, .s360-alert-center-card, .s360-profile-meta > div, .s360-home-cal-selected, .s360-home-cal-selected-metrics > div, .s360-home-cal-agenda-item) {
  background: linear-gradient(180deg, #ffffff, #f3f8ff) !important;
  border: 1px solid var(--s360-light-border-soft) !important;
  border-radius: var(--s360-light-radius-md) !important;
  color: var(--s360-light-text) !important;
  -webkit-text-fill-color: var(--s360-light-text) !important;
  box-shadow: 0 8px 22px rgba(45, 74, 112, .08), inset 0 1px 0 rgba(255, 255, 255, .92) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-track, .s360-kpi-dual-track, .s360-task-progress-track, .s360-activity-progress-track, .s360-form360-side-progress) {
  background: #dce9f7 !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 3px rgba(43, 78, 116, .14) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-progress-fill, .s360-kpi-dual-fill, .s360-task-progress-fill, .s360-activity-progress-fill),
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-chart-track > i {
  border-radius: 999px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table) {
  background: #ffffff !important;
  border-color: var(--s360-light-border-soft) !important;
  border-radius: var(--s360-light-radius-md) !important;
  color: var(--s360-light-text) !important;
  -webkit-text-fill-color: var(--s360-light-text) !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-table-wrap, .s360-seguimientos-wrap, .s360-sales-table-wrap, .s360-db360-table-wrap, .s360-atc-table-panel, .s360-quality-table-panel) {
  background: var(--s360-light-surface-strong) !important;
  border: 1px solid var(--s360-light-border) !important;
  border-radius: var(--s360-light-radius-lg) !important;
  box-shadow: var(--s360-light-shadow-soft) !important;
  overflow: auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table) thead th {
  background: linear-gradient(180deg, #f4f9ff, #e8f2ff) !important;
  color: #1c425f !important;
  -webkit-text-fill-color: #1c425f !important;
  border-color: rgba(174, 193, 220, .62) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table) tbody td {
  background: #ffffff !important;
  color: #18324b !important;
  -webkit-text-fill-color: #18324b !important;
  border-color: rgba(222, 231, 242, .92) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table) tbody tr:nth-child(even) td {
  background: #f7fbff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea) {
  background: #ffffff !important;
  border: 1px solid var(--s360-light-border) !important;
  border-radius: 12px !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), 0 5px 14px rgba(45, 74, 112, .06) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea):focus {
  border-color: rgba(47, 125, 230, .72) !important;
  box-shadow: 0 0 0 3px rgba(47, 125, 230, .14), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  outline: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn, .s360-icon-btn, .s360-drop-btn, .button, button:not(.s360-nav-item):not(.s360-theme-switch):not(.s360-home-tab-btn):not(.s360-folder-tab):not(.s360-time-tab)) {
  background: linear-gradient(180deg, #ffffff, #edf6ff) !important;
  border: 1px solid var(--s360-light-border) !important;
  border-radius: 12px !important;
  color: #123b61 !important;
  -webkit-text-fill-color: #123b61 !important;
  box-shadow: 0 7px 18px rgba(45, 74, 112, .09), inset 0 1px 0 rgba(255, 255, 255, .94) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn:hover, .s360-icon-btn:hover, .s360-drop-btn:hover, .button:hover, button:not(.s360-nav-item):not(.s360-theme-switch):not(.s360-home-tab-btn):not(.s360-folder-tab):not(.s360-time-tab):hover) {
  border-color: rgba(55, 133, 235, .58) !important;
  background: linear-gradient(180deg, #ffffff, #e5f2ff) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn.ok, .s360-btn.primary, .s360-btn.sale, .s360-btn.is-primary, button.is-primary, .s360-quality-approve) {
  background: linear-gradient(135deg, #1f7ae0, #7457f6) !important;
  border-color: rgba(55, 105, 230, .72) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 12px 24px rgba(64, 105, 218, .22), inset 0 1px 0 rgba(255, 255, 255, .24) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-modal, #s360-modal, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-message-popup, .s360-popup) {
  background: linear-gradient(180deg, #ffffff, #f4f9ff) !important;
  border: 1px solid var(--s360-light-border) !important;
  border-radius: var(--s360-light-radius-lg) !important;
  color: var(--s360-light-text) !important;
  -webkit-text-fill-color: var(--s360-light-text) !important;
  box-shadow: 0 30px 76px rgba(34, 61, 96, .26), inset 0 1px 0 rgba(255, 255, 255, .96) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-modal-head, .s360-modal-body, .s360-modal-footer, .s360-dropdown *, .s360-popup *) {
  color: inherit !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar {
  background: linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(244, 249, 255, .92)) !important;
  border-right: 1px solid var(--s360-light-border-soft) !important;
  border-radius: 0 !important;
  box-shadow: 12px 0 36px rgba(45, 74, 112, .08) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos {
  background: rgba(255, 255, 255, .76) !important;
  border: 1px solid var(--s360-light-border-soft) !important;
  border-radius: var(--s360-light-radius-lg) !important;
  box-shadow: var(--s360-light-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, .9) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(.s360-topbar-group, .s360-topbar-group-tools, .s360-topbar-group-status, .s360-topbar-group-meta, .s360-topbar-group-actions) {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day {
  background: #ffffff !important;
  border: 1px solid rgba(174, 193, 220, .62) !important;
  border-radius: 12px !important;
  color: #18324b !important;
  -webkit-text-fill-color: #18324b !important;
  box-shadow: 0 5px 14px rgba(45, 74, 112, .07) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-selected {
  background: linear-gradient(135deg, #1f7ae0, #7457f6) !important;
  border-color: rgba(55, 105, 230, .7) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-today:not(.is-selected) {
  background: linear-gradient(180deg, #fffdf4, #fff2c7) !important;
  border-color: rgba(219, 165, 43, .45) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-pill, .s360-badge, .s360-tag, .s360-status-pill) {
  border-radius: 999px !important;
  background: linear-gradient(180deg, #edf4ff, #e2edff) !important;
  border: 1px solid rgba(132, 160, 201, .5) !important;
  color: #28517a !important;
  -webkit-text-fill-color: #28517a !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-alert, .s360-ok, .s360-error) {
  border-radius: var(--s360-light-radius-md) !important;
  border: 1px solid var(--s360-light-border-soft) !important;
  box-shadow: var(--s360-light-shadow-soft) !important;
}

/* Light Theme V4: table, toolbar and external popup remediation. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-sales-table-wrap, .s360-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-table-panel, .s360-quality-table-panel, .s360-atcdb-table-wrap) {
  background: #ffffff !important;
  border: 1px solid #b9cbe2 !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 22px rgba(35, 67, 108, .08) !important;
  overflow: auto !important;
  scrollbar-color: #8aa5c9 #edf4fb !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-sales-table-wrap, .s360-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-table-panel, .s360-quality-table-panel, .s360-atcdb-table-wrap)::-webkit-scrollbar {
  width: 12px !important;
  height: 12px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-sales-table-wrap, .s360-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-table-panel, .s360-quality-table-panel, .s360-atcdb-table-wrap)::-webkit-scrollbar-track {
  background: #edf4fb !important;
  border-radius: 999px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-sales-table-wrap, .s360-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-table-panel, .s360-quality-table-panel, .s360-atcdb-table-wrap)::-webkit-scrollbar-thumb {
  background: #8aa5c9 !important;
  border: 3px solid #edf4fb !important;
  border-radius: 999px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table) {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #ffffff !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table) :is(th, td) {
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table) thead th {
  background: #eaf3fc !important;
  border-right: 1px solid #c1d1e5 !important;
  border-bottom: 1px solid #9fb7d7 !important;
  color: #12263d !important;
  -webkit-text-fill-color: #12263d !important;
  font-weight: 850 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table) tbody td {
  background: #ffffff !important;
  border-right: 1px solid #d4e0ee !important;
  border-bottom: 1px solid #d4e0ee !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table) tbody tr:nth-child(even) td {
  background: #f6f9fd !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table) tbody tr:hover td {
  background: #edf5ff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table) :is(th, td).is-sticky,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table) :is(th, td)[style*="sticky"],
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-sticky-col, .s360-table-sticky, .s360-db360-sticky, .s360-sales-sticky) {
  box-shadow: none !important;
  filter: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-sales-cell-icon, .s360-db360-cell-icon, .s360-icon-cell, .s360-cell-icon) {
  background: #e4f1ff !important;
  border: 1px solid #9bc5f4 !important;
  color: #1767ae !important;
  -webkit-text-fill-color: #1767ae !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-status-pill, .s360-sales-status-pill, .s360-status-pill, .s360-pill, .s360-badge) {
  background: #ece4ff !important;
  border: 1px solid #c9b7ff !important;
  color: #4f2dbd !important;
  -webkit-text-fill-color: #4f2dbd !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-status-pill *, .s360-sales-status-pill *, .s360-status-pill *, .s360-pill *, .s360-badge *) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-toolbar, .s360-db-toolbar, .s360-agenda-toolbar, .s360-my-sales-toolbar, .s360-toolbar, .s360-filters, .s360-db360-toolbar-main, .s360-db360-toolbar-filters) {
  background: #ffffff !important;
  border: 1px solid #c1d1e5 !important;
  border-radius: 14px !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 8px 20px rgba(35, 67, 108, .06) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-toolbar, .s360-db-toolbar, .s360-agenda-toolbar, .s360-my-sales-toolbar, .s360-toolbar, .s360-filters, .s360-db360-toolbar-main, .s360-db360-toolbar-filters) :is(label, span, small, strong, b, p, div) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-toolbar, .s360-db-toolbar, .s360-agenda-toolbar, .s360-my-sales-toolbar, .s360-toolbar, .s360-filters) > label,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-selected, .s360-selected-count, .s360-filter-label) {
  color: #506985 !important;
  -webkit-text-fill-color: #506985 !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea) {
  background: #ffffff !important;
  border: 1px solid #adc2dc !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea)::placeholder {
  color: #6b809b !important;
  -webkit-text-fill-color: #6b809b !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn.sec, .s360-btn.ghost, .s360-btn, .s360-icon-btn, .s360-db360-filter-btn, .s360-drop-btn, button:not(.s360-nav-item):not(.s360-theme-switch):not(.s360-home-tab-btn):not(.s360-folder-tab):not(.s360-time-tab)) {
  background: #f8fbff !important;
  border: 1px solid #adc2dc !important;
  color: #123b61 !important;
  -webkit-text-fill-color: #123b61 !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn.ok, .s360-btn.primary, .s360-btn.sale, .s360-btn.danger, .s360-btn.warn, button.is-primary, button.is-danger) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body.s360-theme-light :is(#s360-modal-bg, .s360-modal-bg, .s360-message-popup-backdrop, .s360-loading-layer) {
  background: rgba(15, 35, 60, .28) !important;
  backdrop-filter: blur(10px) !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, .s360-mod-editor-modal, .s360-message-popup, .s360-add-member-popup, .s360-dependent-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) {
  background: #ffffff !important;
  border: 1px solid #b7c9df !important;
  border-radius: 18px !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: 0 28px 70px rgba(25, 50, 82, .24) !important;
  color-scheme: light !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, .s360-mod-editor-modal, .s360-message-popup, .s360-add-member-popup, .s360-dependent-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) :is(h1, h2, h3, h4, h5, h6, strong, b, label, p, span, small, div, td, th) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, .s360-mod-editor-modal, .s360-message-popup, .s360-add-member-popup, .s360-dependent-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) :is(.s360-muted, small, .k, .meta, [class*="muted"], [class*="hint"], [class*="desc"]) {
  color: #5f748f !important;
  -webkit-text-fill-color: #5f748f !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, .s360-mod-editor-modal, .s360-message-popup, .s360-add-member-popup, .s360-dependent-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) :is(.s360-panel, .s360-card, .s360-box, table, .s360-table) {
  background: #ffffff !important;
  border-color: #c1d1e5 !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: none !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, .s360-mod-editor-modal, .s360-message-popup, .s360-add-member-popup, .s360-dependent-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) :is(input, select, textarea, .s360-input, .s360-select, .s360-textarea) {
  background: #ffffff !important;
  border: 1px solid #adc2dc !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: none !important;
  color-scheme: light !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, .s360-mod-editor-modal, .s360-message-popup, .s360-add-member-popup, .s360-dependent-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) :is(.s360-btn, .s360-icon-btn, button) {
  background: #f8fbff !important;
  border: 1px solid #adc2dc !important;
  color: #123b61 !important;
  -webkit-text-fill-color: #123b61 !important;
  box-shadow: none !important;
}

body.s360-theme-light :is(#s360-modal, .s360-modal, .s360-mod-editor-modal, .s360-message-popup, .s360-add-member-popup, .s360-dependent-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) :is(.s360-btn.ok, .s360-btn.primary, .s360-btn.sale, .s360-btn.danger, .s360-btn.warn, button.is-primary, button.is-danger) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Light Theme V5: master normalization for every CRM surface. */
body.s360-theme-light,
html.s360-theme-light {
  color-scheme: light !important;
  background: #f4f8fc !important;
}

body #system360-app.s360-theme-light {
  --s360-l-bg: #f4f8fc;
  --s360-l-bg-soft: #edf4fb;
  --s360-l-surface: #ffffff;
  --s360-l-surface-soft: #f8fbff;
  --s360-l-surface-blue: #eef6ff;
  --s360-l-border: #b8cbe1;
  --s360-l-border-soft: #d7e3f0;
  --s360-l-text: #102033;
  --s360-l-heading: #12263d;
  --s360-l-muted: #5b708a;
  --s360-l-blue: #176fc2;
  --s360-l-shadow: 0 8px 22px rgba(30, 60, 96, .08);
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system {
  background:
    linear-gradient(180deg, #f8fbff 0%, #eef5fb 52%, #f6f9fd 100%) !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-shell, .s360-workarea, .s360-main, .s360-content-scroll, .s360-module, .s360-page, .s360-page-body) {
  min-width: 0 !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
  background:
    linear-gradient(180deg, rgba(248, 251, 255, .88), rgba(239, 246, 252, .94)) !important;
  padding: 18px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll > * {
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-toolbar, .s360-filters, .s360-agenda-actions, .s360-agenda-toolbar, .s360-dash-section-head, .s360-home-sidebar-card, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-backoffice-board, .s360-atc-table-surface, .s360-quality-table-panel) {
  background: var(--s360-l-surface) !important;
  background-image: none !important;
  border: 1px solid var(--s360-l-border) !important;
  border-radius: 14px !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
  box-shadow: var(--s360-l-shadow) !important;
  filter: none !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-toolbar, .s360-filters, .s360-agenda-actions, .s360-agenda-toolbar):hover {
  box-shadow: 0 10px 24px rgba(30, 60, 96, .1) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box) :is(.s360-panel, .s360-card, .s360-box) {
  background: var(--s360-l-surface-soft) !important;
  border-color: var(--s360-l-border-soft) !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(h1, h2, h3, h4, h5, h6, .s360-title-text, .s360-card-title, .s360-section-title, .s360-panel-title, .s360-panel-headline h3, .s360-panel-headline h4, .s360-kpi-value, .s360-card .v, strong, b) {
  color: var(--s360-l-heading) !important;
  -webkit-text-fill-color: var(--s360-l-heading) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(p, label, small, span, div, td, th, li, .s360-label, .s360-muted, .s360-card .k, .s360-subtitle, .s360-help, .s360-hint) {
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-muted, .s360-card .k, small, .s360-subtitle, .s360-help, .s360-hint, [class*="muted"], [class*="subtitle"], [class*="hint"], [class*="desc"], [class*="meta"]) {
  color: var(--s360-l-muted) !important;
  -webkit-text-fill-color: var(--s360-l-muted) !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-grid, .s360-grid-admin, .s360-grid-2, .s360-grid-3, .s360-quality-kpi-grid, .s360-quality-dashboard-grid, .s360-quality-call-info-grid, .s360-backoffice-summary-grid, .s360-backoffice-actions-grid, .s360-atc-flow-kpis) {
  gap: 14px !important;
  min-width: 0 !important;
  align-items: stretch !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-grid, .s360-grid-admin) > *,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-grid-2, .s360-grid-3) > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-topbar, .s360-topbar-global, .s360-topbar-macos) {
  background: rgba(255, 255, 255, .94) !important;
  border: 1px solid var(--s360-l-border) !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
  box-shadow: 0 8px 20px rgba(30, 60, 96, .08) !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-right, .s360-topbar-group, .s360-topbar-group-tools, .s360-topbar-group-status, .s360-topbar-group-meta, .s360-topbar-group-actions) {
  min-width: 0 !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-right {
  overflow-x: auto !important;
  overflow-y: visible !important;
  scrollbar-width: thin !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-live-time, .s360-live-datetime, .s360-topbar-user, .s360-call-top-pill, .s360-work-period-badge) {
  background: #f8fbff !important;
  border: 1px solid #adc2dc !important;
  border-radius: 10px !important;
  color: #123b61 !important;
  -webkit-text-fill-color: #123b61 !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn, .s360-icon-btn, .s360-link-btn, .s360-drop-btn, button:not(.s360-nav-item):not(.s360-theme-switch):not(.s360-home-tab-btn):not(.s360-folder-tab):not(.s360-time-tab):not(.active)) {
  background: #f8fbff !important;
  background-image: none !important;
  border: 1px solid #adc2dc !important;
  color: #123b61 !important;
  -webkit-text-fill-color: #123b61 !important;
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn.ok, .s360-btn.primary, .s360-btn.sale, .s360-btn.danger, .s360-btn.warn, .s360-btn.active, button.is-primary, button.is-danger, .s360-folder-tab.active, .s360-home-tab-btn.active, .s360-time-tab.active) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(input, select, textarea, .s360-input, .s360-select, .s360-textarea) {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #adc2dc !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
  box-shadow: none !important;
  filter: none !important;
  color-scheme: light !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(input, select, textarea, .s360-input, .s360-select, .s360-textarea)::placeholder {
  color: #6b809b !important;
  -webkit-text-fill-color: #6b809b !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table) {
  width: 100% !important;
  background: #ffffff !important;
  background-image: none !important;
  border-color: var(--s360-l-border-soft) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
  box-shadow: none !important;
  filter: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel) {
  background: #ffffff !important;
  border: 1px solid var(--s360-l-border) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  filter: none !important;
  overflow: auto !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table) thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #eaf3fc !important;
  background-image: none !important;
  border-right: 1px solid #c6d6e8 !important;
  border-bottom: 1px solid #9fb7d7 !important;
  color: #12263d !important;
  -webkit-text-fill-color: #12263d !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table) tbody td {
  background: #ffffff !important;
  border-right: 1px solid #d8e3f0 !important;
  border-bottom: 1px solid #d8e3f0 !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table) tbody tr:nth-child(even) td {
  background: #f7faff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table) :is(th, td, tr, thead, tbody) {
  filter: none !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-track, .s360-progress, .s360-progress-track, .s360-bar-track) {
  background: #dfeaf7 !important;
  border: 1px solid #cad9ea !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-kanban, .s360-task-kanban-grid) {
  background: transparent !important;
  gap: 14px !important;
  min-width: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-kanban-col, .s360-task-kanban-col) {
  background: #f8fbff !important;
  background-image: none !important;
  border: 1px solid var(--s360-l-border) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  min-width: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-kanban-card, .s360-task-kanban-item) {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid var(--s360-l-border-soft) !important;
  border-left: 4px solid var(--db360-status-color, var(--s360-l-blue)) !important;
  border-radius: 12px !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-kanban-card, .s360-task-kanban-item) :is(strong, b, span, div) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-db360-kanban-action, .s360-sales-cell-icon, .s360-db360-cell-icon, .s360-icon-cell, .s360-cell-icon) {
  background: #e4f1ff !important;
  border: 1px solid #9bc5f4 !important;
  color: #1767ae !important;
  -webkit-text-fill-color: #1767ae !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-pill, .s360-badge, .s360-tag, .s360-chip, .s360-status-pill, .s360-db360-status-pill, .s360-sales-status-pill) {
  box-shadow: none !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-modal, #s360-modal, .s360-message-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid var(--s360-l-border) !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
  box-shadow: 0 22px 54px rgba(25, 50, 82, .2) !important;
  filter: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-modal-head, .s360-modal-body, .s360-modal-footer, .s360-dropdown *, .s360-popup *, .s360-message-popup *) {
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system [style*="color:#fff"]:not(.s360-btn):not(button),
body #system360-app.s360-theme-light .s360-app.s360-app-system [style*="color: #fff"]:not(.s360-btn):not(button),
body #system360-app.s360-theme-light .s360-app.s360-app-system [style*="color:#ffffff"]:not(.s360-btn):not(button),
body #system360-app.s360-theme-light .s360-app.s360-app-system [style*="color: #ffffff"]:not(.s360-btn):not(button) {
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system [style*="background:#071"],
body #system360-app.s360-theme-light .s360-app.s360-app-system [style*="background: #071"],
body #system360-app.s360-theme-light .s360-app.s360-app-system [style*="background-color:#071"],
body #system360-app.s360-theme-light .s360-app.s360-app-system [style*="background-color: #071"] {
  background: #ffffff !important;
  background-image: none !important;
  color: var(--s360-l-text) !important;
  -webkit-text-fill-color: var(--s360-l-text) !important;
  box-shadow: none !important;
}

body.s360-theme-light :is(.s360-modal, #s360-modal, .s360-mod-editor-modal, .s360-message-popup, .s360-add-member-popup, .s360-dependent-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) {
  background: #ffffff !important;
  background-image: none !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  border-color: #b8cbe1 !important;
  filter: none !important;
}

body.s360-theme-light :is(.s360-modal, #s360-modal, .s360-mod-editor-modal, .s360-message-popup, .s360-add-member-popup, .s360-dependent-popup, .s360-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) * {
  text-shadow: none !important;
}

/* Theme V6: reduce visual stacking and container-on-container clutter in both modes. */
#system360-app .s360-app.s360-app-system {
  --s360-stack-gap: 18px;
  --s360-stack-radius: 12px;
  --s360-stack-border-light: rgba(174, 195, 221, .74);
  --s360-stack-border-dark: rgba(120, 145, 184, .22);
  --s360-stack-shadow-light: 0 6px 16px rgba(31, 65, 105, .07);
  --s360-stack-shadow-dark: 0 10px 24px rgba(0, 0, 0, .18);
}

#system360-app.s360-theme-light .s360-app.s360-app-system {
  --s360-stack-page-bg: #f5f8fc;
  --s360-stack-surface: #ffffff;
  --s360-stack-surface-soft: #f7fbff;
  --s360-stack-surface-subtle: #eef5fc;
  --s360-stack-border: var(--s360-stack-border-light);
  --s360-stack-shadow: var(--s360-stack-shadow-light);
  --s360-stack-text: #102033;
  --s360-stack-muted: #5b708a;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system,
#system360-app:not(.s360-theme-light) .s360-app.s360-app-system {
  --s360-stack-page-bg: #08111f;
  --s360-stack-surface: #0d1828;
  --s360-stack-surface-soft: #101d30;
  --s360-stack-surface-subtle: #142238;
  --s360-stack-border: var(--s360-stack-border-dark);
  --s360-stack-shadow: var(--s360-stack-shadow-dark);
  --s360-stack-text: #e8f1ff;
  --s360-stack-muted: #98aac5;
}

#system360-app .s360-app.s360-app-system :is(.s360-shell, .s360-workarea, .s360-main, .s360-content-scroll) {
  box-shadow: none !important;
  filter: none !important;
}

#system360-app .s360-app.s360-app-system .s360-main {
  background: transparent !important;
  border: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--s360-stack-gap) !important;
  padding: 18px !important;
  background: var(--s360-stack-page-bg) !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll > :is(section, article, div) {
  max-width: 100% !important;
  min-width: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-dash-section, .s360-module-section, .s360-page-section, .s360-home-tab-panel, .s360-kpi-super-panel) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  color: var(--s360-stack-text) !important;
  -webkit-text-fill-color: var(--s360-stack-text) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-dash-section-head, .s360-panel-headline, .s360-home-sidebar-card-head, .s360-section-head, .s360-page-head) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 2px 8px !important;
  margin: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card, .s360-kpi-card, .s360-kpi-smart-card, .s360-kpi-rank-card, .s360-config-section, .s360-form-section, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-quote-builder) {
  background: var(--s360-stack-surface) !important;
  background-image: none !important;
  border: 1px solid var(--s360-stack-border) !important;
  border-radius: var(--s360-stack-radius) !important;
  box-shadow: var(--s360-stack-shadow) !important;
  filter: none !important;
  color: var(--s360-stack-text) !important;
  -webkit-text-fill-color: var(--s360-stack-text) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card):hover {
  transform: none !important;
  box-shadow: var(--s360-stack-shadow) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card, .s360-modal, #s360-modal) :is(.s360-panel, .s360-card, .s360-box, .s360-component-card, .s360-form-section, .s360-config-section, .s360-home-sidebar-card) {
  background: var(--s360-stack-surface-soft) !important;
  background-image: none !important;
  border: 1px solid var(--s360-stack-border) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card, .s360-modal, #s360-modal) :is(.s360-panel, .s360-card, .s360-box, .s360-component-card) :is(.s360-panel, .s360-card, .s360-box, .s360-component-card) {
  background: transparent !important;
  border-color: transparent !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  padding-inline: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-grid, .s360-grid-admin, .s360-grid-2, .s360-grid-3, .s360-dash-grid, .s360-kpi-smart-grid, .s360-kpi-insights-grid, .s360-quality-kpi-grid, .s360-quality-dashboard-grid, .s360-backoffice-summary-grid, .s360-backoffice-actions-grid, .s360-task-kanban-grid, .s360-db360-kanban) {
  gap: var(--s360-stack-gap) !important;
  align-items: stretch !important;
  min-width: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-grid, .s360-grid-admin, .s360-grid-2, .s360-grid-3, .s360-dash-grid, .s360-kpi-smart-grid, .s360-kpi-insights-grid, .s360-quality-kpi-grid, .s360-quality-dashboard-grid, .s360-backoffice-summary-grid, .s360-backoffice-actions-grid) > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-toolbar, .s360-filters, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters, .s360-agenda-toolbar, .s360-agenda-actions, .s360-my-sales-toolbar) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
  color: var(--s360-stack-text) !important;
  -webkit-text-fill-color: var(--s360-stack-text) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-toolbar, .s360-filters, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters, .s360-agenda-actions) + :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap) {
  margin-top: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel) {
  background: var(--s360-stack-surface) !important;
  background-image: none !important;
  border: 1px solid var(--s360-stack-border) !important;
  border-radius: var(--s360-stack-radius) !important;
  box-shadow: none !important;
  filter: none !important;
  max-width: 100% !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel) :is(table, .s360-table) {
  box-shadow: none !important;
  filter: none !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-db360-kanban-col, .s360-task-kanban-col) {
  background: var(--s360-stack-surface-soft) !important;
  background-image: none !important;
  border: 1px solid var(--s360-stack-border) !important;
  border-radius: var(--s360-stack-radius) !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-db360-kanban-card, .s360-task-kanban-item, .s360-sale-workflow-feed-item, .s360-sale-workflow-comment, .s360-sale-workflow-task) {
  background: var(--s360-stack-surface) !important;
  background-image: none !important;
  border: 1px solid var(--s360-stack-border) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: var(--s360-stack-text) !important;
  -webkit-text-fill-color: var(--s360-stack-text) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-modal, #s360-modal, .s360-message-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) {
  background: var(--s360-stack-surface) !important;
  background-image: none !important;
  border: 1px solid var(--s360-stack-border) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-modal, #s360-modal, .s360-message-popup) :is(.s360-modal-head, .s360-modal-body, .s360-modal-footer) {
  background: transparent !important;
  border-color: var(--s360-stack-border) !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-alert, .s360-ok, .s360-error, .s360-modal-note, .s360-form360-important-note) {
  box-shadow: none !important;
  border-radius: 10px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-topbar, .s360-sidebar) {
  transform: none !important;
}

@media (max-width: 980px) {
  #system360-app .s360-app.s360-app-system .s360-content-scroll {
    gap: 14px !important;
    padding: 14px !important;
  }

  #system360-app .s360-app.s360-app-system :is(.s360-grid, .s360-grid-admin, .s360-grid-2, .s360-grid-3, .s360-dash-grid, .s360-quality-dashboard-grid) {
    gap: 12px !important;
  }
}

/* Theme V7: remove nested frames around tabs and segmented controls. */
#system360-app .s360-app.s360-app-system :is(
  .s360-dashboard-tabbed,
  .s360-home-tabs-section,
  .s360-predictivo-tabs-panel,
  .s360-alert-tabs-panel,
  .s360-tabs-panel,
  .s360-tab-panel-head,
  .s360-tabs-shell,
  .s360-section-tabs-shell
) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  padding: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-folder-tabs,
  .s360-folder-tabs-inline,
  .s360-time-tabs,
  .s360-home-tabs,
  .s360-home-section-tabs,
  .s360-leads-section-tabs,
  .s360-alert-center-tabs,
  .s360-quality-tabs,
  .s360-quality-call-tabs,
  .s360-bo-upload-tabs,
  .s360-chat-window-tabs,
  .s360-group-member-tabs
) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  outline: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-folder-tabs,
  .s360-folder-tabs-inline,
  .s360-time-tabs,
  .s360-home-tabs,
  .s360-home-section-tabs,
  .s360-leads-section-tabs,
  .s360-alert-center-tabs,
  .s360-quality-tabs,
  .s360-quality-call-tabs,
  .s360-bo-upload-tabs,
  .s360-chat-window-tabs,
  .s360-group-member-tabs
)::before,
#system360-app .s360-app.s360-app-system :is(
  .s360-folder-tabs,
  .s360-folder-tabs-inline,
  .s360-time-tabs,
  .s360-home-tabs,
  .s360-home-section-tabs,
  .s360-leads-section-tabs,
  .s360-alert-center-tabs,
  .s360-quality-tabs,
  .s360-quality-call-tabs,
  .s360-bo-upload-tabs,
  .s360-chat-window-tabs,
  .s360-group-member-tabs
)::after {
  content: none !important;
  display: none !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-folder-tab,
  .s360-time-tab,
  .s360-home-tab-btn,
  .s360-home-section-tab,
  .s360-leads-section-tab,
  .s360-alert-center-tabs .s360-btn,
  .s360-quality-call-tabs button,
  .s360-bo-upload-tabs button,
  .s360-chat-window-tab,
  .s360-group-member-tab
) {
  flex: 1 1 150px !important;
  min-width: 130px !important;
  max-width: 100% !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 10px 14px !important;
  border-radius: 10px !important;
  background: var(--s360-stack-surface-soft) !important;
  background-image: none !important;
  border: 1px solid var(--s360-stack-border) !important;
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
  transform: none !important;
  color: var(--s360-stack-text) !important;
  -webkit-text-fill-color: var(--s360-stack-text) !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-folder-tab,
  .s360-time-tab,
  .s360-home-tab-btn,
  .s360-home-section-tab,
  .s360-leads-section-tab,
  .s360-alert-center-tabs .s360-btn,
  .s360-quality-call-tabs button,
  .s360-bo-upload-tabs button,
  .s360-chat-window-tab,
  .s360-group-member-tab
)::before,
#system360-app .s360-app.s360-app-system :is(
  .s360-folder-tab,
  .s360-time-tab,
  .s360-home-tab-btn,
  .s360-home-section-tab,
  .s360-leads-section-tab,
  .s360-alert-center-tabs .s360-btn,
  .s360-quality-call-tabs button,
  .s360-bo-upload-tabs button,
  .s360-chat-window-tab,
  .s360-group-member-tab
)::after {
  content: none !important;
  display: none !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-folder-tab:hover,
  .s360-time-tab:hover,
  .s360-home-tab-btn:hover,
  .s360-home-section-tab:hover,
  .s360-leads-section-tab:hover,
  .s360-alert-center-tabs .s360-btn:hover,
  .s360-quality-call-tabs button:hover,
  .s360-bo-upload-tabs button:hover,
  .s360-chat-window-tab:hover,
  .s360-group-member-tab:hover
) {
  background: var(--s360-stack-surface) !important;
  border-color: var(--s360-stack-border) !important;
  box-shadow: none !important;
  transform: none !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-folder-tab.active,
  .s360-folder-tab.is-active,
  .s360-time-tab.active,
  .s360-time-tab.is-active,
  .s360-home-tab-btn.active,
  .s360-home-tab-btn.is-active,
  .s360-home-section-tab.active,
  .s360-home-section-tab.is-active,
  .s360-leads-section-tab.active,
  .s360-leads-section-tab.is-active,
  .s360-alert-center-tabs .s360-btn.is-active,
  .s360-quality-call-tabs button.is-active,
  .s360-bo-upload-tabs button.is-active,
  .s360-chat-window-tab.active,
  .s360-chat-window-tab.is-active,
  .s360-group-member-tab.active,
  .s360-group-member-tab.is-active
) {
  background: var(--s360-stack-surface) !important;
  background-image: none !important;
  border-color: var(--s360-stack-border) !important;
  color: var(--s360-stack-text) !important;
  -webkit-text-fill-color: var(--s360-stack-text) !important;
  box-shadow: inset 0 -3px 0 #8b5cf6 !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-folder-tab.active,
  .s360-folder-tab.is-active,
  .s360-time-tab.active,
  .s360-time-tab.is-active,
  .s360-home-tab-btn.active,
  .s360-home-tab-btn.is-active,
  .s360-home-section-tab.active,
  .s360-home-section-tab.is-active,
  .s360-leads-section-tab.active,
  .s360-leads-section-tab.is-active,
  .s360-alert-center-tabs .s360-btn.is-active,
  .s360-quality-call-tabs button.is-active,
  .s360-bo-upload-tabs button.is-active,
  .s360-chat-window-tab.active,
  .s360-chat-window-tab.is-active,
  .s360-group-member-tab.active,
  .s360-group-member-tab.is-active
) {
  border-color: #9fbbe0 !important;
  color: #11375a !important;
  -webkit-text-fill-color: #11375a !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system :is(
  .s360-folder-tab.active,
  .s360-folder-tab.is-active,
  .s360-time-tab.active,
  .s360-time-tab.is-active,
  .s360-home-tab-btn.active,
  .s360-home-tab-btn.is-active,
  .s360-home-section-tab.active,
  .s360-home-section-tab.is-active,
  .s360-leads-section-tab.active,
  .s360-leads-section-tab.is-active,
  .s360-alert-center-tabs .s360-btn.is-active,
  .s360-quality-call-tabs button.is-active,
  .s360-bo-upload-tabs button.is-active,
  .s360-chat-window-tab.active,
  .s360-chat-window-tab.is-active,
  .s360-group-member-tab.active,
  .s360-group-member-tab.is-active
) {
  border-color: rgba(144, 166, 206, .34) !important;
  color: #e8f1ff !important;
  -webkit-text-fill-color: #e8f1ff !important;
}

#system360-app .s360-app.s360-app-system :is(
  .s360-home-tabs-section,
  .s360-predictivo-tabs-panel,
  .s360-dashboard-tabbed
) > :is(.s360-folder-tabs, .s360-time-tabs, .s360-home-tabs, .s360-home-section-tabs, .s360-leads-section-tabs) {
  margin-bottom: 18px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-home-tabs-section, .s360-dashboard-tabbed) + :is(.s360-dash-section, .s360-home-tab-panel, .s360-kpi-super-panel) {
  margin-top: 0 !important;
}

@media (max-width: 760px) {
  #system360-app .s360-app.s360-app-system :is(
    .s360-folder-tab,
    .s360-time-tab,
    .s360-home-tab-btn,
    .s360-home-section-tab,
    .s360-leads-section-tab,
    .s360-alert-center-tabs .s360-btn,
    .s360-quality-call-tabs button,
    .s360-bo-upload-tabs button,
    .s360-chat-window-tab,
    .s360-group-member-tab
  ) {
    flex-basis: 100% !important;
  }
}

/* Light Theme V8: Inicio cleanup, no framed wrappers around page sections. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-dashboard,
  .s360-dashboard.s360-dashboard-tabbed,
  .s360-home-layout-shell,
  .s360-home-layout-shell.is-right-menu-collapsed,
  .s360-home-main-column,
  .s360-home-greeting-section,
  .s360-home-tabs-section,
  .s360-home-right-sidebar
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dashboard.s360-dashboard-tabbed {
  display: block !important;
  padding: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-layout-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 320px) !important;
  gap: 24px !important;
  align-items: start !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
  grid-template-columns: minmax(0, 1fr) 54px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-main-column {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  min-width: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-greeting-section {
  margin: 0 !important;
  padding: 0 2px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-greeting-text {
  margin: 0 !important;
  color: #5b708a !important;
  -webkit-text-fill-color: #5b708a !important;
  font-size: 30px !important;
  line-height: 1.2 !important;
  font-weight: 750 !important;
  letter-spacing: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section {
  margin: 0 !important;
  padding: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tabs.s360-home-section-tabs {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(120px, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tab-btn.s360-home-section-tab {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #b8cbe1 !important;
  box-shadow: none !important;
  color: #173a5c !important;
  -webkit-text-fill-color: #173a5c !important;
  font-size: 15px !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
  transform: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tab-btn.s360-home-section-tab.active {
  background: #ffffff !important;
  border-color: #9ab7dc !important;
  box-shadow: inset 0 -3px 0 #ec4fc3 !important;
  color: #11375a !important;
  -webkit-text-fill-color: #11375a !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tab-btn.s360-home-section-tab::before,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tab-btn.s360-home-section-tab::after,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tabs::before,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tabs::after {
  content: none !important;
  display: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-main-column > .s360-home-tab-panel,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-main-column > :is(.s360-sec-kpis, .s360-sec-productividad, .s360-sec-rendimiento, .s360-sec-eficiencia, .s360-sec-alertas) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel > .s360-dash-section-head {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 18px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel > .s360-dash-section-head h2 {
  margin: 0 0 6px !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  font-size: 22px !important;
  line-height: 1.2 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel > .s360-dash-section-head p {
  margin: 0 !important;
  color: #5b708a !important;
  -webkit-text-fill-color: #5b708a !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel > .s360-panel.s360-component-card {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #d4e1ef !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  padding: 22px !important;
  margin: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel .s360-panel-headline {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 16px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel .s360-panel .s360-card,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel .s360-component-kpi,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel .s360-chart-row,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel .s360-kpi-live-item {
  background: #f8fbff !important;
  background-image: none !important;
  border: 1px solid #d7e3f0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-efficiency-hub .s360-alert-list .s360-alert,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tab-panel .s360-alert {
  box-shadow: none !important;
  border-radius: 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-right-sidebar {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-right-sidebar .s360-home-sidebar-card {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #d4e1ef !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  padding: 16px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-right-sidebar .s360-home-sidebar-card .s360-panel-headline {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-cal-day,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-profile-meta > div,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-cal-selected,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-cal-selected-metrics > div {
  box-shadow: none !important;
}

@media (max-width: 1180px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-layout-shell,
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tabs.s360-home-section-tabs {
    grid-template-columns: 1fr !important;
  }
}

/* Light Theme V9: layout discipline and overflow cleanup. */
body #system360-app.s360-theme-light {
  --s360-l9-page: #f3f7fb;
  --s360-l9-surface: #ffffff;
  --s360-l9-surface-soft: #f7fbff;
  --s360-l9-border: #c8d8ea;
  --s360-l9-border-strong: #a9bfd9;
  --s360-l9-text: #11263c;
  --s360-l9-muted: #5d7188;
  --s360-l9-accent: #176fc2;
  --s360-l9-gap: 16px;
  --s360-l9-radius: 12px;
  --s360-l9-shadow: 0 8px 20px rgba(31, 65, 105, .08);
  color-scheme: light !important;
}

body #system360-app.s360-theme-light,
body #system360-app.s360-theme-light * {
  box-sizing: border-box !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system {
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  overflow: hidden !important;
  background: linear-gradient(180deg, #f9fcff 0%, var(--s360-l9-page) 100%) !important;
  color: var(--s360-l9-text) !important;
  -webkit-text-fill-color: var(--s360-l9-text) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-shell,
  .s360-workarea,
  .s360-main,
  .s360-content-scroll,
  .s360-dashboard,
  .s360-dashboard-tabbed,
  .s360-home-layout-shell,
  .s360-home-main-column,
  .s360-home-right-sidebar,
  .s360-panel,
  .s360-card,
  .s360-box,
  .s360-component-card,
  .s360-toolbar,
  .s360-filters,
  .s360-grid,
  .s360-grid-admin,
  .s360-grid-2,
  .s360-grid-3,
  .s360-dash-grid,
  .s360-table-wrap,
  .s360-sales-table-wrap,
  .s360-seguimientos-wrap,
  .s360-db360-table-wrap
) {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell {
  width: calc(100vw - 16px) !important;
  max-width: calc(100vw - 16px) !important;
  height: calc(100dvh - 16px) !important;
  margin: 8px !important;
  padding: 10px !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 10px !important;
  overflow: hidden !important;
  background: rgba(255, 255, 255, .72) !important;
  border: 1px solid rgba(186, 204, 226, .82) !important;
  border-radius: 16px !important;
  box-shadow: var(--s360-l9-shadow) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-workarea {
  height: 100% !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 248px) minmax(0, 1fr) !important;
  gap: 12px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed .s360-workarea {
  grid-template-columns: 84px minmax(0, 1fr) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar {
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  border: 1px solid var(--s360-l9-border) !important;
  background: var(--s360-l9-surface) !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav {
  overflow-x: auto !important;
  overflow-y: auto !important;
  padding-right: 4px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  grid-template-columns: 24px minmax(0, 1fr) minmax(18px, auto) !important;
  align-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item :is(.s360-nav-label, span:not(.s360-nav-icon):not(.s360-nav-meta):not(.s360-nav-badge)) {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed .s360-nav-item {
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  margin-inline: auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos {
  min-height: 58px !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: minmax(180px, auto) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  overflow: visible !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .92) !important;
  border: 1px solid var(--s360-l9-border) !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-top-left {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-title-text {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  letter-spacing: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-right {
  min-width: 0 !important;
  max-width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(
  .s360-topbar-group,
  .s360-topbar-group-tools,
  .s360-topbar-group-status,
  .s360-topbar-group-meta,
  .s360-topbar-group-actions
) {
  min-width: 0 !important;
  max-width: 100% !important;
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar-user {
  max-width: 220px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-icon-btn, .s360-top-action-btn) {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-live-time, .s360-live-datetime, .s360-call-top-pill, .s360-work-period-badge, .s360-topbar-user) {
  max-width: 100% !important;
  min-height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 0 11px !important;
  line-height: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-main {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: var(--s360-l9-gap) !important;
  padding: 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-gutter: stable !important;
  background: var(--s360-l9-page) !important;
  border-radius: 14px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll > * {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card) {
  overflow: visible !important;
  padding: 16px !important;
  border-radius: var(--s360-l9-radius) !important;
  border: 1px solid var(--s360-l9-border) !important;
  background: var(--s360-l9-surface) !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel-headline, .s360-dash-section-head, .s360-section-head, .s360-page-head) {
  min-width: 0 !important;
  max-width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel-headline, .s360-dash-section-head, .s360-section-head, .s360-page-head) > :is(h1, h2, h3, h4, p, div, span) {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-grid, .s360-grid-admin) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)) !important;
  gap: 14px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-grid-2, .s360-two) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)) !important;
  gap: 14px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-grid-3, .s360-quality-kpi-grid, .s360-backoffice-summary-grid, .s360-backoffice-actions-grid) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important;
  gap: 14px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-grid {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 14px !important;
  align-items: stretch !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-grid > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col.span-12 { grid-column: span 12 !important; }
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col.span-8 { grid-column: span 8 !important; }
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col.span-7 { grid-column: span 7 !important; }
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col.span-6 { grid-column: span 6 !important; }
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col.span-5 { grid-column: span 5 !important; }
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col.span-4 { grid-column: span 4 !important; }
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col.span-3 { grid-column: span 3 !important; }

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-toolbar, .s360-filters, .s360-agenda-actions, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters, .s360-my-sales-toolbar) {
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn, .s360-link-btn, button:not(.s360-nav-item)) {
  max-width: 100% !important;
  min-width: 0 !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(input, select, textarea, .s360-input, .s360-select, .s360-textarea) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-layout-shell, .s360-home-layout-shell.is-right-menu-collapsed) {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 316px) !important;
  gap: 18px !important;
  align-items: start !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-layout-shell.is-right-menu-collapsed {
  grid-template-columns: minmax(0, 1fr) 54px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-main-column {
  display: flex !important;
  flex-direction: column !important;
  gap: 18px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-greeting-text {
  font-size: clamp(22px, 2.2vw, 30px) !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tabs.s360-home-section-tabs {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 132px), 1fr)) !important;
  gap: 10px !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-tabs-section .s360-home-tab-btn.s360-home-section-tab {
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 44px !important;
  padding: 9px 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  overflow-wrap: anywhere !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-right-sidebar {
  min-width: 0 !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed {
  align-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-profile-card {
  text-align: center !important;
  align-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-profile-card :is(h4, p) {
  max-width: 100% !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-profile-meta,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-cal-selected-metrics {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 92px), 1fr)) !important;
  gap: 8px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-profile-meta > div, .s360-home-cal-selected-metrics > div) {
  min-width: 0 !important;
  padding: 10px !important;
  border-radius: 10px !important;
  background: var(--s360-l9-surface-soft) !important;
  border: 1px solid #d9e5f1 !important;
  text-align: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-nav {
  display: inline-flex !important;
  gap: 6px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-weekdays,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-grid {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day {
  width: 100% !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1 !important;
  min-height: 34px !important;
  padding: 4px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 2px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day :is(span, small) {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row, .s360-kpi-live-item, .s360-eff-advisor-item, .s360-eff-queue-item, .s360-home-cal-agenda-item, .s360-alert, .s360-drop-item, .s360-notif-card) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row, .s360-kpi-dual-row) {
  display: grid !important;
  grid-template-columns: minmax(110px, .9fr) minmax(120px, 1.4fr) minmax(64px, auto) !important;
  align-items: center !important;
  gap: 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row span, .s360-chart-row b, .s360-eff-advisor-item small, .s360-eff-queue-item small, .s360-eff-queue-item p, .s360-alert) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel) {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  border-radius: var(--s360-l9-radius) !important;
  border: 1px solid var(--s360-l9-border) !important;
  background: var(--s360-l9-surface) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table) {
  max-width: none !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table) :is(th, td) {
  max-width: 280px !important;
  vertical-align: middle !important;
  overflow-wrap: anywhere !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(img, svg, canvas, video) {
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-svg-icon {
  flex: 0 0 auto !important;
}

body #system360-app.s360-theme-light :is(.s360-modal, #s360-modal, .s360-message-popup, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown, .s360-drive-popup, .s360-aircall-popup, #s360-db360-drawer) {
  max-width: calc(100vw - 24px) !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light :is(.s360-modal-body, .s360-dropdown, .s360-notif-panel, .s360-chat-dropdown, .s360-clock-dropdown) {
  overflow-x: hidden !important;
}

@media (max-width: 1320px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-home-layout-shell, .s360-home-layout-shell.is-right-menu-collapsed) {
    grid-template-columns: 1fr !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-right-sidebar.is-collapsed {
    display: none !important;
  }
}

@media (min-width: 981px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell {
    --s360-left-rail-w: 248px;
    grid-template-columns: var(--s360-left-rail-w) minmax(0, 1fr) !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed {
    --s360-left-rail-w: 84px;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell > .s360-topbar.s360-topbar-global {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell > .s360-workarea {
    display: contents !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell > .s360-workarea > .s360-sidebar {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 3 !important;
    width: 100% !important;
    height: 100% !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell > .s360-workarea > .s360-main {
    grid-column: 2 / 3 !important;
    grid-row: 2 / 3 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }
}

@media (max-width: 1100px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col:is(.span-8, .span-7, .span-6, .span-5, .span-4, .span-3) {
    grid-column: span 12 !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-chart-row {
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
  }
}

@media (max-width: 980px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell {
    width: calc(100vw - 8px) !important;
    max-width: calc(100vw - 8px) !important;
    height: calc(100dvh - 8px) !important;
    margin: 4px !important;
    padding: 8px !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-workarea {
    grid-template-columns: 80px minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos {
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-right,
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(.s360-topbar-group, .s360-topbar-group-tools, .s360-topbar-group-status, .s360-topbar-group-meta, .s360-topbar-group-actions) {
    justify-content: flex-start !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
    padding: 12px !important;
  }
}

@media (max-width: 760px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
    padding: 10px !important;
    gap: 12px !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card) {
    padding: 14px !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar-user,
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-live-datetime {
    max-width: 100% !important;
  }
}

/* Light Theme V10: keep content readable after layout cleanup. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel,
  .s360-card,
  .s360-box,
  .s360-component-card,
  .s360-dash-section,
  .s360-home-tab-panel,
  .s360-home-sidebar-card,
  .s360-chart-row,
  .s360-kpi-live-item,
  .s360-eff-advisor-item,
  .s360-eff-queue-item,
  .s360-alert,
  .s360-ok,
  .s360-error,
  .s360-modal,
  #s360-modal,
  .s360-modal-body,
  .s360-dropdown,
  .s360-notif-dropdown,
  .s360-clock-dropdown,
  .s360-chat-dropdown
) {
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel *,
  .s360-card *,
  .s360-box *,
  .s360-component-card *,
  .s360-dash-section *,
  .s360-home-tab-panel *,
  .s360-home-sidebar-card *,
  .s360-modal *,
  #s360-modal *
) {
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  label,
  small,
  .s360-muted,
  .s360-label,
  .s360-subtitle,
  .s360-help,
  .s360-hint,
  .s360-alert,
  .s360-ok,
  .s360-error,
  .s360-chart-row span,
  .s360-chart-row b,
  .s360-kpi-live-item strong,
  .s360-kpi-live-item b,
  .s360-eff-advisor-item small,
  .s360-eff-queue-item small,
  .s360-eff-queue-item p,
  .s360-home-cal-agenda-item strong,
  .s360-home-cal-agenda-item span,
  .s360-notif-title,
  .s360-notif-desc
) {
  min-width: 0 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel-headline,
  .s360-dash-section-head,
  .s360-section-head,
  .s360-page-head,
  .s360-card-head,
  .s360-my-sales-card-head,
  .s360-quality-card-head
) {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel-headline h3,
  .s360-panel-headline h4,
  .s360-dash-section-head h2,
  .s360-card-head h3,
  .s360-my-sales-card-head h4,
  .s360-quality-card-head h3
) {
  flex: 1 1 220px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-chart-list,
  .s360-alert-list,
  .s360-eff-advisor-list,
  .s360-eff-queue-list,
  .s360-home-cal-agenda-list,
  .s360-drop-list,
  .s360-notif-panel
) {
  display: grid !important;
  gap: 10px !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row, .s360-kpi-dual-row) {
  min-height: auto !important;
  height: auto !important;
  grid-template-columns: minmax(0, .95fr) minmax(120px, 1.35fr) minmax(0, auto) !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-track, .s360-kpi-dual-track, .s360-progress, .s360-progress-track) {
  min-width: 90px !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn, .s360-link-btn, button:not(.s360-nav-item):not(.s360-icon-btn):not(.s360-top-action-btn)) {
  height: auto !important;
  min-height: 38px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-icon-btn, .s360-top-action-btn, .s360-home-cal-nav-btn) {
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel) {
  overflow-x: auto !important;
  overflow-y: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table) :is(th, td) {
  max-width: none !important;
  white-space: normal !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-modal, #s360-modal) {
  max-height: calc(100dvh - 24px) !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-modal-body, #s360-modal .s360-modal-body) {
  max-height: calc(100dvh - 120px) !important;
  overflow: auto !important;
}

@media (max-width: 1100px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row, .s360-kpi-dual-row) {
    grid-template-columns: 1fr !important;
  }
}

/* Light Theme V11: full readability pass. Prevent overlaps before decorative polish. */
body #system360-app.s360-theme-light .s360-app.s360-app-system {
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell {
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-main {
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  align-items: stretch !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-dashboard,
  .s360-dashboard-tabbed,
  .s360-home-layout-shell,
  .s360-home-main-column,
  .s360-home-right-sidebar,
  .s360-dash-section,
  .s360-home-tab-panel,
  .s360-module-section,
  .s360-page-section
) {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel,
  .s360-card,
  .s360-box,
  .s360-component-card,
  .s360-kpi-card,
  .s360-kpi-smart-card,
  .s360-kpi-rank-card,
  .s360-home-sidebar-card,
  .s360-quality-chart-card,
  .s360-quality-kpi,
  .s360-my-sales-chart-card,
  .s360-my-sales-mini-card,
  .s360-db360-kanban-card,
  .s360-task-kanban-item
) {
  position: relative !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  overflow: hidden !important;
  contain: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel,
  .s360-card,
  .s360-box,
  .s360-component-card,
  .s360-home-sidebar-card
) > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  label,
  small,
  span,
  strong,
  b,
  li,
  td,
  th,
  .s360-title-text,
  .s360-muted,
  .s360-label,
  .s360-subtitle,
  .s360-help,
  .s360-hint,
  .s360-card-title,
  .s360-section-title,
  .s360-panel-title,
  .s360-notif-title,
  .s360-notif-desc
) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  text-overflow: clip !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  label,
  small,
  .s360-muted,
  .s360-label,
  .s360-subtitle,
  .s360-help,
  .s360-hint,
  .s360-alert,
  .s360-ok,
  .s360-error,
  .s360-notif-title,
  .s360-notif-desc
) {
  white-space: normal !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel-headline,
  .s360-dash-section-head,
  .s360-section-head,
  .s360-page-head,
  .s360-card-head,
  .s360-my-sales-card-head,
  .s360-quality-card-head,
  .s360-eff-advisor-head,
  .s360-eff-queue-head,
  .s360-home-cal-selected-head
) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel-headline > *,
  .s360-dash-section-head > *,
  .s360-section-head > *,
  .s360-page-head > *,
  .s360-card-head > *,
  .s360-my-sales-card-head > *,
  .s360-quality-card-head > *
) {
  min-width: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-grid,
  .s360-grid-admin,
  .s360-grid-2,
  .s360-grid-3,
  .s360-dash-grid,
  .s360-kpi-smart-grid,
  .s360-kpi-insights-grid,
  .s360-quality-kpi-grid,
  .s360-quality-dashboard-grid,
  .s360-backoffice-summary-grid,
  .s360-backoffice-actions-grid
) {
  display: grid !important;
  align-items: stretch !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-grid,
  .s360-grid-admin,
  .s360-grid-2,
  .s360-grid-3,
  .s360-dash-grid,
  .s360-kpi-smart-grid,
  .s360-kpi-insights-grid,
  .s360-quality-kpi-grid,
  .s360-quality-dashboard-grid,
  .s360-backoffice-summary-grid,
  .s360-backoffice-actions-grid
) > * {
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-chart-list,
  .s360-alert-list,
  .s360-eff-advisor-list,
  .s360-eff-queue-list,
  .s360-home-cal-agenda-list,
  .s360-stage-list,
  .s360-drop-list,
  .s360-notif-panel
) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-chart-row,
  .s360-kpi-dual-row,
  .s360-kpi-live-item,
  .s360-eff-advisor-item,
  .s360-eff-queue-item,
  .s360-home-cal-agenda-item,
  .s360-alert,
  .s360-ok,
  .s360-error,
  .s360-drop-item,
  .s360-notif-card
) {
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row, .s360-kpi-dual-row) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(96px, 1.1fr) minmax(0, max-content) !important;
  align-items: center !important;
  gap: 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row > *, .s360-kpi-dual-row > *) {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-chart-track,
  .s360-kpi-dual-track,
  .s360-progress,
  .s360-progress-track,
  .s360-bar-track
) {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-toolbar,
  .s360-filters,
  .s360-agenda-actions,
  .s360-db-toolbar,
  .s360-db360-toolbar,
  .s360-db360-toolbar-main,
  .s360-db360-toolbar-filters,
  .s360-my-sales-toolbar
) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-btn,
  .s360-link-btn,
  .s360-drop-btn,
  button:not(.s360-icon-btn):not(.s360-top-action-btn):not(.s360-nav-item)
) {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 38px !important;
  white-space: normal !important;
  text-align: center !important;
  overflow-wrap: anywhere !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-home-tab-btn,
  .s360-folder-tab,
  .s360-time-tab,
  .s360-leads-section-tab,
  .s360-home-section-tab
) {
  height: auto !important;
  min-height: 42px !important;
  max-height: none !important;
  white-space: normal !important;
  line-height: 1.2 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-home-tabs,
  .s360-home-section-tabs,
  .s360-folder-tabs,
  .s360-folder-tabs-inline,
  .s360-time-tabs,
  .s360-leads-section-tabs,
  .s360-quality-tabs
) {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos {
  height: auto !important;
  min-height: 58px !important;
  max-height: none !important;
  align-items: start !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-right {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding-bottom: 2px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos :is(
  .s360-topbar-group,
  .s360-topbar-group-tools,
  .s360-topbar-group-status,
  .s360-topbar-group-meta,
  .s360-topbar-group-actions
) {
  flex: 0 1 auto !important;
  height: auto !important;
  min-height: 36px !important;
  max-height: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-live-time,
  .s360-live-datetime,
  .s360-call-top-pill,
  .s360-work-period-badge,
  .s360-topbar-user
) {
  height: auto !important;
  min-height: 34px !important;
  max-height: none !important;
  white-space: normal !important;
  line-height: 1.15 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  input,
  select,
  textarea,
  .s360-input,
  .s360-select,
  .s360-textarea
) {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system textarea,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-textarea {
  height: auto !important;
  min-height: 92px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-table-wrap,
  .s360-sales-table-wrap,
  .s360-seguimientos-wrap,
  .s360-db360-table-wrap,
  .s360-atc-horizontal-wrap,
  .s360-atcdb-table-wrap,
  .s360-quality-table-panel,
  .s360-atc-table-panel
) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-sales, .s360-table-follow, .s360-db360-table) {
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  table-layout: auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(table, .s360-table, .s360-table-sales, .s360-table-follow, .s360-db360-table) :is(th, td) {
  white-space: normal !important;
  max-width: 360px !important;
  overflow-wrap: anywhere !important;
  vertical-align: top !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-modal,
  #s360-modal,
  .s360-message-popup,
  .s360-dropdown,
  .s360-notif-dropdown,
  .s360-chat-dropdown,
  .s360-clock-dropdown,
  .s360-drive-popup,
  .s360-aircall-popup,
  #s360-db360-drawer
) {
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100dvh - 24px) !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-modal-body,
  #s360-modal .s360-modal-body,
  .s360-dropdown,
  .s360-notif-panel,
  .s360-chat-dropdown,
  .s360-clock-dropdown
) {
  overflow: auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day {
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day :is(span, small) {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media (max-width: 1200px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col:is(.span-12, .span-8, .span-7, .span-6, .span-5, .span-4, .span-3) {
    grid-column: span 6 !important;
  }
}

@media (max-width: 760px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-grid {
    grid-template-columns: 1fr !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-dash-col:is(.span-12, .span-8, .span-7, .span-6, .span-5, .span-4, .span-3) {
    grid-column: 1 / -1 !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row, .s360-kpi-dual-row) {
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: stretch !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-topbar.s360-topbar-macos {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Light Theme V12: unwrap operational text inside content surfaces. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel,
  .s360-card,
  .s360-box,
  .s360-component-card,
  .s360-home-tab-panel,
  .s360-home-sidebar-card,
  .s360-chart-row,
  .s360-alert,
  .s360-ok,
  .s360-error,
  .s360-notif-card,
  .s360-db360-kanban-card,
  .s360-task-kanban-item
) :is(
  p,
  label,
  small,
  span:not(.s360-svg-icon):not(.s360-icon-badge):not(.s360-nav-icon):not(.s360-nav-meta):not(.s360-badge):not(.s360-pill):not(.s360-tag):not(.s360-chip),
  strong,
  b,
  em,
  div
) {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  text-overflow: clip !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel,
  .s360-card,
  .s360-box,
  .s360-component-card,
  .s360-home-sidebar-card
) :is(.s360-badge, .s360-pill, .s360-tag, .s360-chip, .s360-status-pill, .s360-sales-status-pill, .s360-db360-status-pill) {
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-chart-row,
  .s360-kpi-dual-row,
  .s360-eff-advisor-item,
  .s360-eff-queue-item,
  .s360-home-cal-agenda-item,
  .s360-alert,
  .s360-ok,
  .s360-error
) > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel,
  .s360-card,
  .s360-box,
  .s360-component-card,
  .s360-home-sidebar-card,
  .s360-chart-row,
  .s360-kpi-live-item,
  .s360-eff-advisor-item,
  .s360-eff-queue-item,
  .s360-alert,
  .s360-ok,
  .s360-error
) {
  isolation: isolate !important;
}

/* Light Theme V13: targeted repairs for the visible white-theme regressions. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) {
  --s360-left-rail-w: 84px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar {
  width: 84px !important;
  min-width: 84px !important;
  max-width: 84px !important;
  padding: 10px 8px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar-head {
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  gap: 8px !important;
  padding: 4px 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-brand {
  width: 48px !important;
  max-width: 48px !important;
  justify-content: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
  overflow-x: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-submenu-wrap,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-submenu-wrap.open,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav-section-label {
  display: none !important;
  max-height: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav-item {
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  place-items: center !important;
  margin: 0 auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav-item :is(.s360-nav-label, .s360-nav-meta, .s360-chevron, .s360-nav-badge),
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav-item > span:not(.s360-nav-icon) {
  display: none !important;
  width: 0 !important;
  max-width: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar {
  width: 248px !important;
  min-width: 248px !important;
  max-width: 248px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-nav-item {
  grid-template-columns: 24px minmax(0, 1fr) auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-nav-item :is(.s360-nav-label, .s360-nav-item > span:not(.s360-nav-icon):not(.s360-nav-meta)) {
  display: inline-flex !important;
  width: auto !important;
  max-width: 100% !important;
  opacity: 1 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-right-sidebar {
  position: static !important;
  top: auto !important;
  align-self: start !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-rows: auto !important;
  gap: 16px !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  padding: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-right-sidebar .s360-home-sidebar-card {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 12px !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 16px !important;
  background: #ffffff !important;
  border: 1px solid #cfe0f2 !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-profile-card.s360-home-sidebar-card {
  justify-items: center !important;
  text-align: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-profile-card .s360-home-sidebar-card-head {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-profile-card .s360-home-sidebar-card-head h3 {
  text-align: left !important;
  margin: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-sidebar-toggle {
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 36px !important;
  padding: 8px 12px !important;
  white-space: nowrap !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card {
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-panel-headline {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 8px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-month {
  margin: 0 !important;
  text-align: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-weekdays,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-grid {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day {
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 38px !important;
  aspect-ratio: 1 / 1 !important;
  padding: 4px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 1px !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected {
  width: 100% !important;
  margin-top: 10px !important;
  display: grid !important;
  gap: 10px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected-metrics {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-agenda-item {
  display: grid !important;
  gap: 4px !important;
  height: auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder * {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 42%) !important;
  gap: 18px !important;
  align-items: start !important;
  width: 100% !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder :is(
  .s360-panel,
  .s360-card,
  .s360-box,
  .s360-component-card,
  [class*="quote-card"],
  [class*="quote-section"],
  [class*="quote-field"],
  [class*="quote-summary"]
) {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #cfe0f2 !important;
  box-shadow: none !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder :is(input, select, textarea, .s360-input, .s360-select, .s360-textarea) {
  background: #ffffff !important;
  border: 1px solid #adc2dc !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  width: 100% !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder :is(.s360-grid, .s360-grid-2, .s360-grid-3) {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(#s360-quote-pdf-preview, .s360-quote-pdf-preview, [id*="quote-pdf-preview"]) {
  width: 100% !important;
  max-width: 100% !important;
  min-height: min(720px, calc(100dvh - 180px)) !important;
  border: 1px solid #cfe0f2 !important;
  border-radius: 14px !important;
  background: #ffffff !important;
}

@media (max-width: 1180px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder {
    grid-template-columns: 1fr !important;
  }
}

/* Light Theme V14: concrete fixes for Inicio sidebar, collapsed menu and Cotizador. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-layout-shell {
  align-items: start !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card :is(
  .s360-panel-headline,
  .s360-home-cal-month,
  .s360-home-cal-weekdays,
  .s360-home-cal-grid,
  .s360-home-cal-selected,
  .s360-home-cal-selected-head,
  .s360-home-cal-selected-metrics,
  .s360-home-cal-agenda-list,
  .s360-home-cal-agenda-item
) {
  position: static !important;
  transform: none !important;
  inset: auto !important;
  float: none !important;
  clear: both !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-grid {
  margin-bottom: 12px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-selected {
  border: 1px solid #d8e5f3 !important;
  border-radius: 12px !important;
  background: #f8fbff !important;
  padding: 12px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-right-sidebar .s360-home-sidebar-card + .s360-home-sidebar-card {
  margin-top: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar :is(.s360-side-user-meta, .s360-side-user-menu-toggle, .s360-side-user-menu) {
  display: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar-foot {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-side-userchip {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-workspace {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 42%) !important;
  gap: 18px !important;
  align-items: start !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-form-pane,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-preview-pane {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-preview-pane {
  position: sticky !important;
  top: 12px !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  max-height: calc(100dvh - 104px) !important;
  overflow: hidden !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #cfe0f2 !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-preview-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px !important;
  background: #f7fbff !important;
  border-bottom: 1px solid #d7e3f0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-preview-head :is(h3, p) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  white-space: normal !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-preview-frame-wrap {
  min-height: 560px !important;
  height: calc(100dvh - 190px) !important;
  max-height: 820px !important;
  overflow: auto !important;
  padding: 12px !important;
  background: #eef4fb !important;
  background-image: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-pdf-preview {
  width: 100% !important;
  height: 100% !important;
  min-height: 540px !important;
  border: 1px solid #c8d8ea !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder :is(
  .s360-quote-summary-grid,
  .s360-quote-notes-grid,
  .s360-quote-recap-metrics
) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder :is(
  .s360-quote-summary-card,
  .s360-quote-note-card,
  .s360-quote-recap-card,
  .s360-quote-recap-metrics,
  .s360-quote-ready-card,
  .s360-quote-recap-metric
) {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #cfe0f2 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-summary-card {
  min-height: 118px !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 52px !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px 18px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder :is(
  .s360-quote-summary-card .s360-label,
  .s360-quote-note-card .s360-label,
  .s360-quote-summary-value,
  .s360-quote-input-wrap,
  .s360-quote-summary-card small,
  .s360-quote-recap-card > h3,
  .s360-quote-recap-metric span:not(.s360-quote-recap-icon),
  .s360-quote-recap-metric strong
) {
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
  text-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-card-input {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  background: #ffffff !important;
  border: 1px solid #adc2dc !important;
  border-radius: 9px !important;
  padding: 8px 10px !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-input-wrap {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 18px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-summary-icon,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-recap-icon,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-ready-icon {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 12px !important;
  background: #eaf3ff !important;
  color: #1767ae !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-note-card .s360-textarea {
  background: #ffffff !important;
  border: 1px solid #adc2dc !important;
  color: #102033 !important;
  -webkit-text-fill-color: #102033 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-ready-card {
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
}

@media (max-width: 1280px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-workspace {
    grid-template-columns: 1fr !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-preview-pane {
    position: static !important;
    max-height: none !important;
  }
}

@media (max-width: 760px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder :is(
    .s360-quote-summary-grid,
    .s360-quote-notes-grid,
    .s360-quote-recap-metrics
  ) {
    grid-template-columns: 1fr !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quote-builder .s360-quote-ready-card {
    grid-template-columns: 1fr !important;
  }
}

/* Light Theme V15: sidebar menu readability. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar * {
  word-break: normal !important;
  overflow-wrap: normal !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav {
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 7px !important;
  overflow-x: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-submenu-wrap,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-submenu-wrap.open {
  width: 100% !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  padding-left: 14px !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 40px !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-items: stretch !important;
  column-gap: 10px !important;
  padding: 9px 10px !important;
  text-align: left !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item.s360-sub-item {
  width: 100% !important;
  min-height: 36px !important;
  grid-template-columns: 12px minmax(0, 1fr) auto !important;
  column-gap: 8px !important;
  padding: 8px 10px !important;
  margin: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-icon {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  display: inline-grid !important;
  place-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item.s360-sub-item .s360-nav-icon {
  width: 10px !important;
  min-width: 10px !important;
  max-width: 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-label {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  opacity: 1 !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item.s360-sub-item .s360-nav-label {
  font-size: 12px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-meta {
  min-width: 18px !important;
  max-width: 36px !important;
  display: inline-flex !important;
  justify-content: flex-end !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar .s360-submenu-wrap,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar .s360-submenu-wrap.open {
  display: none !important;
  padding-left: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar .s360-nav-item {
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  grid-template-columns: 1fr !important;
  padding: 0 !important;
  justify-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar .s360-nav-label,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar .s360-nav-meta {
  display: none !important;
}

/* Light Theme V16: rebuild the light mode from the dark layout, with a white palette. */
body #system360-app.s360-theme-light {
  --s360-light-bg: #eef4fb;
  --s360-light-shell: #f7fbff;
  --s360-light-panel: #ffffff;
  --s360-light-panel-soft: #f6faff;
  --s360-light-border: #bdd0e8;
  --s360-light-border-soft: #d6e3f1;
  --s360-light-text: #10243a;
  --s360-light-muted: #58708c;
  --s360-light-accent: #176fc2;
  --s360-light-active: #e6f1ff;
  --s360-light-hover: #f0f7ff;
  --s360-light-shadow: 0 12px 30px rgba(31, 65, 105, .09);
  color-scheme: light !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system {
  color: var(--s360-light-text) !important;
  -webkit-text-fill-color: var(--s360-light-text) !important;
  background:
    radial-gradient(980px 520px at -12% -10%, rgba(23, 111, 194, .12), transparent 60%),
    radial-gradient(900px 560px at 110% -18%, rgba(70, 140, 220, .10), transparent 58%),
    linear-gradient(180deg, #f9fcff 0%, var(--s360-light-bg) 100%) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell {
  width: calc(100vw - 16px) !important;
  height: calc(100dvh - 16px) !important;
  margin: 8px !important;
  padding: 10px !important;
  border: 1px solid var(--s360-light-border) !important;
  border-radius: 18px !important;
  background: rgba(247, 251, 255, .94) !important;
  box-shadow: var(--s360-light-shadow) !important;
  overflow: hidden !important;
}

@media (min-width: 981px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell {
    --s360-left-rail-w: 256px !important;
    display: grid !important;
    grid-template-columns: var(--s360-left-rail-w) minmax(0, 1fr) !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) {
    --s360-left-rail-w: 84px !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell > .s360-topbar.s360-topbar-global {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 2 !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell > .s360-workarea {
    display: contents !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell > .s360-workarea > .s360-sidebar {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 3 !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell > .s360-workarea > .s360-main {
    grid-column: 2 / 3 !important;
    grid-row: 2 / 3 !important;
  }
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar {
  width: 256px !important;
  min-width: 0 !important;
  max-width: 256px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 12px !important;
  border: 1px solid var(--s360-light-border) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 10px 24px rgba(31, 65, 105, .08) !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar {
  width: 84px !important;
  max-width: 84px !important;
  padding: 10px 8px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar-head {
  min-height: 54px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 36px !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 2px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-brand {
  width: 100% !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-brand-logo,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-brand-logo-full {
  max-width: 144px !important;
  max-height: 44px !important;
  object-fit: contain !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-side-toggle {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--s360-light-border) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: var(--s360-light-accent) !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  padding: 2px 2px 4px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-section-label {
  margin: 8px 0 0 !important;
  padding: 4px 8px 2px !important;
  color: var(--s360-light-muted) !important;
  -webkit-text-fill-color: var(--s360-light-muted) !important;
  font-size: 10px !important;
  line-height: 1 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 40px !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) 22px !important;
  align-items: center !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 9px 10px !important;
  border: 1px solid var(--s360-light-border) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .78) !important;
  color: #123b61 !important;
  -webkit-text-fill-color: #123b61 !important;
  text-align: left !important;
  box-shadow: none !important;
  transform: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item:hover {
  background: var(--s360-light-hover) !important;
  border-color: #9bbce1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item.active {
  background: var(--s360-light-active) !important;
  border-color: #7dadde !important;
  color: #0f5eaa !important;
  -webkit-text-fill-color: #0f5eaa !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-icon {
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 22px !important;
  display: grid !important;
  place-items: center !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-label {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  opacity: 1 !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  font-weight: 650 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-meta {
  min-width: 22px !important;
  max-width: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-submenu-wrap,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-submenu-wrap.open {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  padding: 0 0 0 22px !important;
  margin: 0 !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item.s360-sub-item {
  min-height: 38px !important;
  grid-template-columns: 12px minmax(0, 1fr) 0 !important;
  gap: 8px !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item.s360-sub-item .s360-nav-icon {
  width: 10px !important;
  min-width: 10px !important;
  max-width: 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item.s360-sub-item .s360-nav-label {
  font-size: 12px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-nav-item.s360-sub-item .s360-nav-meta {
  display: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar-head {
  grid-template-columns: 1fr !important;
  justify-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) :is(.s360-brand-full, .s360-nav-section-label, .s360-submenu-wrap, .s360-submenu-wrap.open, .s360-nav-label, .s360-nav-meta, .s360-side-user-meta, .s360-side-user-menu-toggle, .s360-side-user-menu) {
  display: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-brand {
  width: 48px !important;
  justify-content: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-brand-short {
  display: inline-flex !important;
  opacity: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav {
  align-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-nav-item {
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  grid-template-columns: 1fr !important;
  padding: 0 !important;
  place-items: center !important;
}

/* Light Theme V17: expanded sidebar must read like the dark theme, without clipped or vertical labels. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed),
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open {
  --s360-sidebar-w: 280px !important;
  grid-template-columns: 280px minmax(0, 1fr) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar {
  width: 280px !important;
  min-width: 280px !important;
  max-width: 280px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-submenu-wrap,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-submenu-wrap,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-submenu-wrap.open,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-submenu-wrap.open {
  padding-left: 14px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-nav-item,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-nav-item {
  min-height: 42px !important;
  height: auto !important;
  align-items: center !important;
  grid-template-columns: 22px minmax(0, 1fr) 22px !important;
  padding: 9px 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-nav-label,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-nav-label {
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-nav-item.s360-sub-item,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-nav-item.s360-sub-item {
  min-height: 40px !important;
  grid-template-columns: 14px minmax(0, 1fr) !important;
  gap: 9px !important;
  padding: 8px 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-nav-item.s360-sub-item .s360-nav-label,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-nav-item.s360-sub-item .s360-nav-label {
  font-size: 12.5px !important;
  line-height: 1.18 !important;
}

@media (max-width: 1024px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed),
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open {
    --s360-sidebar-w: 260px !important;
    grid-template-columns: 260px minmax(0, 1fr) !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar,
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar {
    width: 260px !important;
    min-width: 260px !important;
    max-width: 260px !important;
  }
}

/* Light Theme V18: spacing and containment pass for white mode. */
body #system360-app.s360-theme-light .s360-app.s360-app-system,
body #system360-app.s360-theme-light .s360-app.s360-app-system * {
  box-sizing: border-box !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
  padding: 22px 24px 32px !important;
  overflow-x: hidden !important;
  scroll-padding: 22px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-view,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-dashboard, .s360-home-shell, .s360-home-grid, .s360-panel-grid, .s360-grid, .s360-cards-grid, .s360-module-body) {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-panel,
  .s360-card,
  .s360-box,
  .s360-home-sidebar-card,
  .s360-home-main-column > section,
  .s360-sales-table-wrap,
  .s360-seguimientos-wrap,
  .s360-db360-table-wrap,
  .s360-atc-table-panel,
  .s360-quality-table-panel,
  .s360-alert-center-panel,
  .s360-alert-center-overview,
  .s360-alert-rules-panel,
  .s360-cotizador-card,
  .s360-quote-panel
) {
  min-width: 0 !important;
  max-width: 100% !important;
  padding: max(16px, var(--s360-card-pad, 16px)) !important;
  margin-inline: 0 !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-home-sidebar-card) > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-ok, .s360-error, .s360-alert, .s360-modal-note, .s360-form360-important-note) {
  width: auto !important;
  max-width: calc(100% - 32px) !important;
  min-height: 38px !important;
  margin: 12px 16px !important;
  padding: 10px 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-list, .s360-alert-list, .s360-kpi-list, .s360-home-tab-panel) {
  min-width: 0 !important;
  max-width: 100% !important;
  padding-inline: 4px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row, .s360-kpi-dual-row) {
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 36px !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: minmax(74px, 1fr) minmax(110px, 2.2fr) minmax(44px, max-content) !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 6px 8px !important;
  padding: 8px 10px !important;
  border-radius: 11px !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row span, .s360-progress-label) {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  line-height: 1.25 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row b, .s360-progress-value) {
  min-width: 44px !important;
  max-width: 100% !important;
  justify-self: end !important;
  text-align: right !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-track, .s360-progress, .s360-progress-track, .s360-bar-track) {
  width: 100% !important;
  min-width: 86px !important;
  max-width: 100% !important;
  justify-self: stretch !important;
  margin-inline: 2px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn, .s360-icon-btn, button, .s360-input, .s360-select, .s360-textarea, input, select, textarea) {
  max-width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-btn, button:not(.s360-icon-btn):not(.s360-nav-item)) {
  min-height: 36px !important;
  padding-inline: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  white-space: normal !important;
  text-align: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea) {
  min-height: 38px !important;
  padding-inline: 12px !important;
  line-height: 1.35 !important;
}

@media (max-width: 760px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
    padding: 16px 14px 24px !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-ok, .s360-error, .s360-alert, .s360-modal-note, .s360-form360-important-note) {
    max-width: calc(100% - 16px) !important;
    margin: 10px 8px !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row, .s360-kpi-dual-row) {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 7px !important;
    margin-inline: 0 !important;
    padding: 10px !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-chart-row b, .s360-progress-value) {
    justify-self: start !important;
    text-align: left !important;
  }
}

/* Light Theme V19: restore collapsible submenu behavior in white mode. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-submenu-wrap:not(.open) {
  display: none !important;
  max-height: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-left-width: 0 !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-submenu-wrap.open {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  max-height: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  margin: 0 !important;
  padding: 0 0 0 14px !important;
  border-left-width: 0 !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar .s360-submenu-wrap,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar .s360-submenu-wrap.open {
  display: none !important;
}

/* Light Theme V20: nested submenu controls, calendar numerals and centered shell. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell {
  width: min(1880px, calc(100vw - 48px)) !important;
  max-width: calc(100vw - 48px) !important;
  height: calc(100dvh - 24px) !important;
  margin: 12px auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-main {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
  padding-left: 24px !important;
  padding-right: 30px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-nav-item:is(#s360-nav-mesa-atc, #s360-nav-mesa-quality),
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-nav-item:is(#s360-nav-mesa-atc, #s360-nav-mesa-quality) {
  grid-template-columns: 14px minmax(0, 1fr) 22px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item:is(#s360-nav-mesa-atc, #s360-nav-mesa-quality) .s360-nav-meta {
  min-width: 22px !important;
  max-width: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item:is(#s360-nav-mesa-atc, #s360-nav-mesa-quality) .s360-chevron {
  width: 18px !important;
  height: 18px !important;
  display: inline-grid !important;
  place-items: center !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day:not(.is-empty) .s360-home-cal-num {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 16px !important;
  min-height: 16px !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #123b61 !important;
  -webkit-text-fill-color: #123b61 !important;
  font-size: 12.5px !important;
  line-height: 1 !important;
  font-weight: 750 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-selected .s360-home-cal-num {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-empty .s360-home-cal-num,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-empty .s360-home-cal-meta {
  display: none !important;
}

@media (max-width: 760px) {
  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    height: calc(100dvh - 16px) !important;
    margin: 8px auto !important;
  }

  body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll {
    padding-left: 14px !important;
    padding-right: 18px !important;
  }
}

/* Light Theme V21: keep calendar day numbers on one line. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-grid {
  grid-template-columns: repeat(7, minmax(30px, 1fr)) !important;
  gap: 6px !important;
  align-items: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day {
  min-width: 30px !important;
  min-height: 34px !important;
  padding: 4px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  text-align: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day:not(.is-empty) .s360-home-cal-num {
  width: auto !important;
  min-width: 2ch !important;
  max-width: none !important;
  inline-size: max-content !important;
  display: block !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
}

/* Light Theme V22: exact dark-calendar geometry for white mode. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card {
  --s360-light-cal-cell: clamp(34px, calc((100% - 42px) / 7), 40px);
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-weekdays,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-grid {
  display: grid !important;
  grid-template-columns: repeat(7, var(--s360-light-cal-cell)) !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-weekdays > span {
  width: var(--s360-light-cal-cell) !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day {
  width: var(--s360-light-cal-cell) !important;
  min-width: var(--s360-light-cal-cell) !important;
  max-width: var(--s360-light-cal-cell) !important;
  height: var(--s360-light-cal-cell) !important;
  min-height: var(--s360-light-cal-cell) !important;
  max-height: var(--s360-light-cal-cell) !important;
  aspect-ratio: 1 / 1 !important;
  padding: 4px 3px !important;
  display: grid !important;
  grid-template-rows: minmax(14px, auto) minmax(0, 1fr) !important;
  place-items: center !important;
  align-content: center !important;
  justify-content: center !important;
  gap: 1px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day .s360-home-cal-num {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 15px !important;
  min-height: 15px !important;
  display: block !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  overflow: hidden !important;
  text-overflow: clip !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day .s360-home-cal-num::before {
  content: attr(data-day-num) !important;
  display: inline-block !important;
  min-width: 2ch !important;
  font-size: 14px !important;
  line-height: 15px !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  color: #123b61 !important;
  -webkit-text-fill-color: #123b61 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-selected .s360-home-cal-num::before {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-meta {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 13px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
}

/* Light Theme V23: hard reset calendar numbers after pseudo-render fix. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card {
  --s360-light-cal-cell: 35px;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-weekdays,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-grid {
  display: grid !important;
  grid-template-columns: repeat(7, var(--s360-light-cal-cell)) !important;
  justify-content: space-between !important;
  gap: 6px !important;
  width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day:not(.is-empty) {
  position: relative !important;
  width: var(--s360-light-cal-cell) !important;
  min-width: var(--s360-light-cal-cell) !important;
  max-width: var(--s360-light-cal-cell) !important;
  height: var(--s360-light-cal-cell) !important;
  min-height: var(--s360-light-cal-cell) !important;
  max-height: var(--s360-light-cal-cell) !important;
  aspect-ratio: auto !important;
  display: block !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day:not(.is-empty) .s360-home-cal-num,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day .s360-home-cal-num {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  max-height: 100% !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day:not(.is-empty) .s360-home-cal-num::before,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day .s360-home-cal-num::before {
  content: attr(data-day-num) !important;
  display: block !important;
  width: auto !important;
  min-width: 2ch !important;
  font-size: 15px !important;
  line-height: 1 !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  color: #123b61 !important;
  -webkit-text-fill-color: #123b61 !important;
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-day.is-selected .s360-home-cal-num::before {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-meta {
  position: absolute !important;
  left: 2px !important;
  right: 2px !important;
  bottom: 2px !important;
  width: auto !important;
  height: 11px !important;
  min-height: 11px !important;
  display: grid !important;
  place-items: center !important;
  pointer-events: none !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-home-calendar-card .s360-home-cal-meta:empty {
  display: none !important;
}

/* Light Theme V24: match dark sidebar header proportions. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  min-height: 58px !important;
  height: 58px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 24px !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 8px 8px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand {
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand-full,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand-short {
  height: 44px !important;
  min-height: 44px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand-logo,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 135px !important;
  min-width: 135px !important;
  max-width: 135px !important;
  height: auto !important;
  max-height: 42px !important;
  object-fit: contain !important;
  object-position: left center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand-logo-short {
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: auto !important;
  max-height: 34px !important;
  object-fit: contain !important;
  object-position: center center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  border-radius: 7px !important;
  display: inline-grid !important;
  place-items: center !important;
  justify-self: end !important;
  align-self: center !important;
  margin: 0 !important;
  line-height: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-side-toggle .s360-toggle-icon-stack {
  width: 10px !important;
  height: 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-side-toggle :is(.s360-svg-icon, svg) {
  width: 8px !important;
  height: 8px !important;
  stroke-width: 2.2 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  height: 96px !important;
  min-height: 96px !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: 44px 24px !important;
  justify-items: center !important;
  align-content: start !important;
  gap: 12px !important;
  padding: 8px 4px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand {
  width: 52px !important;
  height: 44px !important;
  min-height: 44px !important;
  justify-content: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand-short {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  width: 52px !important;
  height: 44px !important;
  justify-content: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand-logo-short {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  justify-self: center !important;
}

/* Light Theme V25: use visible dark-logo proportions in the white sidebar. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  height: 62px !important;
  min-height: 62px !important;
  grid-template-columns: minmax(0, 1fr) 24px !important;
  padding: 8px 10px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand {
  height: 46px !important;
  min-height: 46px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  width: 150px !important;
  min-width: 150px !important;
  max-width: 150px !important;
  height: 46px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand-logo,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 132px !important;
  min-width: 132px !important;
  max-width: 132px !important;
  height: auto !important;
  max-height: 46px !important;
  display: block !important;
  object-fit: contain !important;
  object-position: left center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  border-radius: 7px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  height: 88px !important;
  min-height: 88px !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: 38px 24px !important;
  gap: 10px !important;
  padding: 8px 0 !important;
  justify-items: center !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand {
  width: 58px !important;
  min-width: 58px !important;
  max-width: 58px !important;
  height: 38px !important;
  min-height: 38px !important;
  justify-content: center !important;
  overflow: hidden !important;
  margin: 0 auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand-short {
  width: 58px !important;
  min-width: 58px !important;
  max-width: 58px !important;
  height: 38px !important;
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  margin: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand-logo-short {
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  height: auto !important;
  max-height: 30px !important;
  display: block !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-side-toggle {
  margin: 0 auto !important;
  justify-self: center !important;
  align-self: center !important;
}

/* Light Theme V26: force readable expanded sidebar logo. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-sidebar-head,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  height: 72px !important;
  min-height: 72px !important;
  grid-template-columns: 170px 24px !important;
  gap: 10px !important;
  padding: 8px 10px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-brand,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand-full,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  width: 170px !important;
  min-width: 170px !important;
  max-width: 170px !important;
  height: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: visible !important;
  transform: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium img.s360-brand-logo.s360-brand-logo-full,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium img.s360-brand-logo.s360-brand-logo-full {
  display: block !important;
  width: 154px !important;
  min-width: 154px !important;
  max-width: 154px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: 56px !important;
  object-fit: contain !important;
  object-position: left center !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Light Theme V27: readable desktop tables in white mode. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-table-panel, .s360-atc-table-panel, .s360-sales-panel, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-sales-table-wrap, .s360-db360-table-wrap, .s360-atcdb-table-wrap) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: block !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
  border: 1px solid #b9cdec !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), 0 10px 24px rgba(30, 68, 112, .08) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-sales-table-wrap, .s360-db360-table-wrap, .s360-atcdb-table-wrap) > :is(table, .s360-table, .s360-table-sales, .s360-table-follow, .s360-db360-table, .s360-atc-indexed-table) {
  width: max-content !important;
  min-width: max(100%, 1480px) !important;
  max-width: none !important;
  table-layout: auto !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #ffffff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-atc-horizontal-wrap, .s360-quality-table-panel) > .s360-atc-indexed-table,
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-atc-horizontal-wrap, .s360-quality-table-panel) table.s360-atc-indexed-table,
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-validation-table {
  min-width: 2380px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-sales-table-wrap, .s360-db360-table-wrap, .s360-atcdb-table-wrap) :is(thead, tbody, tr) {
  width: auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-sales-table-wrap, .s360-db360-table-wrap, .s360-atcdb-table-wrap) :is(th, td) {
  width: auto !important;
  min-width: 92px !important;
  max-width: 220px !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 12px 14px !important;
  vertical-align: top !important;
  text-align: left !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  line-break: auto !important;
  hyphens: none !important;
  line-height: 1.32 !important;
  color: #10243a !important;
  -webkit-text-fill-color: #10243a !important;
  border-color: #cfe0f2 !important;
  background-clip: padding-box !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-sales-table-wrap, .s360-db360-table-wrap, .s360-atcdb-table-wrap) thead :is(th, td) {
  min-width: 108px !important;
  max-width: 220px !important;
  height: auto !important;
  min-height: 54px !important;
  padding: 12px 38px 12px 14px !important;
  vertical-align: middle !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.28 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  background: #e9f2fb !important;
  color: #173a5d !important;
  -webkit-text-fill-color: #173a5d !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-sales-table-wrap, .s360-db360-table-wrap, .s360-atcdb-table-wrap) tbody td {
  background: #ffffff !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-sales-table-wrap, .s360-db360-table-wrap, .s360-atcdb-table-wrap) tbody tr:nth-child(even) td {
  background: #f8fbff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-sales-table-wrap, .s360-db360-table-wrap, .s360-atcdb-table-wrap) tbody tr:hover td {
  background: #eef6ff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-indexed-table :is(th:first-child, td:first-child),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-validation-table :is(th:first-child, td:first-child) {
  min-width: 48px !important;
  max-width: 58px !important;
  width: 52px !important;
  text-align: center !important;
  white-space: nowrap !important;
  background: #f2f7ff !important;
  box-shadow: none !important;
  border-left: 0 !important;
  color: #0f2a44 !important;
  -webkit-text-fill-color: #0f2a44 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-indexed-table :is(th:nth-child(2), td:nth-child(2)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-validation-table :is(th:nth-child(2), td:nth-child(2)) {
  min-width: 126px !important;
  max-width: 150px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-indexed-table :is(th:nth-child(3), td:nth-child(3)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-validation-table :is(th:nth-child(3), td:nth-child(3)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-indexed-table :is(th:nth-child(10), td:nth-child(10)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-validation-table :is(th:nth-child(10), td:nth-child(10)) {
  min-width: 150px !important;
  max-width: 190px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-indexed-table :is(th:nth-child(5), td:nth-child(5)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-validation-table :is(th:nth-child(5), td:nth-child(5)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-indexed-table :is(th:nth-child(11), td:nth-child(11)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-validation-table :is(th:nth-child(11), td:nth-child(11)) {
  min-width: 180px !important;
  max-width: 240px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-indexed-table :is(th:nth-child(8), td:nth-child(8)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-validation-table :is(th:nth-child(8), td:nth-child(8)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-indexed-table :is(th:nth-child(9), td:nth-child(9)),
body #system360-app.s360-theme-light .s360-app.s360-app-system table.s360-atc-validation-table :is(th:nth-child(9), td:nth-child(9)) {
  min-width: 132px !important;
  max-width: 180px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap) :is(th button, td button, th .s360-icon-btn, td .s360-icon-btn) {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap) :is(.s360-pill, .s360-badge, .s360-tag, .s360-chip, .s360-status-pill) {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap)::-webkit-scrollbar {
  height: 12px !important;
  width: 12px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap)::-webkit-scrollbar-track {
  background: #e9f2fb !important;
  border-radius: 999px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap)::-webkit-scrollbar-thumb {
  background: #93aed0 !important;
  border-radius: 999px !important;
  border: 3px solid #e9f2fb !important;
}

/* Light Theme V28: clone dark table geometry with a light palette. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap {
  border-radius: 8px !important;
  border: 1px solid #9db9dc !important;
  background: #eaf3fc !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 10px 24px rgba(30, 68, 112, .08) !important;
  padding: 0 !important;
  margin-top: 12px !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  scrollbar-color: #92afd2 #e1edf8 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap > :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table, table) {
  width: max-content !important;
  min-width: max(100%, 1900px) !important;
  max-width: none !important;
  table-layout: auto !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: transparent !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap :is(th, td) {
  box-sizing: border-box !important;
  min-width: 112px !important;
  max-width: none !important;
  width: auto !important;
  height: auto !important;
  padding: 13px 14px !important;
  vertical-align: middle !important;
  text-align: left !important;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  line-break: auto !important;
  hyphens: none !important;
  line-height: 1.35 !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  border-color: #bdd0e8 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 3 !important;
  min-height: 0 !important;
  padding: 14px 46px 14px 14px !important;
  background: #e7f1fb !important;
  color: #173a5d !important;
  -webkit-text-fill-color: #173a5d !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  border-bottom: 1px solid #a8c0df !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap tbody td {
  background: #f7fbff !important;
  color: #10243a !important;
  -webkit-text-fill-color: #10243a !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  border-bottom: 1px solid #d5e4f3 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap tbody tr:hover td {
  background: #eef6ff !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) .s360-seguimientos-wrap :is(.s360-atc-indexed-table th:first-child, .s360-atc-indexed-table td:first-child) {
  min-width: 54px !important;
  width: 54px !important;
  max-width: 54px !important;
  text-align: center !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
  color: #315b87 !important;
  -webkit-text-fill-color: #315b87 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap :is(.s360-pill, .s360-badge, .s360-tag, .s360-chip, .s360-status-pill, button, .s360-btn, .s360-icon-btn) {
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

/* Light Theme V29: prevent inner table content from wrapping into stacked columns. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap > :is(table, .s360-table, .s360-table-follow, .s360-table-sales, .s360-atcdb-table, .s360-atc-indexed-table) {
  min-width: max(100%, 2600px) !important;
  width: max-content !important;
  table-layout: auto !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap :is(th, td),
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap :is(th, td) * {
  max-width: none !important;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  text-overflow: clip !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap thead th {
  min-width: 130px !important;
  height: 56px !important;
  max-height: 56px !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board,
  .s360-follow-panel,
  .s360-sales-panel
) .s360-seguimientos-wrap tbody td {
  min-width: 130px !important;
  height: 66px !important;
  max-height: 72px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) .s360-seguimientos-wrap table.s360-atc-indexed-table :is(th:first-child, td:first-child) {
  min-width: 56px !important;
  width: 56px !important;
  max-width: 56px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(
  .s360-bases-panel,
  .s360-atcdb-shell,
  .s360-atc-shell,
  .s360-quality-shell,
  .s360-cobranza-shell,
  .s360-backoffice-board
) .s360-seguimientos-wrap table.s360-atc-indexed-table :is(th:nth-child(4), td:nth-child(4), th:nth-child(8), td:nth-child(8), th:nth-child(10), td:nth-child(10), th:nth-child(11), td:nth-child(11)) {
  min-width: 180px !important;
}

/* Light Theme V30: quality tables keep dark-mode horizontal geometry. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell .s360-atc-horizontal-wrap {
  overflow-x: auto !important;
  overflow-y: visible !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 10px 12px 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell .s360-atc-horizontal-wrap > table.s360-atc-validation-table {
  width: max-content !important;
  min-width: max-content !important;
  table-layout: auto !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td),
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td) * {
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  max-width: none !important;
  text-overflow: clip !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table thead th,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table tbody td {
  width: auto !important;
  min-width: max-content !important;
  height: 70px !important;
  max-height: none !important;
  padding: 14px 18px !important;
  vertical-align: middle !important;
  overflow: visible !important;
  line-height: 1.25 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table thead th {
  height: 58px !important;
  padding-right: 44px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="_index"] {
  min-width: 56px !important;
  width: 56px !important;
  max-width: 56px !important;
  text-align: center !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="mes"] {
  min-width: 170px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="venta"] {
  min-width: 175px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="fecha"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="fecha_documentos"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="actualizacion"] {
  min-width: 220px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="dias_etapa"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="edad"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="dependientes"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="periodisidad"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="status_venta"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="requiere_factura"] {
  min-width: 160px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="siguiente_accion"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="correo"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="comentarios"] {
  min-width: 280px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="supervisor"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="asesor"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="cliente"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="responsable"] {
  min-width: 260px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="cliente"] {
  min-width: 340px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="telefono"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="tipo_servicio"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="suma_asegurada"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="monto_pagado"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="preexistencias"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="hoja_fiscal"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="regimen_fiscal"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="estado"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="tiempo_progreso"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="sla"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="prioridad"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="alerta"] {
  min-width: 180px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="acciones"],
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell table.s360-atc-validation-table :is(th, td)[data-quality-col="llamada"] {
  min-width: 220px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-quality-shell .s360-quality-cell-text {
  display: inline-block !important;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  max-width: none !important;
}

/* Light Theme V31: align table icons and remove dark control leftovers. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) :is(.s360-btn, .s360-icon-btn, .s360-atc-icon-btn, .s360-atcdb-pager-btn, button:not(.s360-nav-item):not(.s360-theme-switch)) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  vertical-align: middle !important;
  line-height: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) :is(.s360-btn, .s360-icon-btn, .s360-atc-icon-btn, .s360-atcdb-pager-btn, button:not(.s360-nav-item):not(.s360-theme-switch)) :is(svg, .s360-svg-icon, .material-symbols-rounded) {
  display: block !important;
  flex: 0 0 auto !important;
  width: 16px !important;
  height: 16px !important;
  line-height: 1 !important;
  margin: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) :is(td, th) :is(.s360-db360-cell-icon, .s360-sales-cell-icon, .s360-icon-cell, .s360-cell-icon, .s360-quality-call-mini i) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  margin: 0 10px 0 0 !important;
  border-radius: 999px !important;
  vertical-align: middle !important;
  line-height: 1 !important;
  background: linear-gradient(180deg, #dcecff, #c7e0ff) !important;
  border: 1px solid rgba(100, 157, 230, 0.38) !important;
  color: #0f66c7 !important;
  -webkit-text-fill-color: #0f66c7 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 6px 14px rgba(52,105,166,.14) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) :is(td, th) :is(.s360-db360-cell-icon, .s360-sales-cell-icon, .s360-icon-cell, .s360-cell-icon, .s360-quality-call-mini i) :is(svg, .s360-svg-icon, .material-symbols-rounded) {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  line-height: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) :is(table td, table th):has(.s360-db360-cell-icon, .s360-sales-cell-icon, .s360-icon-cell, .s360-cell-icon) {
  vertical-align: middle !important;
  white-space: nowrap !important;
  line-height: 1.25 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) :is(table td, table th):has(.s360-db360-cell-icon, .s360-sales-cell-icon, .s360-icon-cell, .s360-cell-icon) > :not(.s360-db360-cell-icon):not(.s360-sales-cell-icon):not(.s360-icon-cell):not(.s360-cell-icon) {
  vertical-align: middle !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) :is(.s360-atc-action-row, td .s360-flex, .s360-quality-call-mini) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
  vertical-align: middle !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) :is(td .s360-btn.small, td .s360-btn.sec.small, td .s360-btn.danger.small, .s360-atc-icon-btn) {
  min-width: 38px !important;
  min-height: 38px !important;
  height: 38px !important;
  padding: 0 12px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(154, 187, 226, .82) !important;
  background: linear-gradient(180deg, #ffffff, #eef6ff) !important;
  color: #123f68 !important;
  -webkit-text-fill-color: #123f68 !important;
  box-shadow: 0 7px 16px rgba(48, 88, 132, .10), inset 0 1px 0 rgba(255,255,255,.95) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-view-switch {
  display: inline-grid !important;
  grid-template-columns: repeat(2, minmax(108px, 1fr)) !important;
  align-items: center !important;
  gap: 0 !important;
  height: 44px !important;
  padding: 3px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(135, 171, 218, .82) !important;
  background: #f8fbff !important;
  box-shadow: inset 0 1px 2px rgba(45, 78, 116, .08), 0 8px 18px rgba(45, 74, 112, .08) !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-view-switch button {
  width: 100% !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #274865 !important;
  -webkit-text-fill-color: #274865 !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  line-height: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-view-switch button.active {
  background: linear-gradient(180deg, #ffffff, #eaf4ff) !important;
  color: #0f3f6a !important;
  -webkit-text-fill-color: #0f3f6a !important;
  box-shadow: 0 5px 14px rgba(46, 96, 154, .14), inset 0 0 0 1px rgba(96, 145, 210, .5) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-atcdb-pager {
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
  margin-top: 18px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-atcdb-pager-center {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 40px !important;
  padding: 6px 12px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(143, 174, 214, .78) !important;
  background: linear-gradient(180deg, #ffffff, #eef6ff) !important;
  color: #173c60 !important;
  -webkit-text-fill-color: #173c60 !important;
  box-shadow: 0 8px 18px rgba(45, 74, 112, .10), inset 0 1px 0 rgba(255,255,255,.96) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-atcdb-page-pill {
  min-width: 112px !important;
  height: 26px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(130, 166, 212, .68) !important;
  background: #f7fbff !important;
  color: #17496f !important;
  -webkit-text-fill-color: #17496f !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.96) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-atcdb-page-meta {
  color: #5c7895 !important;
  -webkit-text-fill-color: #5c7895 !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-atcdb-pager-btn {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  border: 1px solid rgba(151, 184, 225, .86) !important;
  background: linear-gradient(180deg, #ffffff, #eef6ff) !important;
  color: #275d8c !important;
  -webkit-text-fill-color: #275d8c !important;
  box-shadow: 0 7px 16px rgba(45, 74, 112, .10), inset 0 1px 0 rgba(255,255,255,.96) !important;
}

/* Light Theme V32: align toolbar controls to the same baseline. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-toolbar-main {
  align-items: start !important;
  gap: 18px 28px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-toolbar-main > .s360-db360-field {
  display: grid !important;
  grid-template-rows: 16px 44px !important;
  align-self: start !important;
  gap: 8px !important;
  height: 68px !important;
  margin: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-toolbar-main > .s360-db360-field > span:first-child {
  display: flex !important;
  align-items: center !important;
  height: 16px !important;
  min-height: 16px !important;
  margin: 0 !important;
  line-height: 1 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-toolbar-main :is(.s360-input, .s360-select, .s360-db360-input-icon, .s360-db360-view-switch) {
  height: 44px !important;
  min-height: 44px !important;
  align-self: end !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-toolbar-main .s360-db360-view-switch button {
  height: 38px !important;
  min-height: 38px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-toolbar-main .s360-db360-actions {
  align-self: start !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 18px !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-toolbar-main .s360-db360-actions .s360-btn {
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  align-self: center !important;
}

/* Light Theme V33: keep search icon clear of placeholder text. */
body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-search-field .s360-db360-input-icon {
  position: relative !important;
  display: block !important;
  width: 100% !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-search-field .s360-db360-input-icon .s360-svg-icon {
  position: absolute !important;
  left: 18px !important;
  top: 50% !important;
  width: 16px !important;
  height: 16px !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell) .s360-db360-search-field .s360-db360-input-icon .s360-input {
  box-sizing: border-box !important;
  width: 100% !important;
  padding-left: 50px !important;
}

/* Light Theme V34: keep sidebar badges and chevrons visible. */
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar .s360-nav-item,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar .s360-nav-item {
  grid-template-columns: 22px minmax(0, 1fr) minmax(48px, auto) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-nav-meta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 7px !important;
  min-width: 48px !important;
  max-width: none !important;
  height: 24px !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
  color: #144f80 !important;
  -webkit-text-fill-color: #144f80 !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-nav-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  min-width: 22px !important;
  height: 22px !important;
  padding: 0 6px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(126, 104, 255, .42) !important;
  background: linear-gradient(135deg, #7765ff, #9c65ff) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  letter-spacing: 0 !important;
  box-shadow: 0 4px 10px rgba(106, 88, 230, .26), inset 0 1px 0 rgba(255,255,255,.35) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-chevron {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #155d91 !important;
  -webkit-text-fill-color: #155d91 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-chevron .s360-svg-icon {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  color: inherit !important;
  stroke: currentColor !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-chevron.open {
  transform: rotate(90deg) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-sidebar .s360-nav-item .s360-nav-meta:empty {
  min-width: 0 !important;
  width: 0 !important;
}

/* Sidebar logo size tuning: keep both themes balanced in expanded and collapsed states. */
body #system360-app.s360-theme-dark .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full,
body #system360-app.s360-theme-dark .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 112px !important;
  min-width: 112px !important;
  max-width: 112px !important;
}

body #system360-app.s360-theme-dark .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand-full,
body #system360-app.s360-theme-dark .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  max-width: 112px !important;
}

body #system360-app.s360-theme-dark .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-sidebar-head {
  min-height: 58px !important;
}

body #system360-app.s360-theme-dark .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand {
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  min-height: 46px !important;
  max-width: 46px !important;
}

body #system360-app.s360-theme-dark .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  max-width: 46px !important;
}

body #system360-app.s360-theme-dark .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand-logo-full {
  width: 46px !important;
  min-width: 46px !important;
  max-width: 46px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-brand,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium .s360-brand-full,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium .s360-brand-full {
  width: 154px !important;
  min-width: 154px !important;
  max-width: 154px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell:not(.collapsed) .s360-sidebar.s360-sidebar-premium img.s360-brand-logo.s360-brand-logo-full,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.is-sidebar-hover-open .s360-sidebar.s360-sidebar-premium img.s360-brand-logo.s360-brand-logo-full {
  width: 140px !important;
  min-width: 140px !important;
  max-width: 140px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand,
body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand-short {
  width: 50px !important;
  min-width: 50px !important;
  max-width: 50px !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system .s360-shell.collapsed:not(.is-sidebar-hover-open) .s360-sidebar.s360-sidebar-premium .s360-brand-logo-short {
  width: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
}

/* System Visual Polish V35: containment, table wrapping, and flatter panels. */
#system360-app .s360-app.s360-app-system,
#system360-app .s360-app.s360-app-system * {
  box-sizing: border-box !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-main, .s360-content-scroll, .s360-panel, .s360-card, .s360-box, .s360-section, .s360-form-section, .s360-config-section, .s360-toolbar, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters, .s360-grid, .s360-grid-admin, .s360-grid-2, .s360-grid-3, .s360-flex) {
  min-width: 0 !important;
  max-width: 100% !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll {
  width: 100% !important;
  padding: clamp(16px, 2vw, 28px) !important;
  overflow-x: hidden !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll > :is(section, article, div) {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-config-section, .s360-form-section) {
  border-radius: 14px !important;
  overflow: hidden !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-config-section, .s360-form-section) {
  background: rgba(11, 22, 38, .76) !important;
  border-color: rgba(91, 125, 181, .42) !important;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255,255,255,.03) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-config-section, .s360-form-section) {
  background: rgba(255, 255, 255, .84) !important;
  border-color: rgba(143, 174, 214, .46) !important;
  box-shadow: 0 14px 34px rgba(36, 72, 114, .09), inset 0 1px 0 rgba(255,255,255,.85) !important;
}

#system360-app .s360-app.s360-app-system .s360-panel > .s360-panel {
  margin: 18px 0 0 !important;
  padding: 18px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(126, 157, 205, .24) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-panel > .s360-panel:first-of-type {
  margin-top: 16px !important;
  border-top: 0 !important;
  padding-top: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-panel > .s360-panel > h3 {
  margin: 0 0 12px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel h1, .s360-panel h2, .s360-panel h3, .s360-panel h4, .s360-card h1, .s360-card h2, .s360-card h3, .s360-card h4, .s360-muted, p, label, span, strong, small, a, button) {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel h3, .s360-card h3, .s360-panel-headline h3) {
  white-space: normal !important;
  text-overflow: clip !important;
  line-height: 1.22 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input, select, textarea) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-grid, .s360-grid-admin, .s360-grid-2, .s360-grid-3) {
  gap: 16px !important;
}

#system360-app .s360-app.s360-app-system .s360-grid-admin {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-switch, .s360-label) {
  min-width: 0 !important;
  line-height: 1.35 !important;
}

#system360-app .s360-app.s360-app-system .s360-switch {
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 4px 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-switch span {
  white-space: normal !important;
}

#system360-app .s360-app.s360-app-system .s360-folder-tabs {
  position: static !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 16px 0 0 !important;
  padding: 0 !important;
  transform: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-folder-tab {
  flex: 1 1 190px !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 10px 14px !important;
  border-radius: 12px !important;
  white-space: normal !important;
  line-height: 1.18 !important;
  transform: none !important;
}

#system360-app .s360-app.s360-app-system .s360-config-shell + .s360-panel,
#system360-app .s360-app.s360-app-system .s360-config-shell + section,
#system360-app .s360-app.s360-app-system .s360-config-shell + div {
  margin-top: 16px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-toolbar, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters, .s360-agenda-toolbar, .s360-flex) {
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-db360-field, .s360-filter-field, .s360-toolbar-field) {
  min-width: min(100%, 180px) !important;
  max-width: 100% !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-btn, button) {
  max-width: 100% !important;
  min-width: 0 !important;
  white-space: normal !important;
  line-height: 1.18 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) {
  width: 100% !important;
  max-width: 100% !important;
  margin: 16px 0 0 !important;
  padding: 0 !important;
  border-radius: 14px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain !important;
  -webkit-overflow-scrolling: touch !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) {
  border: 1px solid rgba(91, 125, 181, .46) !important;
  background: rgba(5, 13, 27, .42) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) {
  border: 1px solid rgba(136, 170, 214, .55) !important;
  background: rgba(255,255,255,.72) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) > :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) {
  min-width: 920px !important;
  max-width: none !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th, td) {
  min-width: 0 !important;
  max-width: 280px !important;
  padding: 14px 12px !important;
  vertical-align: middle !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  line-height: 1.32 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th, td) > * {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th, td) :is(.s360-pill, .s360-btn, button) {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 2 !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) thead th {
  background: rgba(10, 21, 39, .96) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) thead th {
  background: rgba(244, 249, 255, .96) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap)::-webkit-scrollbar {
  height: 10px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap)::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: rgba(126, 157, 205, .72) !important;
  border: 2px solid transparent !important;
  background-clip: content-box !important;
}

@media (max-width: 900px) {
  #system360-app .s360-app.s360-app-system .s360-content-scroll {
    padding: 14px !important;
  }

  #system360-app .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box) {
    padding: 16px !important;
    border-radius: 12px !important;
  }

  #system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) > :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) {
    min-width: 760px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-folder-tab {
    flex-basis: min(100%, 220px) !important;
  }
}

/* System Visual Polish V36: flat workspace and readable tables. */
#system360-app .s360-app.s360-app-system .s360-content-scroll > .s360-panel,
#system360-app .s360-app.s360-app-system .s360-content-scroll > section.s360-panel,
#system360-app .s360-app.s360-app-system .s360-content-scroll > article.s360-panel {
  padding: 22px !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll > .s360-panel + .s360-panel,
#system360-app .s360-app.s360-app-system .s360-content-scroll > section + section,
#system360-app .s360-app.s360-app-system .s360-content-scroll > div + section,
#system360-app .s360-app.s360-app-system .s360-content-scroll > section + div {
  margin-top: 18px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box) :is(.s360-panel, .s360-card, .s360-box):not(.s360-kpi-card):not(.s360-home-sidebar-card):not(.s360-component-card) {
  padding: 16px 0 0 !important;
  margin: 16px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(126, 157, 205, .22) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box) :is(.s360-panel, .s360-card, .s360-box):not(.s360-kpi-card):not(.s360-home-sidebar-card):not(.s360-component-card):first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) {
  max-height: none !important;
  overflow-y: visible !important;
  border-radius: 12px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) > :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) {
  min-width: 1120px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th, td) {
  max-width: none !important;
  min-height: 56px !important;
  height: auto !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th, td) > :is(div, span, strong, small, a, button, label) {
  overflow: visible !important;
  text-overflow: clip !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(.s360-pill, .s360-status-pill) {
  max-width: none !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.15 !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(3), td:nth-child(3)),
#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(4), td:nth-child(4)),
#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(7), td:nth-child(7)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(3), td:nth-child(3)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(4), td:nth-child(4)) {
  width: 190px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(5), td:nth-child(5)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(5), td:nth-child(5)) {
  width: 260px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(8), td:nth-child(8)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(8), td:nth-child(8)) {
  width: 170px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-toolbar, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters) {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-db360-actions {
  margin-left: auto !important;
}

@media (max-width: 900px) {
  #system360-app .s360-app.s360-app-system .s360-content-scroll > .s360-panel,
  #system360-app .s360-app.s360-app-system .s360-content-scroll > section.s360-panel,
  #system360-app .s360-app.s360-app-system .s360-content-scroll > article.s360-panel {
    padding: 16px !important;
  }

  #system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) > :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) {
    min-width: 900px !important;
  }
}

/* System Visual Polish V37: Apple-clean surface and table no-cut fix. */
#system360-app .s360-app.s360-app-system {
  --s360-surface: rgba(9, 18, 32, .72);
  --s360-surface-soft: rgba(255,255,255,.045);
  --s360-line-soft: rgba(132, 164, 212, .22);
  --s360-line-strong: rgba(132, 164, 212, .36);
}

#system360-app.s360-theme-light .s360-app.s360-app-system {
  --s360-surface: rgba(255,255,255,.82);
  --s360-surface-soft: rgba(245,249,255,.72);
  --s360-line-soft: rgba(128, 163, 205, .20);
  --s360-line-strong: rgba(128, 163, 205, .34);
}

#system360-app .s360-app.s360-app-system .s360-content-scroll {
  padding: 22px !important;
  gap: 18px !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll > :is(.s360-panel, section.s360-panel, article.s360-panel, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-quote-builder) {
  padding: 22px !important;
  border: 1px solid var(--s360-line-strong) !important;
  border-radius: 18px !important;
  background: var(--s360-surface) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.05) !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll > :is(.s360-panel, section.s360-panel, article.s360-panel, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-quote-builder) > :is(.s360-panel, .s360-card, .s360-box, .s360-section, .s360-config-section, .s360-form-section):not(.s360-kpi-card):not(.s360-component-card):not(.s360-home-sidebar-card) {
  padding: 18px 0 0 !important;
  margin: 18px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--s360-line-soft) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll > :is(.s360-panel, section.s360-panel, article.s360-panel, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-quote-builder) > :is(.s360-panel, .s360-card, .s360-box, .s360-section, .s360-config-section, .s360-form-section):not(.s360-kpi-card):not(.s360-component-card):not(.s360-home-sidebar-card):first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-toolbar, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters, .s360-agenda-toolbar, .s360-filters) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 14px !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 14px 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-db360-field, .s360-filter-field, .s360-toolbar-field),
#system360-app .s360-app.s360-app-system :is(.s360-toolbar, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters, .s360-agenda-toolbar, .s360-filters) > * {
  flex: 0 1 auto !important;
  min-width: min(100%, 170px) !important;
  max-width: 100% !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-db360-search-field, .s360-search-field) {
  flex: 1 1 280px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-db360-actions, .s360-toolbar-actions, .s360-actions) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  justify-content: flex-end !important;
  margin-left: auto !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  height: auto !important;
  margin: 16px 0 0 !important;
  padding: 0 !important;
  border: 1px solid var(--s360-line-strong) !important;
  border-radius: 16px !important;
  background: var(--s360-surface-soft) !important;
  box-shadow: none !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scrollbar-gutter: stable !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-quality-table-panel, .s360-atc-table-panel) > :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-table-wrap, .s360-db360-table-wrap) {
  margin-top: 0 !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: transparent !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) {
  display: table !important;
  width: max(100%, 1180px) !important;
  min-width: 1180px !important;
  max-width: none !important;
  table-layout: auto !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(thead, tbody, tr) {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th, td) {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  min-width: 96px !important;
  max-width: 360px !important;
  padding: 15px 16px !important;
  line-height: 1.32 !important;
  vertical-align: middle !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th, td) > * {
  max-width: 100% !important;
  min-width: 0 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(.s360-pill, .s360-status-pill, .s360-btn, button) {
  display: inline-flex !important;
  width: auto !important;
  max-width: 100% !important;
  white-space: normal !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th:first-child, td:first-child) {
  min-width: 64px !important;
  max-width: 92px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th:last-child, td:last-child) {
  min-width: 150px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 3 !important;
  white-space: normal !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) thead th {
  background: rgba(8, 18, 33, .98) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) thead th {
  background: rgba(247, 250, 255, .98) !important;
}

#system360-app .s360-app.s360-app-system .s360-folder-tabs {
  margin-top: 18px !important;
  padding: 4px !important;
  border: 1px solid var(--s360-line-soft) !important;
  border-radius: 14px !important;
  background: var(--s360-surface-soft) !important;
}

#system360-app .s360-app.s360-app-system .s360-folder-tab {
  flex: 1 1 180px !important;
  min-height: 40px !important;
  border-radius: 11px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-folder-tab.active {
  background: rgba(116, 91, 255, .86) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

@media (max-width: 900px) {
  #system360-app .s360-app.s360-app-system .s360-content-scroll {
    padding: 14px !important;
  }

  #system360-app .s360-app.s360-app-system .s360-content-scroll > :is(.s360-panel, section.s360-panel, article.s360-panel, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-quote-builder) {
    padding: 16px !important;
    border-radius: 14px !important;
  }

  #system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) {
    width: 1040px !important;
    min-width: 1040px !important;
  }
}

/* System Visual Polish V38: restore readable tables after no-cut pass. */
#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 16px 0 0 !important;
  padding: 0 !important;
  border-radius: 16px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) {
  display: table !important;
  width: max(100%, 1800px) !important;
  min-width: 1800px !important;
  max-width: none !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(thead, tbody, tr) {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th, td) {
  height: auto !important;
  min-height: 54px !important;
  max-height: none !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 14px 16px !important;
  line-height: 1.25 !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th, td) > * {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(.s360-pill, .s360-status-pill, .s360-btn, button) {
  display: inline-flex !important;
  width: auto !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) th {
  font-size: 12px !important;
  font-weight: 800 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) td {
  font-size: 13px !important;
  font-weight: 650 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) :is(th:first-child, td:first-child) {
  width: 86px !important;
  min-width: 86px !important;
  max-width: 86px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(1), td:nth-child(1)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(1), td:nth-child(1)) {
  width: 94px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(2), td:nth-child(2)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(2), td:nth-child(2)) {
  width: 180px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(3), td:nth-child(3)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(3), td:nth-child(3)) {
  width: 190px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(4), td:nth-child(4)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(4), td:nth-child(4)) {
  width: 230px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(5), td:nth-child(5)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(5), td:nth-child(5)) {
  width: 160px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(6), td:nth-child(6)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(6), td:nth-child(6)) {
  width: 160px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(7), td:nth-child(7)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(7), td:nth-child(7)) {
  width: 150px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(8), td:nth-child(8)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(8), td:nth-child(8)) {
  width: 210px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:nth-child(9), td:nth-child(9)),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:nth-child(9), td:nth-child(9)) {
  width: 250px !important;
}

#system360-app .s360-app.s360-app-system .s360-table-sales :is(th:last-child, td:last-child),
#system360-app .s360-app.s360-app-system .s360-atc-indexed-table :is(th:last-child, td:last-child) {
  width: 190px !important;
  min-width: 190px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 3 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap)::-webkit-scrollbar {
  height: 10px !important;
  width: 10px !important;
}

@media (max-width: 900px) {
  #system360-app .s360-app.s360-app-system :is(.s360-table, .s360-table-follow, .s360-table-sales, .s360-db360-table, .s360-mis-ventas-table, .s360-backoffice-table, .s360-mod-table, .s360-atcdb-table, .s360-atc-indexed-table, table) {
    width: 1600px !important;
    min-width: 1600px !important;
  }
}

/* System Visual Polish V39: flatten nested module sections. */
#system360-app .s360-app.s360-app-system :is(.s360-atc-shell, .s360-quality-shell, .s360-cobranza-shell, .s360-backoffice-board, .s360-bases-panel) {
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-atc-shell, .s360-quality-shell, .s360-cobranza-shell, .s360-backoffice-board, .s360-bases-panel) > :is(.s360-atc-table-panel, .s360-quality-table-panel, .s360-panel, .s360-section, .s360-box):not(.s360-seguimientos-wrap):not(.s360-table-wrap):not(.s360-sales-table-wrap):not(.s360-db360-table-wrap):not(.s360-atc-horizontal-wrap):not(.s360-atcdb-table-wrap) {
  width: 100% !important;
  max-width: 100% !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-atc-shell, .s360-quality-shell, .s360-cobranza-shell, .s360-backoffice-board, .s360-bases-panel) > :is(.s360-atc-table-panel, .s360-quality-table-panel, .s360-panel, .s360-section, .s360-box):first-child {
  margin-top: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-atc-concentrated-panel, .s360-atc-validation-panel) > .s360-agenda-toolbar,
#system360-app .s360-app.s360-app-system .s360-atc-table-panel > .s360-agenda-toolbar {
  margin-bottom: 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-atc-concentrated-panel, .s360-atc-validation-panel) > .s360-agenda-toolbar h3,
#system360-app .s360-app.s360-app-system .s360-atc-table-panel > h3 {
  margin: 0 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-atc-concentrated-panel, .s360-atc-validation-panel) > .s360-grid.s360-grid-admin,
#system360-app .s360-app.s360-app-system .s360-atc-shell > .s360-grid.s360-grid-admin {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 12px !important;
  margin: 14px 0 18px !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-atc-concentrated-panel, .s360-atc-validation-panel) > .s360-grid.s360-grid-admin > .s360-card,
#system360-app .s360-app.s360-app-system .s360-atc-shell > .s360-grid.s360-grid-admin > .s360-card {
  min-height: 78px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system :is(.s360-atc-concentrated-panel, .s360-atc-validation-panel) > .s360-grid.s360-grid-admin > .s360-card,
#system360-app.s360-theme-dark .s360-app.s360-app-system .s360-atc-shell > .s360-grid.s360-grid-admin > .s360-card {
  border: 1px solid rgba(92, 126, 181, .34) !important;
  background: rgba(14, 29, 50, .58) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-atc-concentrated-panel, .s360-atc-validation-panel) > .s360-grid.s360-grid-admin > .s360-card,
#system360-app.s360-theme-light .s360-app.s360-app-system .s360-atc-shell > .s360-grid.s360-grid-admin > .s360-card {
  border: 1px solid rgba(129, 158, 198, .26) !important;
  background: rgba(255, 255, 255, .68) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-atc-concentrated-panel, .s360-atc-validation-panel) > .s360-grid.s360-grid-admin > .s360-card .k,
#system360-app .s360-app.s360-app-system .s360-atc-shell > .s360-grid.s360-grid-admin > .s360-card .k {
  margin: 0 0 6px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-atc-concentrated-panel, .s360-atc-validation-panel) > .s360-grid.s360-grid-admin > .s360-card .v,
#system360-app .s360-app.s360-app-system .s360-atc-shell > .s360-grid.s360-grid-admin > .s360-card .v {
  font-size: 26px !important;
  font-weight: 850 !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell .s360-atc-section-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell > .s360-agenda-toolbar {
  margin: 0 0 26px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell .s360-atc-section-tabs,
#system360-app .s360-app.s360-app-system .s360-atc-shell .s360-folder-tabs-inline {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell .s360-atc-section-tabs .s360-folder-tab {
  flex: 1 1 190px !important;
  min-height: 42px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(111, 147, 205, .34) !important;
  box-shadow: none !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system .s360-atc-shell .s360-atc-section-tabs .s360-folder-tab {
  background: rgba(12, 28, 48, .62) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-atc-shell .s360-atc-section-tabs .s360-folder-tab {
  background: rgba(255, 255, 255, .62) !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell .s360-atc-section-tabs .s360-folder-tab.active {
  border-color: rgba(139, 92, 246, .62) !important;
  background: rgba(123, 92, 255, .18) !important;
  color: var(--s360-text) !important;
  -webkit-text-fill-color: var(--s360-text) !important;
  box-shadow: inset 0 -3px 0 rgba(139, 92, 246, .95) !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-table-surface {
  margin-top: 18px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-table-panel > :is(.s360-seguimientos-wrap, .s360-atc-horizontal-wrap, .s360-table-wrap, .s360-db360-table-wrap) {
  margin-top: 14px !important;
}

#system360-app .s360-app.s360-app-system .s360-atc-shell :is(.s360-chart-list, .s360-alert-list, .s360-task-kanban, .s360-task-kanban-col-list) {
  max-width: 100% !important;
  overflow: visible !important;
}

@media (max-width: 900px) {
  #system360-app .s360-app.s360-app-system .s360-atc-shell .s360-atc-section-actions {
    grid-template-columns: 1fr !important;
  }

  #system360-app .s360-app.s360-app-system :is(.s360-atc-concentrated-panel, .s360-atc-validation-panel) > .s360-grid.s360-grid-admin,
  #system360-app .s360-app.s360-app-system .s360-atc-shell > .s360-grid.s360-grid-admin {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  }
}

/* System Visual Polish V40: global spacing, alignment and macOS-style surfaces. */
#system360-app,
#system360-app * ,
#system360-app *::before,
#system360-app *::after {
  box-sizing: border-box !important;
}

#system360-app .s360-app.s360-app-system {
  --s360-layout-gap: clamp(14px, 1.4vw, 22px);
  --s360-section-gap: clamp(18px, 1.7vw, 28px);
  --s360-page-pad: clamp(16px, 2vw, 30px);
  --s360-panel-pad: clamp(18px, 2vw, 30px);
  --s360-control-h: 42px;
  --s360-radius-xl: 22px;
  --s360-radius-lg: 18px;
  --s360-radius-md: 14px;
  --s360-glass-border: rgba(126, 160, 214, .30);
  --s360-glass-border-strong: rgba(126, 160, 214, .44);
}

#system360-app .s360-app.s360-app-system .s360-content-scroll {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: var(--s360-page-pad) !important;
  scroll-padding: var(--s360-page-pad) !important;
  overflow-x: hidden !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll > * {
  max-width: 100% !important;
  min-width: 0 !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll > :is(.s360-panel, section.s360-panel, article.s360-panel, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-resumenes-panel, .s360-follow-panel, .s360-tasks-shell, .s360-config-shell, .s360-quote-builder) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 auto var(--s360-section-gap) !important;
  padding: var(--s360-panel-pad) !important;
  border-radius: var(--s360-radius-xl) !important;
  overflow: visible !important;
  box-shadow: none !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system .s360-content-scroll > :is(.s360-panel, section.s360-panel, article.s360-panel, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-resumenes-panel, .s360-follow-panel, .s360-tasks-shell, .s360-config-shell, .s360-quote-builder) {
  border: 1px solid rgba(126, 160, 214, .36) !important;
  background:
    linear-gradient(145deg, rgba(12, 26, 45, .82), rgba(7, 17, 31, .72)),
    rgba(8, 18, 34, .78) !important;
  backdrop-filter: blur(22px) saturate(1.18) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.18) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system .s360-content-scroll > :is(.s360-panel, section.s360-panel, article.s360-panel, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-resumenes-panel, .s360-follow-panel, .s360-tasks-shell, .s360-config-shell, .s360-quote-builder) {
  border: 1px solid rgba(124, 153, 194, .28) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .86), rgba(244, 248, 255, .72)),
    rgba(255, 255, 255, .78) !important;
  backdrop-filter: blur(22px) saturate(1.12) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.12) !important;
}

#system360-app .s360-app.s360-app-system .s360-content-scroll > :is(.s360-panel, section.s360-panel, article.s360-panel, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-resumenes-panel, .s360-follow-panel, .s360-tasks-shell, .s360-config-shell, .s360-quote-builder) > :is(.s360-panel, section.s360-panel, article.s360-panel):not(.s360-component-card):not(.s360-home-sidebar-card):not(.s360-kpi-card):not(.s360-sale-workflow-summary) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: var(--s360-section-gap) 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-panel, .s360-card, .s360-box, .s360-component-card, .s360-home-sidebar-card) {
  max-width: 100% !important;
  min-width: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-card, .s360-component-card, .s360-home-sidebar-card, .s360-kpi-card) {
  padding: clamp(14px, 1.45vw, 20px) !important;
  border-radius: var(--s360-radius-lg) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system :is(.s360-card, .s360-component-card, .s360-home-sidebar-card, .s360-kpi-card) {
  border: 1px solid rgba(126, 160, 214, .26) !important;
  background: rgba(14, 29, 50, .54) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-card, .s360-component-card, .s360-home-sidebar-card, .s360-kpi-card) {
  border: 1px solid rgba(124, 153, 194, .22) !important;
  background: rgba(255, 255, 255, .64) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-agenda-toolbar, .s360-toolbar, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters, .s360-panel-headline, .s360-dash-section-head) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 var(--s360-layout-gap) !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-agenda-toolbar, .s360-toolbar, .s360-db-toolbar, .s360-db360-toolbar, .s360-db360-toolbar-main, .s360-db360-toolbar-filters, .s360-panel-headline, .s360-dash-section-head) > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-agenda-actions, .s360-flex, .s360-filter-row, .s360-actions-row, .s360-db-actions) {
  max-width: 100% !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-grid, .s360-grid-admin, .s360-grid-2, .s360-grid-3, .s360-form-grid, .s360-prod-hero-grid, .s360-weekly-summary-grid, .s360-eff-summary-grid) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  gap: var(--s360-layout-gap) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-grid-admin, .s360-form-grid) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)) !important;
}

#system360-app .s360-app.s360-app-system .s360-grid-2 {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)) !important;
}

#system360-app .s360-app.s360-app-system .s360-grid-3 {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-input, .s360-select, .s360-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]), select, textarea) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: var(--s360-control-h) !important;
  border-radius: 12px !important;
  padding: 10px 13px !important;
  line-height: 1.25 !important;
}

#system360-app .s360-app.s360-app-system label:is(.s360-flex),
#system360-app .s360-app.s360-app-system :is(.s360-db360-field, .s360-filter-field, .s360-toolbar-field, .s360-field, .s360-form-field) {
  min-width: min(100%, 210px) !important;
  max-width: 100% !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-btn, .s360-icon-btn, .s360-filter-btn, .s360-db360-filter-btn, .s360-drop-btn, button) {
  min-height: var(--s360-control-h) !important;
  max-width: 100% !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  line-height: 1.15 !important;
  box-shadow: none !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-icon-btn, button[aria-label]) {
  align-items: center !important;
  justify-content: center !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-folder-tabs, .s360-folder-tabs-inline, .s360-home-tabs, .s360-time-tabs, .s360-alert-center-tabs, .s360-my-sales-view-tabs) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 var(--s360-layout-gap) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-folder-tab, .s360-home-tab-btn, .s360-time-tab, .s360-view-tab) {
  flex: 1 1 170px !important;
  min-width: 0 !important;
  min-height: var(--s360-control-h) !important;
  padding: 10px 14px !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

#system360-app.s360-theme-dark .s360-app.s360-app-system :is(.s360-folder-tab, .s360-home-tab-btn, .s360-time-tab, .s360-view-tab) {
  border: 1px solid rgba(126, 160, 214, .28) !important;
  background: rgba(13, 28, 49, .56) !important;
}

#system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-folder-tab, .s360-home-tab-btn, .s360-time-tab, .s360-view-tab) {
  border: 1px solid rgba(124, 153, 194, .24) !important;
  background: rgba(255, 255, 255, .58) !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-folder-tab.active, .s360-folder-tab.is-active, .s360-home-tab-btn.active, .s360-time-tab.active, .s360-view-tab.active) {
  border-color: rgba(139, 92, 246, .58) !important;
  background: rgba(123, 92, 255, .18) !important;
  color: var(--s360-text) !important;
  -webkit-text-fill-color: var(--s360-text) !important;
  box-shadow: inset 0 -3px 0 rgba(139, 92, 246, .92) !important;
}

#system360-app .s360-app.s360-app-system :is(h1, h2, h3, h4, h5, h6, p, .s360-muted, .k, .v, strong, span) {
  max-width: 100% !important;
}

#system360-app .s360-app.s360-app-system :is(h1, h2, h3, h4, h5, h6) {
  letter-spacing: 0 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

#system360-app .s360-app.s360-app-system :is(p, .s360-muted, .s360-card .k, .s360-card .v) {
  overflow-wrap: anywhere !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-table-wrap, .s360-sales-table-wrap, .s360-seguimientos-wrap, .s360-db360-table-wrap, .s360-atc-horizontal-wrap, .s360-atcdb-table-wrap, .s360-quality-table-panel, .s360-atc-table-panel, .s360-lb360-table-wrap) {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#system360-app .s360-app.s360-app-system :is(.s360-modal, .s360-dropdown, .s360-notif-dropdown, .s360-chat-dropdown, .s360-clock-dropdown) {
  max-width: calc(100vw - 28px) !important;
}

@media (max-width: 900px) {
  #system360-app .s360-app.s360-app-system {
    --s360-page-pad: 12px;
    --s360-panel-pad: 14px;
    --s360-layout-gap: 10px;
    --s360-section-gap: 16px;
  }

  #system360-app .s360-app.s360-app-system .s360-content-scroll > :is(.s360-panel, section.s360-panel, article.s360-panel, .s360-sales-panel, .s360-quality-shell, .s360-atc-shell, .s360-atcdb-shell, .s360-bases-panel, .s360-backoffice-board, .s360-cobranza-shell, .s360-resumenes-panel, .s360-follow-panel, .s360-tasks-shell, .s360-config-shell, .s360-quote-builder) {
    border-radius: 16px !important;
  }

  #system360-app .s360-app.s360-app-system :is(.s360-folder-tab, .s360-home-tab-btn, .s360-time-tab, .s360-view-tab) {
    flex-basis: min(100%, 150px) !important;
  }
}

/* System Visual Polish V41: ATC validation layout fix. */
body #system360-app .s360-app.s360-app-system .s360-atc-validation-panel,
body #system360-app .s360-app.s360-app-system .s360-atc-concentrated-panel {
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body #system360-app .s360-app.s360-app-system .s360-atc-validation-panel > .s360-grid.s360-grid-admin {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: stretch !important;
  width: 100% !important;
  margin: 16px 0 22px !important;
}

body #system360-app .s360-app.s360-app-system .s360-atc-concentrated-panel > .s360-grid.s360-grid-admin {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: stretch !important;
  width: 100% !important;
  margin: 16px 0 22px !important;
}

body #system360-app .s360-app.s360-app-system :is(.s360-atc-validation-panel, .s360-atc-concentrated-panel) > .s360-grid.s360-grid-admin > .s360-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 76px !important;
  height: auto !important;
  padding: 15px 16px !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}

body #system360-app.s360-theme-dark .s360-app.s360-app-system :is(.s360-atc-validation-panel, .s360-atc-concentrated-panel) > .s360-grid.s360-grid-admin > .s360-card {
  border: 1px solid rgba(112, 148, 205, .34) !important;
  background: linear-gradient(145deg, rgba(18, 34, 57, .72), rgba(11, 23, 42, .62)) !important;
}

body #system360-app.s360-theme-light .s360-app.s360-app-system :is(.s360-atc-validation-panel, .s360-atc-concentrated-panel) > .s360-grid.s360-grid-admin > .s360-card {
  border: 1px solid rgba(120, 150, 192, .24) !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, .82), rgba(247, 250, 255, .66)) !important;
}

body #system360-app .s360-app.s360-app-system :is(.s360-atc-validation-panel, .s360-atc-concentrated-panel) > .s360-grid.s360-grid-admin > .s360-card .k,
body #system360-app .s360-app.s360-app-system :is(.s360-atc-validation-panel, .s360-atc-concentrated-panel) > .s360-grid.s360-grid-admin > .s360-card .v {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body #system360-app .s360-app.s360-app-system :is(.s360-atc-validation-panel, .s360-atc-concentrated-panel) > .s360-grid.s360-grid-admin > .s360-card .k {
  font-size: 12px !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
}

body #system360-app .s360-app.s360-app-system :is(.s360-atc-validation-panel, .s360-atc-concentrated-panel) > .s360-grid.s360-grid-admin > .s360-card .v {
  font-size: 28px !important;
  line-height: 1 !important;
  font-weight: 850 !important;
}

body #system360-app .s360-app.s360-app-system .s360-atc-table-surface {
  margin-top: 10px !important;
  padding-top: 0 !important;
}

body #system360-app .s360-app.s360-app-system .s360-atc-table-surface > .s360-agenda-actions {
  display: grid !important;
  grid-template-columns: minmax(220px, 330px) minmax(180px, 240px) auto !important;
  justify-content: start !important;
  align-items: end !important;
  column-gap: 10px !important;
  row-gap: 10px !important;
  width: 100% !important;
  margin: 0 0 14px !important;
}

body #system360-app .s360-app.s360-app-system .s360-atc-table-surface > .s360-agenda-actions > label.s360-flex,
body #system360-app .s360-app.s360-app-system .s360-atc-table-surface > .s360-agenda-actions > .s360-flex {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-end !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  flex: 0 1 auto !important;
}

body #system360-app .s360-app.s360-app-system .s360-atc-table-surface > .s360-agenda-actions .s360-muted {
  display: block !important;
  width: 100% !important;
  min-height: 16px !important;
  text-align: left !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
}

body #system360-app .s360-app.s360-app-system .s360-atc-table-surface > .s360-agenda-actions :is(.s360-input, .s360-select, .s360-btn) {
  width: 100% !important;
  min-height: 42px !important;
}

@media (max-width: 1200px) {
  body #system360-app .s360-app.s360-app-system .s360-atc-validation-panel > .s360-grid.s360-grid-admin,
  body #system360-app .s360-app.s360-app-system .s360-atc-concentrated-panel > .s360-grid.s360-grid-admin {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  body #system360-app .s360-app.s360-app-system .s360-atc-validation-panel > .s360-grid.s360-grid-admin,
  body #system360-app .s360-app.s360-app-system .s360-atc-concentrated-panel > .s360-grid.s360-grid-admin {
    grid-template-columns: 1fr !important;
  }

  body #system360-app .s360-app.s360-app-system .s360-atc-table-surface > .s360-agenda-actions {
    grid-template-columns: 1fr !important;
  }
}