/* ============================================================
   SHADOWMERE — SHADOW NETWORK PANEL (ARCANE THEME)
   ============================================================ */

.shadow-network-panel {
    font-size: 13px;
    color: #e4e6ff;
    padding: 10px 14px;
    background: radial-gradient(circle at top, rgba(60,40,100,0.95) 0%, rgba(10,8,20,0.98) 55%, #05030a 100%);
    box-shadow: 0 0 22px rgba(0,0,0,0.9) inset;
    position: relative; /* required for close button */
}

/* CLOSE BUTTON */
.panel-close-btn {
    position: absolute;
    top: 10px;
    right: 14px;
    font-size: 26px;
    cursor: pointer;
    color: #e6d9ff;
    text-shadow: 0 0 10px rgba(150, 80, 255, 0.6);
    transition: 0.2s ease;
    z-index: 50;
}

.panel-close-btn:hover {
    color: #ffffff;
    transform: scale(1.15);
    text-shadow: 0 0 14px rgba(200, 150, 255, 0.9);
}

/* HEADER */

.sn-header {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(180,160,240,0.25);
    padding-bottom: 6px;
}

.sn-header-main {
    display: flex;
    flex-direction: column;
}

.sn-title {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #f6f0ff;
}

.sn-motto {
    font-size: 12px;
    color: #c9b8ff;
    opacity: 0.9;
}

.sn-header-meta {
    font-size: 12px;
    color: #b9bde5;
}

.sn-description {
    margin-bottom: 2px;
}

.sn-stats {
    opacity: 0.9;
}

.sn-header-actions {
    display: flex;
    gap: 6px;
    margin-top: 4px;
}

.sn-header-actions button {
    font-size: 11px;
    padding: 4px 8px;
    border-radius: 4px;
    border: 1px solid rgba(190,160,255,0.9);
    background: linear-gradient(to bottom, #7b5cff, #3a2a7a);
    color: #fdfbff;
    cursor: pointer;
    text-shadow: 0 0 3px rgba(0,0,0,0.9);
    box-shadow: 0 0 6px rgba(0,0,0,0.8);
}

.sn-header-actions button:hover {
    background: linear-gradient(to bottom, #9274ff, #46318f);
}

/* TABS */

.sn-tabs {
    display: flex;
    gap: 6px;
    margin-bottom: 10px;
}

.sn-tab {
    padding: 5px 10px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    border-radius: 4px 4px 0 0;
    border: 1px solid transparent;
    color: #c7cbe8;
    background: linear-gradient(to bottom, rgba(25,20,50,0.9), rgba(10,8,20,0.95));
    box-shadow: 0 0 6px rgba(0,0,0,0.7);
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease, transform 80ms ease;
}

.sn-tab:hover {
    border-color: rgba(160,140,230,0.7);
    background: linear-gradient(to bottom, rgba(45,35,80,0.95), rgba(15,10,30,0.98));
    transform: translateY(-1px);
}

.sn-tab-active {
    border-color: rgba(200,180,255,0.9);
    background: linear-gradient(to bottom, #3f2f7a, #1a132f);
    color: #f5f6ff;
}

/* DYNAMIC CONTAINER */

.sn-dynamic-container {
    min-height: 220px;
}

/* SECTIONS */

.sn-section {
    margin-bottom: 12px;
}

.sn-section-title {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #f0f2ff;
    margin-bottom: 6px;
    border-left: 3px solid #9b7cff;
    padding-left: 8px;
}

/* OVERVIEW CARDS */

.sn-overview-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 10px;
}

.sn-overview-card {
    border-radius: 5px;
    padding: 8px 10px;
    background: radial-gradient(circle at top left, rgba(120,80,190,0.35), rgba(12,10,20,0.98));
    border: 1px solid rgba(150,120,220,0.6);
    box-shadow:
        0 0 10px rgba(0,0,0,0.9),
        0 0 14px rgba(90,60,160,0.45) inset;
}

.sn-overview-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #c9c3ff;
    margin-bottom: 2px;
}

.sn-overview-value {
    font-size: 14px;
    font-weight: 600;
    color: #f6f0ff;
}

/* EMPTY STATE */

.sn-empty {
    font-size: 12px;
    color: #b9bde5;
    opacity: 0.85;
    padding: 8px;
}

/* AGENTS */

.sn-agent-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sn-agent-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 5px;
    padding: 8px 10px;
    background: linear-gradient(to bottom, rgba(25,18,50,0.96), rgba(8,6,18,0.98));
    border: 1px solid rgba(140,120,200,0.6);
    box-shadow: 0 0 10px rgba(0,0,0,0.85);
}

.sn-agent-main {
    display: flex;
    flex-direction: column;
}

.sn-agent-name {
    font-size: 13px;
    font-weight: 600;
    color: #f0f2ff;
}

.sn-agent-meta {
    font-size: 11px;
    color: #a9b4ff;
    display: flex;
    gap: 10px;
}

.sn-agent-actions button {
    font-size: 11px;
    padding: 4px 8px;
    border-radius: 4px;
    border: 1px solid rgba(210,140,255,0.9);
    background: linear-gradient(to bottom, #8a3bb8, #4a1f6b);
    color: #f5f8ff;
    cursor: pointer;
    text-shadow: 0 0 3px rgba(0,0,0,0.9);
}

/* INVITES */

.sn-invite-controls {
    display: flex;
    gap: 6px;
    margin-bottom: 8px;
}

.sn-invite-controls input {
    flex: 1;
    font-size: 12px;
    padding: 4px 6px;
    border-radius: 4px;
    border: 1px solid rgba(150,130,210,0.8);
    background: rgba(10,8,20,0.95);
    color: #e4e6ff;
}

.sn-invite-controls button {
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid rgba(190,160,255,0.9);
    background: linear-gradient(to bottom, #7b5cff, #3a2a7a);
    color: #fdfbff;
    cursor: pointer;
}

.sn-invite-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sn-invite-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 5px;
    padding: 6px 8px;
    background: linear-gradient(to bottom, rgba(25,18,50,0.96), rgba(8,6,18,0.98));
    border: 1px solid rgba(140,120,200,0.6);
}

.sn-invite-name {
    font-size: 12px;
    color: #f0f2ff;
}

.sn-invite-actions button {
    font-size: 11px;
    padding: 3px 8px;
    border-radius: 4px;
    border: 1px solid rgba(210,140,255,0.9);
    background: linear-gradient(to bottom, #8a3bb8, #4a1f6b);
    color: #f5f8ff;
    cursor: pointer;
}

/* MESSAGES */

.sn-message-compose {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 8px;
}

.sn-message-compose input,
.sn-message-compose textarea {
    font-size: 12px;
    padding: 4px 6px;
    border-radius: 4px;
    border: 1px solid rgba(150,130,210,0.8);
    background: rgba(10,8,20,0.95);
    color: #e4e6ff;
}

.sn-message-compose textarea {
    min-height: 60px;
    resize: vertical;
}

.sn-message-compose button {
    align-self: flex-end;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid rgba(190,160,255,0.9);
    background: linear-gradient(to bottom, #7b5cff, #3a2a7a);
    color: #fdfbff;
    cursor: pointer;
}

.sn-message-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sn-message-row {
    border-radius: 5px;
    padding: 6px 8px;
    background: linear-gradient(to bottom, rgba(25,18,50,0.96), rgba(8,6,18,0.98));
    border: 1px solid rgba(140,120,200,0.6);
}

.sn-message-header {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: #a9b4ff;
    margin-bottom: 2px;
}

.sn-message-body {
    font-size: 12px;
    color: #e4e6ff;
}

/* LOGISTICS */

.sn-logistics-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.sn-logistics-controls input {
    font-size: 12px;
    padding: 4px 6px;
    border-radius: 4px;
    border: 1px solid rgba(150,130,210,0.8);
    background: rgba(10,8,20,0.95);
    color: #e4e6ff;
}

.sn-logistics-controls button {
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid rgba(190,160,255,0.9);
    background: linear-gradient(to bottom, #7b5cff, #3a2a7a);
    color: #fdfbff;
    cursor: pointer;
}

.sn-logistics-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sn-logistics-row {
    border-radius: 5px;
    padding: 6px 8px;
    background: linear-gradient(to bottom, rgba(25,18,50,0.96), rgba(8,6,18,0.98));
    border: 1px solid rgba(140,120,200,0.6);
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #e4e6ff;
}

.sn-logistics-main span {
    margin-right: 10px;
}

.sn-logistics-time {
    font-size: 11px;
    color: #a9b4ff;
}

/* OPERATIONS */

.sn-ops-description {
    font-size: 12px;
    color: #c2c6f5;
    margin-bottom: 6px;
}

.sn-ops-placeholder {
    font-size: 11px;
    color: #9ca2d8;
    margin-bottom: 6px;
}

.sn-ops-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sn-ops-row {
    border-radius: 5px;
    padding: 6px 8px;
    background: linear-gradient(to bottom, rgba(25,18,50,0.96), rgba(8,6,18,0.98));
    border: 1px solid rgba(140,120,200,0.6);
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #e4e6ff;
}

.sn-ops-main span {
    margin-right: 10px;
}

.sn-ops-time {
    font-size: 11px;
    color: #a9b4ff;
}

/* AGENT OVERVIEW */

.sn-agent-overview {
    font-size: 12px;
    color: #c2c6f5;
}

.sn-highlight {
    color: #f6f0ff;
    font-weight: 600;
}