/* ==========================================================================
   导航管理插件 · 样式
   ⚠️ 只用既有 --mn-* 变量（新造变量 → 夜间「浅底浅字」）
   ========================================================================== */

/* ---------- 后台：布局 ---------- */
.nm-hint {
    padding: 12px 16px;
    background: color-mix(in srgb, var(--mn-primary, #f97316) 6%, var(--mn-bg-card, #fff));
    border-left: 3px solid var(--mn-primary, #f97316);
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.7;
    color: var(--mn-text-secondary, #555);
}
.nm-hint b { color: var(--mn-text, #333); }

.nm-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 14px 20px;
    margin-bottom: 16px;
}
.nm-form-grid .form-group { margin: 0; }
.nm-form-grid .form-group label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    color: var(--mn-text-secondary, #555);
    font-weight: 500;
}
.nm-form-grid .form-input {
    width: 100%;
    box-sizing: border-box;
}

.nm-tip {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: var(--mn-text-muted, #888);
    line-height: 1.6;
}
.nm-tip code {
    padding: 1px 5px;
    background: var(--mn-bg-row-hover);
    border: 1px solid var(--mn-border-light, #eef0f3);
    border-radius: 4px;
    font-size: 11.5px;
    color: var(--mn-text, #333);
}
.nm-tip a { color: var(--mn-primary, #f97316); }

.nm-table-scroll {
    width: 100%;
    overflow-x: auto;
}

.nm-table th, .nm-table td {
    white-space: nowrap;
}
.nm-table .nm-url {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: ui-monospace, Consolas, monospace;
    font-size: 12.5px;
    color: var(--mn-text-secondary, #555);
}
.nm-table .nm-drag-handle {
    text-align: center;
    color: var(--mn-text-muted, #888);
    user-select: none;
    font-size: 15px;
    letter-spacing: -1px;
    cursor: grab;
}
.nm-table tr:hover .nm-drag-handle { color: var(--mn-primary, #f97316); }
.nm-table tr.nm-dragging .nm-drag-handle { cursor: grabbing; }

.nm-tag {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11.5px;
    line-height: 1.5;
    background: color-mix(in srgb, var(--mn-text-muted, #888) 15%, transparent);
    color: var(--mn-text-muted, #888);
    white-space: nowrap;
}
.nm-tag-on    { background: color-mix(in srgb, var(--mn-success, #16a34a) 15%, transparent); color: var(--mn-success, #16a34a); }
.nm-tag-off   { background: color-mix(in srgb, var(--mn-text-muted, #888) 15%, transparent); color: var(--mn-text-muted, #888); }
.nm-tag-login { background: color-mix(in srgb, #3b82f6 15%, transparent); color: #3b82f6; }
.nm-tag-admin { background: linear-gradient(135deg, #f59e0b, #ef4444); color: #fff; }

.nm-w-40  { width: 40px;  }
.nm-w-56  { width: 56px;  }
.nm-w-60  { width: 60px;  }
.nm-w-70  { width: 70px;  }
.nm-w-80  { width: 80px;  }
.nm-w-90  { width: 90px;  }
.nm-w-220 { width: 220px; }

/* Alpine x-cloak 兜底（核心若已定义不会冲突） */
[x-cloak] { display: none !important; }

/* ---------- 后台：按钮行 / 行内操作 / 页脚（P2-4：原 nv-* 四类未定义 → 统一 nm-*） ---------- */
.nm-form-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 4px;
}
.nm-row-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    /* 原为 wrap：三个按钮（编辑 / 禁用-启用 / 删除）在窄列里会被挤成 2 行。
       改 nowrap 后本容器的 min-content = 三按钮宽度之和 → 表格自动布局不会再压缩该列，
       列宽 nm-w-220 只是给足余量（移动端靠 .nm-table-scroll 横向滚动）。 */
    flex-wrap: nowrap;
}
.nm-admin-footer {
    margin: 18px 0 6px;
}
.nm-admin-back {
    color: var(--mn-text-secondary, #555);
    text-decoration: none;
    font-size: 13px;
}
.nm-admin-back:hover { color: var(--mn-primary, #f97316); }

/* ---------- 后台：图标选择器（系统内置 20 个常用图标） ---------- */
.nm-icon-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px;
    border: 1px solid var(--mn-border, #e5e7eb);
    border-radius: 8px;
    background: var(--mn-bg-card, #fff);
}
.nm-icon-opt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 9px;
    border: 1px solid var(--mn-border-light, #eef0f3);
    border-radius: 6px;
    background: transparent;
    color: var(--mn-text-secondary, #555);
    font-family: inherit;
    font-size: 12.5px;
    line-height: 1;
    cursor: pointer;
    transition: background .12s, color .12s, border-color .12s;
}
.nm-icon-opt:hover {
    border-color: var(--mn-primary, #f97316);
    color: var(--mn-primary, #f97316);
}
.nm-icon-opt.nm-icon-on {
    border-color: var(--mn-primary, #f97316);
    background: color-mix(in srgb, var(--mn-primary, #f97316) 12%, transparent);
    color: var(--mn-primary, #f97316);
}
.nm-icon-none { min-width: 0; }

/* ---------- 前台：自定义顶部导航下拉 ---------- */
.nm-nav-dropdown {
    position: relative;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}

/* 字号 / 字重 / 内边距与核心 .mn-nav-links a 完全一致（modern.css:236-247）
   → 带下拉的导航项与普通主导航项「一样大」 */
.nm-nav-dropdown > .nm-nav-dropdown-toggle {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    text-decoration: none;
    padding: 6px 14px;
    border-radius: 6px;
    /* 跟随主题导航文字色：默认主题导航栏是浅底，写死 #fff = 白底白字不可见 */
    color: var(--mn-text-nav, #5b6778);
    font-size: 14px;
    font-weight: 450;
    border: 0;
    background: transparent;
    font-family: inherit;
    /* 行高必须与核心 .mn-nav-links a 的有效行高一致：
       核心那条规则**未声明** line-height → 继承 body{line-height:1.6}（modern.css:11-13）。
       插件原写 1.4 → 盒子矮 2.8px，悬停高亮比普通导航项「矮一截、上沿偏低」，
       看起来就像「带下拉的菜单稍微低一些」。写 1.6 后两者盒模型完全一致。 */
    line-height: 1.6;
    transition: background .15s, color .15s;
}
.nm-nav-dropdown > .nm-nav-dropdown-toggle:hover,
.nm-nav-dropdown.nm-open > .nm-nav-dropdown-toggle {
    /* 与核心 .mn-nav-links a:hover 对齐（modern.css:248-252） */
    background: var(--mn-bg-nav-hover);
    color: var(--mn-text-nav-hover);
}
.nm-nav-dropdown > .nm-nav-dropdown-toggle.mn-active {
    /* 与核心 .mn-nav-links a.mn-active 对齐（modern.css:262-266） */
    color: var(--mn-text-nav-hover);
    font-weight: 600;
    background: var(--mn-bg-nav-hover);
}
.nm-nav-dropdown > .nm-nav-dropdown-toggle .nm-arrow {
    font-size: 10px;
    opacity: .6;
    transition: transform .15s;
}
/* 箭头旋转只跟展开态走（PC 不再 hover 展开） */
.nm-nav-dropdown.nm-open > .nm-nav-dropdown-toggle .nm-arrow {
    transform: rotate(180deg);
}

.nm-nav-dropdown > .nm-nav-dropdown-panel {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 180px;
    background: var(--mn-bg-card, #fff);
    border: 1px solid var(--mn-border, #e5e7eb);
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .12);
    padding: 6px;
    margin-top: 4px;
    display: none;
    z-index: 200;
}
/* PC 与移动端一致：点击展开（.nm-open 由 assets/script.js 切换，不再用 :hover） */
.nm-nav-dropdown.nm-open > .nm-nav-dropdown-panel { display: block; }

.nm-nav-dropdown > .nm-nav-dropdown-panel > a {
    display: block;
    padding: 8px 12px;
    border-radius: 6px;
    text-decoration: none;
    color: var(--mn-text, #333);
    font-size: 13.5px;
    line-height: 1.5;
    transition: background .12s, color .12s;
    white-space: nowrap;
}
.nm-nav-dropdown > .nm-nav-dropdown-panel > a:hover {
    background: color-mix(in srgb, var(--mn-primary, #f97316) 8%, transparent);
    color: var(--mn-primary, #f97316);
}

/* 移动端：下拉面板展开为块级（展开判定与 PC 共用 .nm-open） */
@media (max-width: 768px) {
    .nm-nav-dropdown {
        display: block;
        width: 100%;
    }
    .nm-nav-dropdown > .nm-nav-dropdown-toggle {
        width: 100%;
        justify-content: flex-start;
        padding: 10px 12px;
    }
    .nm-nav-dropdown > .nm-nav-dropdown-panel {
        position: static;
        box-shadow: none;
        border: 0;
        border-radius: 0;
        padding: 0 0 6px 12px;
        margin: 0;
        background: transparent;
        display: none;
    }
}

/* ==========================================================================
   零内联改造所需的工具类（2026-09-24）
   原为 views/admin.php 里的静态 style=""，全部转类
   ========================================================================== */
.nm-col-span   { grid-column: 1 / -1; }
.nm-check-row  { display: flex; gap: 18px; flex-wrap: wrap; padding-top: 6px; }
.nm-check-row-tight { gap: 14px; }
.nm-check-item { display: flex; gap: 6px; align-items: center; }
.nm-inline-form { display: inline; }
.nm-mt-10      { margin-top: 10px; }

/* 拖拽中的行（原为 JS 内联 tr.style.opacity） */
.nm-table tr.nm-dragging { opacity: .5; }

/* 拖拽保存提示条（原为 JS 内联 style.cssText + 硬编码 #16a34a） */
.nm-saved-hint {
    position: fixed;
    right: 20px;
    bottom: 20px;
    padding: 8px 14px;
    background: var(--mn-bg-card, #fff);
    color: var(--mn-text, #333);
    border: 1px solid var(--mn-border, #e5e7eb);
    border-left: 3px solid var(--mn-success, #16a34a);
    border-radius: 8px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .15);
    font-size: 13px;
    z-index: 9999;
}

/* 前台语言下拉：当前语言项（原为 Plugin.php 内联 style=""） */
.nm-nav-dropdown > .nm-nav-dropdown-panel > a.nm-lang-active {
    color: var(--mn-primary, #f97316);
    font-weight: 600;
}