/* Seamless inline editing (pairs with js/inline-edit.js). Fields look like
   plain text until hovered/focused; explicit Save buttons show only when JS
   is unavailable; destructive actions live in a kebab menu. */

/* hide fallback Save buttons once JS confirmed */
.ie-js .ie-save { display: none !important; }

.ie-field,
select.ie-field,
input.ie-field {
    border: 1px solid transparent;
    background: transparent;
    border-radius: 4px;
    transition: border-color 0.12s ease, background 0.12s ease;
}

tr:hover .ie-field,
.list-group-item:hover .ie-field {
    border-color: #e3dccd;
}

.ie-field:focus {
    border-color: #b08d57;
    background: #fff;
    box-shadow: 0 0 0 0.15rem rgba(176, 141, 87, 0.18);
    outline: none;
}

/* background-save feedback */
.ie-field.ie-saved { border-color: #28a745 !important; box-shadow: 0 0 0 0.15rem rgba(40, 167, 69, 0.18); }
.ie-field.ie-save-error { border-color: #b03030 !important; box-shadow: 0 0 0 0.15rem rgba(176, 48, 48, 0.18); }

/* --- kebab menu (no-JS friendly: native <details>) --- */
details.ie-menu {
    position: relative;
    display: inline-block;
}

details.ie-menu > summary {
    list-style: none;
    cursor: pointer;
    padding: 0.1rem 0.55rem;
    border-radius: 4px;
    color: #8a8478;
    font-weight: 700;
    letter-spacing: 0.1em;
    user-select: none;
}

details.ie-menu > summary::-webkit-details-marker { display: none; }

details.ie-menu > summary:hover,
details.ie-menu[open] > summary {
    background: rgba(176, 141, 87, 0.12);
    color: #b08d57;
}

details.ie-menu .ie-menu-body {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    z-index: 20;
    min-width: 9rem;
    background: #fff;
    border: 1px solid #e3dccd;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(60, 50, 30, 0.16);
    padding: 0.3rem;
}

details.ie-menu .ie-menu-body form { margin: 0; }

details.ie-menu .ie-menu-body button,
details.ie-menu .ie-menu-body a {
    display: block;
    width: 100%;
    text-align: left;
    border: none;
    background: none;
    padding: 0.4rem 0.8rem;
    border-radius: 5px;
    font-size: 0.92rem;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

details.ie-menu .ie-menu-body button:hover,
details.ie-menu .ie-menu-body a:hover { background: rgba(176, 141, 87, 0.10); }

details.ie-menu .ie-menu-body .ie-danger { color: #b03030; }
details.ie-menu .ie-menu-body .ie-danger:hover { background: rgba(176, 48, 48, 0.08); }

/* --- dark mode --- */
.dark-mode tr:hover .ie-field,
.dark-mode .list-group-item:hover .ie-field { border-color: #3a3a42; }
.dark-mode .ie-field:focus { background: #232328; border-color: #d8b98c; }
.dark-mode details.ie-menu .ie-menu-body {
    background: #1a1a1e;
    border-color: #3a3a42;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.55);
}