.dropdown {
    position: absolute;
    top: 60px;
    /* right: 20px; */
    background-color: #2c2f33;
    border: 1px solid #3a3d41;
    border-radius: 8px;
    width: 150px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    padding: 8px 0;
}

.dropdown a {
    color: #ffffff;
    padding: 10px 20px;
    text-decoration: none;
    font-size: 0.9rem;
    transition: background-color 0.2s;
}

.dropdown a:hover {
    background-color: #3a3f45;
}

.hidden {
    display: none;
}

nav.bg-gray-800.p-4 {
    position: fixed;
    width: -webkit-fill-available;
    z-index: 700;
}

.top-0 {
    height: 72px;
    width: 95%;
    display: block;
}


[class^="icon_"] {
    width: 2rem;
    height: 2rem;
    display: inline-block;
    background-color: currentColor;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    color: white;
}

.icon_NexusBot {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
}

/* icons */
.icon_edit {
    -webkit-mask: url("./svg/edit.svg") no-repeat center / contain;
    mask: url("./svg/edit.svg") no-repeat center / contain;
}

.icon_edit_fill {
    -webkit-mask: url("./svg/edit_fill.svg") no-repeat center / contain;
    mask: url("./svg/edit_fill.svg") no-repeat center / contain;
}

.icon_code {
    -webkit-mask: url("./svg/code.svg") no-repeat center / contain;
    mask: url("./svg/code.svg") no-repeat center / contain;
}

.icon_close {
    -webkit-mask: url("./svg/close.svg") no-repeat center / contain;
    mask: url("./svg/close.svg") no-repeat center / contain;
}

.icon_clock {
    -webkit-mask: url("./svg/clock.svg") no-repeat center / contain;
    mask: url("./svg/clock.svg") no-repeat center / contain;
}

.icon_clock_fill {
    -webkit-mask: url("./svg/clock_fill.svg") no-repeat center / contain;
    mask: url("./svg/clock_fill.svg") no-repeat center / contain;
}

.icon_plus {
    -webkit-mask: url("./svg/plus.svg") no-repeat center / contain;
    mask: url("./svg/plus.svg") no-repeat center / contain;
}

.icon_share {
    -webkit-mask: url("./svg/share.svg") no-repeat center / contain;
    mask: url("./svg/share.svg") no-repeat center / contain;
}

.icon_save {
    -webkit-mask: url("./svg/save.svg") no-repeat center / contain;
    mask: url("./svg/save.svg") no-repeat center / contain;
}

.icon_save_fill {
    -webkit-mask: url("./svg/save_fill.svg") no-repeat center / contain;
    mask: url("./svg/save_fill.svg") no-repeat center / contain;
}

.icon_link {
    -webkit-mask: url("./svg/link.svg") no-repeat center / contain;
    mask: url("./svg/link.svg") no-repeat center / contain;
}

.icon_search {
    -webkit-mask: url("./svg/search.svg") no-repeat center / contain;
    mask: url("./svg/search.svg") no-repeat center / contain;
}

.icon_refrsh {
    -webkit-mask: url("./svg/refrsh.svg") no-repeat center / contain;
    mask: url("./svg/refrsh.svg") no-repeat center / contain;
}

.icon_q {
    -webkit-mask: url("./svg/q.svg") no-repeat center / contain;
    mask: url("./svg/q.svg") no-repeat center / contain;
}

.icon_q_fill {
    -webkit-mask: url("./svg/q_fill.svg") no-repeat center / contain;
    mask: url("./svg/q_fill.svg") no-repeat center / contain;
}

.icon_tag {
    -webkit-mask: url("./svg/tag.svg") no-repeat center / contain;
    mask: url("./svg/tag.svg") no-repeat center / contain;
}

.icon_tag_fill {
    -webkit-mask: url("./svg/tag_fill.svg") no-repeat center / contain;
    mask: url("./svg/tag_fill.svg") no-repeat center / contain;
}

.icon_trash {
    -webkit-mask: url("./svg/trash.svg") no-repeat center / contain;
    mask: url("./svg/trash.svg") no-repeat center / contain;
}

.icon_trash_fill {
    -webkit-mask: url("./svg/trash_fill.svg") no-repeat center / contain;
    mask: url("./svg/trash_fill.svg") no-repeat center / contain;
}

.icon_user {
    -webkit-mask: url("./svg/user.svg") no-repeat center / contain;
    mask: url("./svg/user.svg") no-repeat center / contain;
}

.icon_user_fill {
    -webkit-mask: url("./svg/user_fill.svg") no-repeat center / contain;
    mask: url("./svg/user_fill.svg") no-repeat center / contain;
}

.icon_text_color {
    -webkit-mask: url("./svg/text_color.svg") no-repeat center / contain;
    mask: url("./svg/text_color.svg") no-repeat center / contain;
}

.icon_discord {
    -webkit-mask: url("./svg/discord.svg") no-repeat center / contain;
    mask: url("./svg/discord.svg") no-repeat center / contain;
}

.icon_verify {
    -webkit-mask: url("./svg/verify.svg") no-repeat center / contain;
    mask: url("./svg/verify.svg") no-repeat center / contain;
}

.icon_book {
    -webkit-mask: url("./svg/book.svg") no-repeat center / contain;
    mask: url("./svg/book.svg") no-repeat center / contain;
}

.icon_book_fill {
    -webkit-mask: url("./svg/book_fill.svg") no-repeat center / contain;
    mask: url("./svg/book_fill.svg") no-repeat center / contain;
}

.icon_book_open {
    -webkit-mask: url("./svg/book_open.svg") no-repeat center / contain;
    mask: url("./svg/book_open.svg") no-repeat center / contain;
}

.icon_book_open_fill {
    -webkit-mask: url("./svg/book_open_fill.svg") no-repeat center / contain;
    mask: url("./svg/book_open_fill.svg") no-repeat center / contain;
}

.icon_bug {
    -webkit-mask: url("./svg/bug.svg") no-repeat center / contain;
    mask: url("./svg/bug.svg") no-repeat center / contain;
}

.icon_bug_fill {
    -webkit-mask: url("./svg/bug_fill.svg") no-repeat center / contain;
    mask: url("./svg/bug_fill.svg") no-repeat center / contain;
}

.icon_warn {
    -webkit-mask: url("./svg/warn.svg") no-repeat center / contain;
    mask: url("./svg/warn.svg") no-repeat center / contain;
}

.icon_warn_fill {
    -webkit-mask: url("./svg/warn_fill.svg") no-repeat center / contain;
    mask: url("./svg/warn_fill.svg") no-repeat center / contain;
}

.icon_settings {
    -webkit-mask: url("./svg/settings.svg") no-repeat center / contain;
    mask: url("./svg/settings.svg") no-repeat center / contain;
}

.icon_fork {
    -webkit-mask: url("./svg/fork.svg") no-repeat center / contain;
    mask: url("./svg/fork.svg") no-repeat center / contain;
}

.icon_fork_fill {
    -webkit-mask: url("./svg/fork_fill.svg") no-repeat center / contain;
    mask: url("./svg/fork_fill.svg") no-repeat center / contain;
}

.icon_global {
    -webkit-mask: url("./svg/global.svg") no-repeat center / contain;
    mask: url("./svg/global.svg") no-repeat center / contain;
}

.icon_global_fill {
    -webkit-mask: url("./svg/global_fill.svg") no-repeat center / contain;
    mask: url("./svg/global_fill.svg") no-repeat center / contain;
}

.icon_colors {
    -webkit-mask: url("./svg/colors.svg") no-repeat center / contain;
    mask: url("./svg/colors.svg") no-repeat center / contain;
}

.icon_love {
    -webkit-mask: url("./svg/love.svg") no-repeat center / contain;
    mask: url("./svg/love.svg") no-repeat center / contain;
}

.icon_love_fill {
    -webkit-mask: url("./svg/love_fill.svg") no-repeat center / contain;
    mask: url("./svg/love_fill.svg") no-repeat center / contain;
}

.icon_info {
    -webkit-mask: url("./svg/info.svg") no-repeat center / contain;
    mask: url("./svg/info.svg") no-repeat center / contain;
}

.icon_info_fill {
    -webkit-mask: url("./svg/info_fill.svg") no-repeat center / contain;
    mask: url("./svg/info_fill.svg") no-repeat center / contain;
}

.icon_img {
    -webkit-mask: url("./svg/img.svg") no-repeat center / contain;
    mask: url("./svg/img.svg") no-repeat center / contain;
}

.icon_img_fill {
    -webkit-mask: url("./svg/img_fill.svg") no-repeat center / contain;
    mask: url("./svg/img_fill.svg") no-repeat center / contain;
}

.icon_heart {
    -webkit-mask: url("./svg/heart.svg") no-repeat center / contain;
    mask: url("./svg/heart.svg") no-repeat center / contain;
}

.icon_plus_c {
    -webkit-mask: url("./svg/plus_c.svg") no-repeat center / contain;
    mask: url("./svg/plus_c.svg") no-repeat center / contain;
}

.icon_more_1 {
    -webkit-mask: url("./svg/more_1.svg") no-repeat center / contain;
    mask: url("./svg/more_1.svg") no-repeat center / contain;
}

.icon_more_2 {
    -webkit-mask: url("./svg/more_2.svg") no-repeat center / contain;
    mask: url("./svg/more_2.svg") no-repeat center / contain;
}

.icon_v {
    -webkit-mask: url("./svg/v.svg") no-repeat center / contain;
    mask: url("./svg/v.svg") no-repeat center / contain;
}

.icon_alert {
    -webkit-mask: url("./svg/alert.svg") no-repeat center / contain;
    mask: url("./svg/alert.svg") no-repeat center / contain;
}

.icon_menu {
    -webkit-mask: url("./svg/menu.svg") no-repeat center / contain;
    mask: url("./svg/menu.svg") no-repeat center / contain;
}

.icon_members {
    -webkit-mask: url("./svg/members.svg") no-repeat center / contain;
    mask: url("./svg/members.svg") no-repeat center / contain;
}

.icon_list {
    -webkit-mask: url("./svg/list.svg") no-repeat center / contain;
    mask: url("./svg/list.svg") no-repeat center / contain;
}

.icon_cmd {
    -webkit-mask: url("./svg/cmd.svg") no-repeat center / contain;
    mask: url("./svg/cmd.svg") no-repeat center / contain;
}

.icon_home {
    -webkit-mask: url("./svg/home.svg") no-repeat center / contain;
    mask: url("./svg/home.svg") no-repeat center / contain;
}

.icon_systems {
    -webkit-mask: url("./svg/Settings_2.svg") no-repeat center / contain;
    mask: url("./svg/Settings_2.svg") no-repeat center / contain;
}

.icon_rules {
    -webkit-mask: url("./svg/rule.svg") no-repeat center / contain;
    mask: url("./svg/rule.svg") no-repeat center / contain;
}

.icon_history {
    -webkit-mask: url("./svg/history.svg") no-repeat center / contain;
    mask: url("./svg/history.svg") no-repeat center / contain;
}

.icon_lightning {
    -webkit-mask: url("./svg/Lightning.svg") no-repeat center / contain;
    mask: url("./svg/Lightning.svg") no-repeat center / contain;
    position: absolute;
    right: -30px;
    bottom: 8px;
    background-color: #ffff40;
}

.icon_lock {
    -webkit-mask: url("./svg/lock.svg") no-repeat center / contain;
    mask: url("./svg/lock.svg") no-repeat center / contain;
}

.icon_NexusBot {
    background-image: url("./svg/NexusBot.svg");
}

.icon_a_NexusBot_off {
    background-image: url("./svg/a_NexusBot_off.svg");
    background-color: transparent;
}

.icon_a_NexusBot_load {
    background-image: url("./svg/a_NexusBot_load.svg");
    background-color: transparent;
}


:root {
  /* צבעי בסיס לדארק מוד */
  --popui-bg: #111827;
  --popui-surface: #1f2937;
  --popui-text: #f9fafb;
  --popui-text-muted: #9ca3af;
  --popui-border: #374151;
  
  /* צבעי סטטוס */
  --popui-success: #10b981;
  --popui-error: #ef4444;
  --popui-warning: #f59e0b;
  --popui-info: #3b82f6;
  
  --popui-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.5);
}

body {
  /* רק בשביל ההדגמה, מניח שהאתר שלך כהה */
  background-color: #030712; 
}

/* === התראות צד (Toasts) === */
.popui-toast-container {
  position: fixed;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 16px;
  pointer-events: none;
}
.popui-toast-container.top-right { top: 24px; right: 24px; }
.popui-toast-container.top-left { top: 24px; left: 24px; }
.popui-toast-container.bottom-right { bottom: 24px; right: 24px; }
.popui-toast-container.bottom-left { bottom: 24px; left: 24px; }

.popui-toast {
  background: var(--popui-surface);
  color: var(--popui-text);
  padding: 16px 20px;
  border-radius: 12px;
  box-shadow: var(--popui-shadow);
  pointer-events: auto;
  font-family: system-ui, -apple-system, sans-serif;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 12px;
  animation: slideIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
  border: 1px solid var(--popui-border);
  direction: rtl;
}

/* הזרקת צבעים לפי סוג ההודעה */
.popui-toast.success { border-right: 4px solid var(--popui-success); box-shadow: 0 0 15px rgba(16, 185, 129, 0.1); }
.popui-toast.error { border-right: 4px solid var(--popui-error); box-shadow: 0 0 15px rgba(239, 68, 68, 0.1); }
.popui-toast.warning { border-right: 4px solid var(--popui-warning); box-shadow: 0 0 15px rgba(245, 158, 11, 0.1); }
.popui-toast.info { border-right: 4px solid var(--popui-info); box-shadow: 0 0 15px rgba(59, 130, 246, 0.1); }

.popui-icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

/* === חלונות קופצים במרכז (Modals) === */
.popui-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(8px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10000;
  opacity: 0;
  transition: opacity 0.3s ease;
  direction: rtl;
}
.popui-overlay.show { opacity: 1; }

.popui-box {
  background: var(--popui-surface);
  border: 1px solid var(--popui-border);
  width: 90%;
  max-width: 420px;
  border-radius: 16px;
  padding: 32px 24px 24px;
  box-shadow: var(--popui-shadow);
  transform: scale(0.9) translateY(20px);
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  font-family: system-ui, -apple-system, sans-serif;
  position: relative;
  text-align: center;
}
.popui-overlay.show .popui-box { transform: scale(1) translateY(0); }

.popui-modal-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 16px;
  padding: 12px;
  border-radius: 50%;
  background: var(--popui-bg);
}
.popui-modal-icon.success { color: var(--popui-success); box-shadow: 0 0 20px rgba(16, 185, 129, 0.2); }
.popui-modal-icon.error { color: var(--popui-error); box-shadow: 0 0 20px rgba(239, 68, 68, 0.2); }
.popui-modal-icon.warning { color: var(--popui-warning); box-shadow: 0 0 20px rgba(245, 158, 11, 0.2); }
.popui-modal-icon.info { color: var(--popui-info); box-shadow: 0 0 20px rgba(59, 130, 246, 0.2); }

.popui-title { margin: 0 0 12px 0; font-size: 1.5rem; color: var(--popui-text); font-weight: 600; }
.popui-text { margin: 0 0 24px 0; color: var(--popui-text-muted); line-height: 1.6; font-size: 1rem; }

.popui-input {
  width: 100%;
  padding: 14px;
  background: var(--popui-bg);
  border: 1px solid var(--popui-border);
  color: var(--popui-text);
  border-radius: 8px;
  margin-bottom: 24px;
  font-size: 1rem;
  outline: none;
  transition: all 0.2s;
  box-sizing: border-box;
}
.popui-input:focus { border-color: var(--popui-info); box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2); }

.popui-buttons { display: flex; gap: 12px; justify-content: center; }
.popui-btn {
  padding: 12px 24px;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.2s;
  flex: 1;
}
.popui-btn-confirm { background: var(--popui-info); color: white; }
.popui-btn-confirm.error { background: var(--popui-error); }
.popui-btn-confirm.success { background: var(--popui-success); }
.popui-btn-confirm:hover { filter: brightness(1.1); transform: translateY(-2px); }

.popui-btn-cancel { background: var(--popui-bg); color: var(--popui-text); border: 1px solid var(--popui-border); }
.popui-btn-cancel:hover { background: #273344; }

@keyframes slideIn { 0% { transform: translateX(100%); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } }
@keyframes slideOut { 0% { transform: translateX(0); opacity: 1; } 100% { transform: translateX(100%); opacity: 0; } }